<em>
Texto y contenido
Marca énfasis de entonación: la palabra o frase que cambiaría el sentido de la oración si se lee con énfasis en voz alta.
<em> marca énfasis de entonación: la palabra o frase a la que pondrías énfasis en la voz al leer en voz alta, cambiando el sentido o la intención de la oración. No es “texto importante” — eso es <strong>. No es “texto destacado” — eso es <mark>. Es el acento prosódico: “no dije que él lo hizo” es una oración diferente a “no dije que él lo hizo”, aunque las palabras sean idénticas.
El navegador lo renderiza en cursiva por defecto, pero como en <strong>, ese efecto visual es el estilo del agente de usuario, no la razón de existir del elemento. Los lectores de pantalla pueden variar el tono de voz al leer el contenido de <em>, igual que una persona pondría énfasis prosódico al hablar. Si solo querés cursiva visual sin ese significado de entonación — un término técnico, el título de un libro, una palabra en otro idioma — usás <i> (que tiene semántica propia diferente) o CSS (font-style: italic) sobre un <span>.
La distinción importa: HTML declara el significado, CSS controla la apariencia. <em> pertenece al lado del significado — su uso debe estar justificado por el peso prosódico del texto, no por el aspecto visual.
Cómo funciona
<em> es un elemento en línea. Su significado depende de la posición: la misma oración con <em> en distintas palabras puede tener significados completamente diferentes. Eso lo distingue de <strong>, cuyo significado no cambia según dónde esté.
Se puede anidar: <em>muy <em>muy</em> importante</em>. Cada nivel de anidado incrementa el énfasis conceptualmente, aunque en la práctica los lectores de pantalla no siempre lo comunican diferente.
También se puede combinar con <strong>:
<p><strong><em>No</em> hagas eso bajo ninguna circunstancia.</strong></p>Modelo de contenido
Acepta contenido en línea (phrasing content). No puede contener elementos de bloque. Puede ir dentro de cualquier elemento que acepte contenido en línea: <p>, <li>, headings, <td>, etc.
Sintaxis
<p>No dije que <em>él</em> lo hizo.</p>
<p>No <em>dije</em> que él lo hizo.</p>
<!-- Anidado con strong para énfasis crítico con entonación -->
<p><strong>No <em>toques</em> ese archivo.</strong></p>No dije que él lo hizo.
No dije que él lo hizo.
Atributos
<em> no tiene atributos propios. Acepta los atributos globales de HTML (class, id, lang, data-*).
Accesibilidad
Los lectores de pantalla como NVDA y VoiceOver pueden leer el contenido de <em> con una variación de tono de voz, igual que una persona pondría énfasis al hablar. El comportamiento exacto varía por lector y configuración del usuario.
Cuándo usar <em> vs. alternativas
| Situación | Elemento correcto |
|---|---|
| Énfasis de entonación (cambia el sentido según la palabra enfatizada) | <em> |
| Importancia, urgencia, advertencia | <strong> |
| Término técnico, título de obra, pensamiento interno (convención editorial) | <i> |
| Solo quiero cursiva visual, sin significado semántico | CSS font-style: italic en <span> |
Notas, gotchas e interacción
<em>vs.<i>:<i>también produce cursiva y tiene semántica propia en HTML5: “voz o modo alternativo” — términos técnicos, títulos de obras, palabras en otro idioma, pensamientos internos. No es idéntico a<em>(que es énfasis de entonación) ni está obsoleto. La regla práctica: si el énfasis cambiaría el significado al leerlo en voz alta, es<em>; si es una convención tipográfica (cursiva para título de libro, latinismo), es<i>.<em>no reemplaza las comillas ni los títulos. Un título de libro va entre comillas o en<cite>, no en<em>.- No lo uses solo para cursiva. Si solo querés estilo visual, usá CSS sobre un
<span>. Usar<em>por apariencia genera ruido semántico.
Vigente / legacy
<em> está completamente vigente. No hay forma legacy. <i> no es su versión legacy sino un elemento con semántica propia diferente.