La respuesta es simplemente para transmitir información y para estructurar su documento .
Cuando usas spans y divs, tu documento no tiene una estructura. No hay listas, ni párrafos, ni tablas, ni hipervínculos. Nada. Realmente no tiene sentido elegir HTML como lenguaje de marcado y luego ignorar el vocabulario que ofrece para expresar y estructurar su contenido. Estructura es la palabra importante aquí por cierto. HTML es para estructurar no mostrar. Para eso es CSS.
Si marca su código semánticamente, le está dando a los lectores humanos y también a las máquinas la oportunidad de comprender los datos dentro de sus elementos. Si utiliza los elementos span y div completamente, no tendrá esta información adicional y, por lo tanto, no será posible inferirlos solo a partir de los valores.
Del mismo modo, si quiero raspar sitios web y solo extraer los encabezados para crear una Tabla de contenido para ellos, mi araña debería saber cuáles son los encabezados. No puede hacer eso sin los elementos apropiados.
Por último, pero no menos importante, si solo usas divs y spans, te será difícil diseñarlos con CSS. Los selectores de CSS funcionan en la estructura de su documento y, si esa es en su mayoría una estructura ambigua, las reglas de CSS se vuelven dudosas de aplicar. ¿Cómo decides si div div div
realmente se refiere a table tr td
o body ul li
? Tendrías que agregar clases e ids, pero luego estarás reinventando la rueda.
Consulte también la recomendación del W3C
El uso de los elementos semánticos apropiados asegurará que la estructura esté disponible para el agente de usuario. Esto implica indicar explícitamente el rol que tienen las diferentes unidades para comprender el significado del contenido. La naturaleza de una pieza de contenido como un párrafo, encabezado, texto resaltado, tabla, etc. puede indicarse de esta manera. En algunos casos, las relaciones entre unidades de contenido también deben indicarse, como entre encabezados y subtítulos, o entre las celdas de una tabla. El agente de usuario puede hacer que la estructura sea perceptible para el usuario, por ejemplo, utilizando una presentación visual diferente para diferentes tipos de estructuras o utilizando una voz o tono diferente en una presentación auditiva.