Pregunta ¿Cuál es la diferencia entre y , y ?


Cuál es la diferencia entre <b> y <strong>, <i> y <em> en HTML / XHTML? ¿Cuándo deberías usar cada uno?


639
2017-11-07 10:56


origen


Respuestas:


Ellos tienen el mismo efecto en los motores de renderizado de navegador web normales, pero hay un diferencia fundamental entre ellos.

Como el autor escribe en una publicación de la lista de discusión:

Piensa en tres situaciones diferentes:

  • navegadores web
  • gente ciega
  • teléfonos móviles

"Bold" es un estilo, cuando dices "negrita una palabra", la gente básicamente sabe que significa agregar más, digamos "tinta", alrededor de las letras hasta que se destaquen más entre el resto de las letras.

Eso, desafortunadamente, no significa nada para una persona ciega. En teléfonos móviles y otros PDA, el texto ya está en negrita porque la resolución de la pantalla es muy pequeña. No puedes audaz audaz sin atornillar algo.

<b> es un estilo - sabemos cómo se supone que debe ser "audaz".

<strong> sin embargo es una indicación de cómo debe entenderse algo. "Fuerte" podría (y a menudo lo hace) significar "negrita" en un navegador, pero también podría significar un tono más bajo para un programa de oratoria como Jaws (para personas ciegas) o estar representado por un subrayado (ya que no se puede audaz negrita) en un Palm Pilot.

HTML nunca fue pensado para ser sobre estilos. Hacer algunas búsquedas para "Tim Berners-Lee" y "la web semántica".  <strong> es semántico: describe el texto que rodea (p. ej., "este texto debería ser más fuerte que el resto del texto que has mostrado") en lugar de describir cómo el texto que rodea debe ser mostrado (p.ej., "este texto debe ser negrita")


880
2017-11-07 11:07



<b> y <i> son explícitos; especifican negrita y cursiva, respectivamente.

<strong> y <em> son semánticos: especifican que el texto adjunto debe ser "fuerte" o "subrayado" de alguna manera, por lo general en negrita y cursiva, pero permiten que el estilo real se controle a través de CSS. Por lo tanto, estos son los preferidos en las páginas web modernas.


203
2017-11-07 10:59



<strong> y <em> agregue significado semántico adicional a su documento. Da la casualidad de que también le dan un estilo en negrita y cursiva a su texto.

Por supuesto, puedes anular su estilo con CSS.

<b> y <i> por otro lado, solo se aplica el estilo de fuente y ya no se debe usar. (Debido a que se supone que debes formatear con CSS, y si el texto era realmente importante, ¡de todos modos lo harías "fuerte" o "enfatizado" de todos modos!)

Espero que tenga sentido.


21
2017-11-07 11:00



<b> y <i> ambos están relacionados con el estilo, mientras que <em> y <strong> son semánticos En HTML 4, los primeros se clasifican como elementos de estilo de fuente, y el último como elementos de frase.

Como indicó correctamente, <i> y <em> a menudo se consideran similares, ya que los navegadores suelen mostrar ambos en cursiva. Pero de acuerdo con las especificaciones, <em>  indica énfasis y <strong>  indica un énfasis más fuerte, lo cual es bastante claro, pero a menudo malinterpretado. Por otro lado, la distinción entre cuándo usar <i> o <b> es realmente una cuestión de estilo.


7
2017-11-07 11:11



Mientras <strong> y <em> son, por supuesto, más semánticamente correctas, parece que hay razones legítimas para usar el <b> y <i> etiquetas para contenido escrito por el cliente.

En dicho contenido, las palabras o frases pueden estar en negrita o en cursiva y, en general, no nos corresponde a nosotros analizar el razonamiento semántico de tal negrita o cursiva.

Además, dicho contenido puede referirse a palabras y frases en negrita y en cursiva para transmitir un significado específico.

Un ejemplo sería una pregunta de examen de inglés que instruye a un alumno a reemplazar la palabra en negrita.


7
2017-11-09 02:18



Aquí hay un resumen de definiciones junto con el uso sugerido:

<b> ... un tramo de texto al que se presta atención para fines utilitarios sin transmitir ninguna importancia adicional y sin la implicación de una voz o estado de ánimo alternativo, como palabras clave en un resumen del documento, nombres de productos en una revisión, palabras procesables en software de texto interactivo, o un artículo lede.

<strong> ... ahora representa importancia más que fuerte énfasis.

<i> ... un lapso de texto en una voz o estado de ánimo alternativo, o de lo contrario compensado de la prosa normal de una manera que indica una calidad de texto diferente, como una designación taxonómica, un termino tecnico, un frase idiomática de otro idioma, un pensamiento, o un nombre del barco en textos occidentales.

<em> ... indica énfasis.

(Todas estas son citas directas de fuentes W3C, con mi énfasis añadido. Ver: https://rawgithub.com/whatwg/html-differences/master/Overview.html#changed-elements y http://www.w3.org/TR/html401/struct/text.html#h-9.2.1 para los originales)


6
2017-11-14 20:57



Como otros han dicho, <b> e <i> son explícitos (es decir, "hacen que este texto sea negrita"), mientras que <strong> y <em> son semánticos (es decir, "este texto debe enfatizarse").

En el contexto de un navegador web moderno, es difícil ver la diferencia (ambos parecen producir el mismo resultado, ¿no?), Pero piense en los lectores de pantalla para las personas con discapacidad visual. Si un lector de pantalla se topa con una etiqueta <i>, no sabría qué hacer. Pero si encuentra una etiqueta <em>, sabe que lo que está dentro debe ser enfatizado para el oyente. Y ahí obtienes la diferencia práctica.


3
2017-11-07 11:04