La etiqueta em y la etiqueta strong en HTML5

Hoy vamos a ver dos etiquetas sencillas, pero que aportan un significado semántico a nuestro sitio. Las etiquetas <em> y <strong> son muy utilizadas en este blog, por el que suscribe. De hecho, las utilizo en todos los post del blog que he escrito hasta fecha. Como he dicho al inicio, las utilizo porque aportan un significado semántico. Esto me va a beneficiar a la hora de que los buscadores encuentren mi sito y tenga mas visibilidad para Google.

Agregando énfasis con <em> e importancia con <strong>

El uso de la etiqueta <strong>

La etiqueta <strong>, en el pasado se utilizaba para poner el texto en negrita. Hoy día tiene un significado semántico, indica que ese texto es importante. Por ejemplo, <strong>Atención</strong>, este texto es exclusivamente informativo. Así llamaríamos la atención del usuario para "obligarlo" a leer ese texto.

Personalmente y en mi humilde opinión, creo que se aprende mejor viendo algunos ejemplos. Así, que veamos algunas situaciones con las que podemos encontrarnos a la hora de desarrollar un sitio web.

Ejemplo 1 - <strong>Se requiere inscripción</strong> para este evento.

Ejemplo 2 - <strong>La contraseña proporcionada es incorrecta</strong>.Por favor, inténtelo de nuevo.

En resumen, la etiqueta <strong> se utiliza para alertas, advertencias, recordatorios, etc. A día de hoy no afecta al SEO.

El uso de la etiqueta <em>

La etiqueta <em>, se utiliza para resaltar texto en el documento dando “énfasis” al texto sobre el que se aplica la etiqueta. Hay que decir que el texto que esta encerrado con la etiqueta <em>, es menos importante que el que está encerrado con la etiqueta <strong>. Aunque es posible aplicar el mismo efecto utilizando hojas de estilo, esta etiqueta no se ha suprimido para ajustarse a la web semántica.

Los navegadores suelen visualizar el resultado de la etiqueta como un atributo de itálica o cursiva sobre el texto al que se le haya aplicado. Aunque siempre podemos cambiar su aspecto con CSS y cambiarlo a nuestro gusto.

La sintaxis de la etiqueta <em> es la siguiente:

Ejemplo 1 - Atención, este texto es <em>meramente</em> informativo.

Ejemplo 2 - iremos de viaje <em>siempre y cuando</em> no llueva.

Ejemplo 3 - La evolución humana u hominización es el 
proceso de evolución biológica de la especie humana 
desde sus ancestros hasta la actualidad. El estudio 
de dicho proceso requiere de un <em>análisis 
interdisciplinario</em> en el que se complementen
conocimientos desde ciencias como la genética, la 
antropología física, la paleontología, la 
estratigrafía, la geocronología, la arqueología y
la lingüística.

Conclusión

Nada más que añadir sobre estas dos etiquetas. Yo las utilizo en cada post desde que comencé a escribir en este blog. Ya que las conoces y sabes como definirías y usarlas, deberías utilizarlas en tu web. Recuerda que mis publicaciones, son solo apuntes y clases que comparto con vosotros. A mi me sirven de repaso y a su vez espero que a ti te sirvan de ayuda o estudio.

Prohibida la distribución de este articulo incluyendo las imágenes,
sin la autorización del autor. Todos los derechos reservados ©2018