Qué es el HTML semántico, y por qué debes implementarlo para posicionar tu página web en Google

El HTML semántico es el método correcto de estructurar cada sección y contenido de tu página web utilizando las etiquetas(tags) adecuadas.

Google no es un humano como nosotros, por lo que no puede saber exactamente lo que hay en tu página web si no le ayudas a entenderlo por partes.

Google utiliza un sistema de rastreo con la ayuda de sus "Google Bots", los cuales entran a tu página de tanto en tanto, para leer, y rastrear todo posible contenido de tu página.

Es ahí donde radica la importancia de estructurar correctamente tu contenido con el HTML semántico.

Algunos consejos para colocar HTML semántico a tu contenido:

1. Si tienes un título principal utiliza h1, si es secundario h2, terciario h3, etc.
   
<h1> Título principal </h1>
2. Si después del título va un texto tipo párrafo, coloca un p.
   
<p> Texto o párrafo. </p>
3. Si una sección de contenido es un artículo el cual espera que se lea en su totalidad por tus clientes o visitantes, ponle un tag tipo "article".
   
<article>

<h2> Título del artículo. </h2>
<p> Párrafo del artículo. </p>
<button> Botón de contacto. </button>

</article>
4. Y que no se te olvide que cada página individual que tengas, debe de estar dividida por grandes secciones como: Hero section(título principal con imagen de fondo, etc), acerca de section, servicios section, etc. Siempre colocar la etiqueta section por cada sección o cambio de contenido principal.
<section>

<h1> Título principal. </h1>
<p> Texto o párrafo. </p>
<button> Botón de contacto. </button>

</section>

Los metatags le sugieren a Google, mostrar un resumen de tu página:

Por último Colocar Metatags en la sección del Head para indicarle a Google en qué página está situado, que imagen mostrar en los resultados de Google, y qué titulo y descripción poner para que la gente la lea y se anime a visitar tu página.

• Metatag para indicar qué pagina es:
<link rel="canonical" href="https://philip.com.co" />
<link href="https://philip.com.co" rel="home"/>

• Metatag para sugerir a Google que muestre la descripción que hayamos decidido colocar a nuestros visitantes:
<meta name="description" content="Posiciono tu empresa en Google, con páginas rápidas de cargar..." />

• Metatags para indicarle a Google qué imagen mostrar cuando se comparte el enlace de tu página a redes sociales y en los resultados de Google:
<meta property="og:image" content="https://philip.com.co/img/fotos/preview-img-1.png" />
<meta property="og:image:secure_url" content="https://philip.com.co/img/fotos/preview-img-1.png" />


En el próximo artículo hablaré sobre la importancia de los sitemaps para ayudar a indexar en menos tiempo tu página en Google Search Console.

Tines alguna pregunta o inquietud sobre el tema? o deseas recibir asesoría para el posicionamiento de tu página en Google? envíame un mensaje.

Enviar mensaje