En un vídeo reciente, John Mueller, de Google, respondió a una pregunta sobre cómo el HTML semántico ayuda a los motores de búsqueda a comprender el contenido de los sitios web.
Mueller explicó cómo afecta el HTML semántico al SEO, la accesibilidad y el ranking de búsqueda de un sitio.
“El HTML semántico ayuda a que Google pueda interpretar mejor una página. Sin embargo, no es un multiplicador mágico para hacer que un sitio web se posicione mejor”. – dijo John.
Beneficios del HTML semántico
El uso adecuado de los elementos HTML semánticos puede ayudar al SEO de las siguientes formas:
- Teniendo encabezados para estructurar pasajes de texto
- Colocando imágenes junto a las palabras que les son relevantes
- Utilizar etiquetas de tabla para las tablas de datos, no solo para posicionar el contenido.
- Tener enlaces de anclaje (anchor text) en lugar de enlaces que funcionan a través de JavaScript.
Por ejemplo, al agrupar secciones de texto, Google trata de la misma manera los elementos section, article y div. El elemento específico utilizado es menos importante que tener una estructura y una relación claras entre los elementos.
A continuación te compartimos algunas de las etiquetas semánticas más utilizadas al momento de estructurar un contenido.
- Encabezados: se utilizan para denotar importancia y crear jerarquía. <h1> es la etiqueta más importante, <h6> lo es menos.
- Párrafos: se utilizan para representar bloques de texto. El elemento <p> se encarga de definir los párrafos.
- Listas: se utilizan para organizar elementos <ul> y <ol> crear listas desordenadas y ordenadas, respectivamente. El <li> define un elemento de lista.
- Las tablas estructuran datos tabulares: <table> crea una tabla, <tr> define filas, <th> define encabezados de columna y <td> define celdas de datos.
- Anchor Text: (<a>) crea hipervínculos entre páginas. Ayudan al enlazado interno o bien a definir la fuente de los datos.
- Imágenes: (<img>) representan fotos o gráficos. El atributo ALT proporciona una descripción textual de la imagen, lo que ayuda a la accesibilidad y al SEO.
- Artículos: (<article>) representan contenido independiente y reutilizable como entradas de blog o noticias.
- Secciones: (<section>) agrupan contenidos relacionados, como capítulos o partes de un documento.
- Apartados: (<aside>) contienen contenido relacionado tangencialmente con el contenido principal, como las barras laterales.
- Figuras: (<figure> y <figcaption>) representan una imagen, diagrama o ilustración, junto con un pie de foto. Muestran la relación entre los medios de comunicación y el texto que los rodea.
Mueller concluye el vídeo incentivando a los propietarios de sitios web para que utilicen el HTML semántico, aunque no sea un factor directo de posicionamiento.
