Existen diversas etiquetas HTML que nos permiten modificar el aspecto y poner en negrita, cursiva o subrayado. Si estás buscando una respuesta rápida, te mostramos el código HTML:
Negrita en HTML
<b>Negrita en HTML</b>
<strong>Negrita en HTML con importancia semántica</strong>
Cursiva en HTML
<i>Cursiva en HTML</i>
<em>Cursiva en HTML con importancia semántica</em>
Subrayado en HTML
<u>Subrayado en HTML</u>
<a href="#">Esto es un enlace</a>
Si quieres conocer las ventajas que tienen algunas etiquetas para el Posicionamiento SEO, quédate un poco más.
Las etiquetas HTML ayudan a que el texto sea más legible tanto para el ojo humano como para los buscadores, pues resaltan las partes más importantes del artículo, producto o cualquier otro contenido en Internet.
Sin embargo, en el caso de la negrita y la cursiva debemos diferenciar entre etiquetas HTML puramente estéticas y etiquetas HTML semánticas.
Negrita en HTML
¿Este texto en negrita ha llamado tu atención antes de leer la frase completa?
A este estilo se le llama negrita o “bold”, y es simplemente la tipografía con un grosor más ancho para que destaque entre el resto del texto.
Podemos conseguir esto de dos formas distintas:
- Con la etiqueta <b> que viene de la palabra bold, lo que hacemos es poner el texto en negrita y le damos relevancia visual pero no le damos una mayor importancia semántica. Esta etiqueta necesita una apertura y un cierre para que el texto que haya dentro esté bien englobado. Quedaría así:
<b>Esta frase llama la atención visual pero no es importante</b>
Esta frase llama la atención visual pero no es importante
- Con la etiqueta <strong> que significa fuerte o, en este caso, importante, además de darle ese resaltado visual le estamos diciendo a los buscadores que rastrean y procesan el HTML de una página que esa palabra o palabras son muy importantes dentro del texto. De esta forma, jerarquizan la información y ofrecen una mayor consistencia a la escritura. Pero cuidado. Debemos ser comedidos en su uso. Si tuviéramos todo el contenido bajo la etiqueta <strong>. ¿Cómo sabrían los buscadores qué palabras son las relevantes? También necesita etiqueta de apertura y de cierre. Quedaría así:
<strong>Esta frase es importante</strong>
Esta frase es importante
Cursiva en HTML
La tipografía en cursiva se utiliza para añadir palabras en otros idiomas, significados, nombres o títulos y frases como citas textuales o referencias y también para darle énfasis a las palabras que queramos que tengan una mayor relevancia sobre el resto del texto.
Como la negrita, hay dos formas de poner la cursiva en HTML:
- Con la etiqueta <i> que viene de italic le estamos dando la importancia visual al ojo humano sobre una palabra o cita sobre el resto del texto, aunque la vemos con menos intensidad que la negrita. También es usada para añadir iconos o símbolos. Necesita de una etiqueta de apertura y cierre. Quedaría así:
<i>El título de un libro de un escritor</i>
El título de un libro de un escritor
- Con la etiqueta <em> que viene de emphasis, además del resaltado visual le estamos dando el énfasis jerárquico y le estamos diciendo a los buscadores que esa palabra o frase es importante y qué tipo de contenido es el que hay dentro. De la misma forma, debemos ser moderados a la hora de utilizar esta etiqueta. También necesita de apertura y cierre. Quedaría así:
Esta <em>obra maestra es más importante</em>.
Esta obra maestra es más importante.
Subrayado en HTML
- Con la etiqueta <u> que viene de underline. Es la forma semánticamente correcta de poner un texto subrayado de cara tanto visualmente para el lector como internamente para los buscadores. Necesita apertura y cierre y queda así:
Esta <u>palabra</u>no está bien escritaEsta palabra no está bien escrita
- La etiqueta <a> que viene de anchor es la que se utiliza para añadir hipervínculos o enlaces a un texto. Es una etiqueta que, por defecto, deja el texto que haya dentro subrayado y suele cambiar el color a azul. Es una etiqueta más compleja, necesita apertura y cierre y hay que establecer los atributos. Una forma sencilla de usarla para crear un link a un email sería así:
Contáctanos en <a href="mailto:info@koomori.com"> info@koomori.com</a>Contáctanos en info@koomori.com ¿Tienes dudas o necesitas asesoramiento para mejorar la estructura de tus textos de cara a buscadores como Google? Te ayudamos.
