Las meta og son etiquetas HTML que van fijadas en el <head> (encabezado) de todas las web. En este caso específico las og se refieren al protocolo de gráfico abierto. ¡Veamos lo que significa y por qué son tan importantes par el SEO!

¿Qué es el open graph protocol?

El protocolo de gráfico abierto permite que cualquier página web se convierta en un objeto integrable en una plataforma social.

Este protocolo nace porque, aunque existen muchas tecnologías y esquemas de fragmentos enriquecidos diferentes que podrían combinarse para hacer una integración en redes sociales. No existía ninguno capaz de proporcionar suficiente integración para postear página web dentro de una red social.

¿Qué hacen las meta og?

Las meta og son las encargadas de traducir una página web compartida en el lenguaje de la red social que el usuario escoge para hacer la publicación.

Por ejemplo, estas se usan en Facebook para permitir que cualquier página web tenga la misma funcionalidad que cualquier otro objeto nativo de  Facebook. Como por ejemplo: tamaño de la imagen adecuada y número de caracteres para la sección de noticias de los usuarios.



Del mismo modo ocurre con todas las plataformas sociales, las meta og les permiten ver el contenido a estas para que lo puedan adaptar a sus entornos nativos.

¿Qué ventajas ofrecen las meta og?

Brinda a los desarrolladores una herramienta para implementar la integración social, Como los botones «Compartir» por ejemplo. Esta simplicidad para los desarrolladores fué el objetivo clave para el desarrollo del protocolo de gráfico abierto.

¿Por qué son tan importantes?

Como ya sabemos, la misión de Google es satisfacer en todos los sentidos a los usuarios del buscador. Por este motivo Google siempre preferirá mostrar una página con meta og en lugar de una que no cuenta con estas etiquetas.

A las personas les gusta compartir todo en redes sociales y para Google esto es un factor clave. Tu web debe tenerlas para que pueda aparecer en los resultados del buscador más usado del mundo.

¿Cómo se implementan las meta og?

Si nos detenemos un segundo y analizamos el término, nos dice que son metadatos, es decir van ubicadas dentro del <head> (encabezado) del documento HTML.

<meta og> en un documento html.

Implementación básica

  • <meta property=»og:locale» content=»es» /> Indica el idioma del sitio
  • <meta property=»og:type» content=»website» /> Indica que se trata de un sitio web y para las páginas de contenido se debe usar «webpage»
  • <meta property=»og:title» content=Título de la página web» /> Puedes usar el mismo contenido que colocas en el <title> o puedes redactar uno alternativo
  • <meta property=»og:description» content=»Descripción de la página web» /> Igual puedes usar el mismo contenido de la meta «description» o redactar una alternativa
  • <meta property=»og:url» content=»url de la página» />
  • <meta property=»og:site_name» content=»Nombre del sitio web» />
  • <meta property=»og:image» content=»url de la imagen insignia del sitio web» /> Por lo general es el logo de tu web

Para imágenes

  • <meta property=»og:image» content=»url de imagen insignia» />
  • <meta property=»og:image:secure_url» content=»url de la fuente donde salió la imagen» /> Esto aplica cuando enlazas una imagen de otro sitio.
  • <meta property=»og:image:type» content=»nombre y formato de la imagen» /> logo.png por ejemplo
  • <meta property=»og:image:width» content=»ancho en px» />
  • <meta property=»og:image:height» content=»alto en px» />
  • <meta property=»og:image:alt» content=»descripción de la imagen» />

Para vídeos

  • <meta property=»og:video» content=»url del video» />
  • <meta property=»og:video:secure_url» content=»url de la fuente del video» /> Esto aplica cuando tomas un vídeo de youtube, por ejemplo
  • <meta property=»og:video:type» content=»formato del video» /> mp4 por ejemplo
  • <meta property=»og:video:width» content=»ancho en px» />
  • <meta property=»og:video:height» content=»alto en px» />

Para audios

  • <meta property=»og:audio» content=»dirección del archivo de audio» />
  • <meta property=»og:audio:secure_url» content=»fuente del archivo de audio» /> Aplica si lo enlazas desde otra web
  • <meta property=»og:audio:type» content=»formato del audio» /> audio/mpeg por ejemplo.

<meta og> en wordpress

Si utilizas esta interfase simplemente puedes buscar un plugin que haga el trabajo por ti. Aunque la mayoría de temas gratuitos traen este protocolo por defecto.

Conclusión

Existen muchas implementaciones para las meta og pero estas son más que suficientes para que Google se enamore de tu web y la muestra con orgullo a los usuarios en sus búsquedas. Impleméntalas en tu web (Si no las tienes) y notarás la diferencia en tu posicionamiento. ¡Garantizado!


Si te ha gustado este post ¡compartelo! alguien que conoces podría disfrutarlo también

Summary
meta og "Gráfico abierto" ¡Cómo EVITAR! Los errores más frecuentes
Article Name
meta og "Gráfico abierto" ¡Cómo EVITAR! Los errores más frecuentes
Description
Las meta og son etiquetas HTML que van fijadas en el <head> (encabezado) de todas las web. En este caso específico las og se refieren al protocolo de gráfico abierto. ¡Veamos lo que significa y por qué son tan importantes par el SEO!
Author
Publisher Name
agenciatopseo.click
Publisher Logo


Categorías: #SEO

3 commentarios

Gian · septiembre 16, 2019 a las 4:45 am

Yes, is WordPress

Gian · agosto 29, 2019 a las 1:00 pm

Wow, thank you very much

SEO Google SITES - La ¡SUPER GUIA destruye mitos! - Top SEO · mayo 29, 2019 a las 10:17 pm

[…] Og (gráfico abierto): este protocolo de gráfico abierto permite que cualquier página web se convierta en un objeto integrable en una plataforma social. […]

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *