Cómo y cuándo usar una etiqueta de énfasis en HTML

Una de las etiquetas que aprenderá al principio de su diseño web La educación es un par de etiquetas conocidas como "etiquetas de énfasis". Echemos un vistazo a qué son estas etiquetas y cómo se utilizan hoy en día en el diseño web.

Volver a XHTML

Si aprendió HTML hace años, mucho antes del surgimiento de HTML5, probablemente utilizó las etiquetas en negrita y cursiva. Como era de esperar, estas etiquetas convirtieron los elementos en texto en negrita o en cursiva, respectivamente. El problema con estas etiquetas, y por qué se dejaron de lado en favor de nuevos elementos (que veremos en breve), es que no son elementos semánticos. Esto se debe a que definen cómo debe verse el texto en lugar de información sobre el texto. Recuerde, HTML (que es donde se escribirían estas etiquetas) tiene que ver con la estructura, no con el estilo visual. Las imágenes son manejadas por CSS y las mejores prácticas de diseño web han sostenido durante mucho tiempo que debe tener una clara separación de estilo y estructura en sus páginas web. Esto significa no utilizar elementos que no sean semánticos y cuyo detalle se vea en lugar de estructura. Por eso los atrevidos y

instagram viewer
cursiva Las etiquetas generalmente se han reemplazado por fuerte (para negrita) y énfasis (para cursiva).

y

Los elementos fuertes y de énfasis agregan información a su texto, detallando el contenido que debe tratarse de manera diferente y enfatizado cuando se habla ese contenido. Usas estos elementos de la misma manera que habrías usado negrita y cursiva en el pasado. Simplemente rodee su texto con las etiquetas de apertura y cierre ( y para enfatizar y y para mayor énfasis) y se enfatizará el texto adjunto.

Puede anidar estas etiquetas y no importa cuál sea la etiqueta externa. Aquí hay unos ejemplos.

Este texto se enfatiza y la mayoría de los navegadores lo mostrarían en cursiva. 
Este texto está fuertemente enfatizado y la mayoría de los navegadores lo mostrarían en negrita. 

En ambos ejemplos, no estamos dictando el aspecto visual con el HTML. Sí, la apariencia predeterminada del la etiqueta sería cursiva y la sería en negrita, pero esos aspectos podrían cambiarse fácilmente en CSS. Esto es lo mejor de ambos mundos. Puede aprovechar los estilos de navegador predeterminados para obtener texto en cursiva o negrita en su documento sin cruzar la línea y mezclar estructura y estilo. Di que querías eso El texto no solo debe estar en negrita sino también en rojo, puede agregarlo al SCS.

fuerte {
color rojo;
}

En este ejemplo, no es necesario agregar una propiedad para el peso de la fuente en negrita, ya que es el valor predeterminado. Sin embargo, si no quiere dejar eso al azar, siempre puede agregarlo:

fuerte {
font-weight: negrita;
color rojo;
}

Ahora tendría casi la garantía de tener una página con texto en negrita (y rojo) donde sea que se utiliza la etiqueta.

Duplica el énfasis

Una cosa que hemos notado a lo largo del año es lo que sucede si intentas duplicar el énfasis. Por ejemplo:

Este texto debe tener ambos en negrita y en cursiva texto dentro de él.

Pensaría que esta línea produciría un área que tiene texto en negrita Y cursiva. A veces, esto sucede, pero hemos visto que algunos navegadores solo respetan el segundo de los dos estilos de énfasis, el más cercano al texto real en cuestión, y solo lo muestran en cursiva. Esta es una de las razones por las que no duplicamos las etiquetas de énfasis.

Otra razón para evitar esta "duplicación" es por motivos estilísticos. Una forma de énfasis suele ser suficiente para transmitir el tono que desea establecer. No es necesario poner en negrita, cursiva, colorear, ampliar y subrayar el texto para que se destaque. Ese texto, con todos esos diferentes tipos de énfasis, se volvería chillón. Así que tenga cuidado al usar etiquetas de énfasis o estilos CSS para dar énfasis y no exagerar.

Una nota sobre negrita e cursiva

Un pensamiento final, mientras que el negrita () y cursiva () ya no se recomienda el uso de etiquetas como elementos de énfasis, hay algunos diseñadores web que usan estas etiquetas para diseñar áreas de texto en línea. Básicamente, lo usan como un elemento. Esto es bueno porque las etiquetas son muy cortas, pero generalmente no se recomienda usar estos elementos de esta manera. Lo mencionamos en caso de que lo vea en algunos sitios que no se utilizan para crear texto en negrita o cursiva, sino para crear un gancho CSS para algún otro tipo de estilo visual.