Curso HTML 4.3 Énfasis y resaltado (strong, em, b, i)

Énfasis y resaltado en HTML 4.3

En HTML 4.3 disponemos de cuatro etiquetas básicas para indicar énfasis semántico y resalte visual en el texto:

• <em> (énfasis)
• <strong> (énfasis fuerte / importancia semántica)
• <i> (texto en cursiva, sin implicación semántica fuerte)
• <b> (texto en negrita, sin implicación semántica fuerte)

1. Elemento <em> (énfasis)

El <em> marca un cambio de entonación o énfasis al leer en voz alta. Es semántico: los lectores de pantalla anuncian además “énfasis” y los motores de búsqueda reconocen su importancia relativa.

Características de <em>

• Se anida: múltiples niveles de <em> producen cambios de entonación crecientes.
• Semántico: aporta significado, no es un simple estilo visual.
• Por defecto, el navegador lo muestra en cursiva.

Ejemplo de uso:

Este texto contiene un énfasis simple.

Anidado: Primero segundo nivel primero de nuevo.

2. Elemento <strong> (énfasis fuerte)

El <strong> sirve para indicar que cierto fragmento tiene importancia especial. Los lectores de pantalla suelen anunciar “importante” y los buscadores valoran su contenido con mayor peso.

Cuándo usar <strong>

• Destacar instrucciones críticas (“No presionar hasta terminar”).
• Marcar advertencias o información esencial.
• Indexación: palabras en <strong> suelen tener más peso SEO.

¡Atención! No desconecte el equipo durante el proceso.

3. Elemento <i> (texto en cursiva sin semántica)

La etiqueta <i> aplica cursiva sin añadir significado especial. Se usa para:

• Citas de texto en otro idioma.
• Títulos de obras (libros, películas).
• Terminología o tecnicismos.

En la palabra déjà vu aparece un fenómeno de sensación de familiaridad.
Leí El señor de los anillos el año pasado.

4. Elemento <b> (texto en negrita sin semántica)

<b> aplica negrita visual, sin aportar significado semántico especial. Útil para:

• Resaltar visualmente sin implicar importancia añadida.
• Marcar definiciones en glosarios.

El término algoritmo proviene del matemático Al-Khwarizmi.

5. Resumen comparativo

6. Buenas prácticas y accesibilidad

• Preferir <em> y <strong> para que asistentes de lectura vocal y motores de búsqueda interpreten correctamente el contenido.
• Evitar <i> y <b> como sustitutos de estilo: use hojas de estilo cuando quiera decorar texto sin significado extra.
• No encadenar negritas y cursivas innecesariamente; la clara separación semántica mejora la legibilidad y la usabilidad.

Con estas pautas y ejemplos profundos, dominarás el uso semántico y visual de <em>, <strong>, <i> y <b> en HTML 4.3.