El HTML sem\u00e1ntico se refiere al uso de elementos HTML de forma significativa para comunicar mejor la estructura y jerarqu\u00eda de una p\u00e1gina web a los ojos de la ara\u00f1a de los motores de b\u00fasqueda.<\/p>\n
Este escenario mejora la accesibilidad y, en consecuencia, la indexaci\u00f3n por parte de los Motores de B\u00fasqueda gracias a la utilizaci\u00f3n de un c\u00f3digo estructurado que prepara el posicionamiento org\u00e1nico gracias a marcadores que definen de forma inequ\u00edvoca la finalidad de cada uno de los elementos que componen las p\u00e1ginas.<\/p>\n<\/div>
<\/div><\/div>
<\/span>Elementos HTML sem\u00e1nticos<\/h3><\/span><\/div><\/div><\/div>
Veamos juntos cu\u00e1les son los elementos clave que distinguen el Html sem\u00e1ntico del Html tradicional y cu\u00e1les son las mejores pr\u00e1cticas para mejorar la estructura a nivel SEO:<\/p>\n
\n- Uso de etiquetas sem\u00e1nticas<\/b>: Utiliza etiquetas como <cabecera>, <pie de p\u00e1gina>, <nav>, <art\u00edculo>, <secci\u00f3n>, <aparte>, <principal>etc., para delimitar claramente las secciones de la p\u00e1gina y su finalidad.<\/li>\n
- Estructura l\u00f3gica<\/b>: Organiza los contenidos de forma l\u00f3gica y jer\u00e1rquica. <> <> Por ejemplo, utiliza h1 para los t\u00edtulos principales, h2 para los subt\u00edtulos y as\u00ed sucesivamente, para reflejar la estructura del contenido.<\/li>\n
- Descripci\u00f3n del<\/b> contenido: Utiliza etiquetas adecuadas para describir el tipo de contenido. Por ejemplo, utiliza <p> para p\u00e1rrafos de texto, <ul> e <ol> para listas ordenadas y desordenadas, <cifras> e <figcaption> para im\u00e1genes con pies de foto, etc.<\/li>\n
- Atributos sem\u00e1nticos<\/b>: Utiliza atributos como alt en las im\u00e1genes para proporcionar un texto alternativo, title para proporcionar informaci\u00f3n adicional en los enlaces, etc., para mejorar la accesibilidad y la experiencia del usuario.<\/li>\n
- <> <> Evita el uso excesivo de etiquetas<\/b> gen\u00e9ricas: Evita el uso excesivo de etiquetas gen\u00e9ricas como div y span cuando haya disponibles y sean adecuadas etiquetas sem\u00e1nticas m\u00e1s espec\u00edficas.<\/li>\n<\/ul>\n<\/div>
<\/div><\/div>
<\/span>Ejemplo de HTML sem\u00e1ntico<\/h3><\/span>