cómo puedes aprovechar facebook open graph

8/16/2019 Cómo Puedes Aprovechar Facebook Open Graph

1/12

19/11/2015 Cómo puedes aprovechar Facebook Open Graph

chrome-extension://iooicodkiihhpojmmeghjclgihfjdjhj/front/in_isolation/reformat.html 1/12

Cómo puedes aprovechar

Facebook Open Graph

by Euge Skaf [1] · 10 julio, 2015

Rate this (9 Votes)

348 Flar es Twitter Facebook Google+ LinkedIn Share[2] Reddit 348

Flares ×

[3]

[4]

Publicar contenidos en Facebook es una estrategia de

marketing digital fundamental para difundir tu marca, llegar a tu

https://www.socialtools.me/blog/wp-content/uploads/2015/07/Facebook-Open-Graph-PORTADA.jpghttps://www.socialtools.me/blog/wp-content/uploads/2015/07/Facebook-Open-Graph-PORTADA.jpghttps://www.socialtools.me/blog/wp-content/uploads/2015/07/Facebook-Open-Graph-PORTADA.jpghttps://www.socialtools.me/blog/wp-content/uploads/2015/07/Facebook-Open-Graph-PORTADA.jpghttps://www.socialtools.me/blog/wp-content/uploads/2015/07/Facebook-Open-Graph-PORTADA.jpghttps://www.socialtools.me/blog/facebook-open-graph/#closehttps://www.socialtools.me/blog/wp-content/uploads/2015/07/Facebook-Open-Graph-PORTADA.jpghttps://www.socialtools.me/blog/wp-content/uploads/2015/07/Facebook-Open-Graph-PORTADA.jpghttps://www.socialtools.me/blog/facebook-open-graph/#closehttps://www.socialtools.me/blog/author/euge/


2/12



público y aumentar el tráfico web a tu sitio. En este sentido,

existen numerosas herramientas para facilitar tu trabajo cotidiano en

los Social Media, pero son muy pocas las que pueden ayudarte a

hacer tus publicaciones más atractivas para la audiencia.

Justamente esa es la misión del Facebook Open Graph, acerca

del cual te contaré en este blog post . Aquí aprenderás para qué

sirve y cómo puedes sacarle provecho para favorecer la efectividad

de tus posts. Here we go!

¿Qué es Facebook Open Graph?

Facebook Open Graph[5] es una herramienta creada por los

desarrolladores de la red social para estandarizar elementos de

un sitio web (por ejemplo el tuyo). De esa forma pueden ser

interpretados por Facebook con el fin de que tus publicaciones en tu

Fan Page se muestren visualmente enriquecidas. Así, si utilizasOpen Graph, cada vez que compartas un contenido desde el sitio

en el que has instalado este protocolo, la publicación

correspondiente se mostrará en Facebook de una manera atractiva

y personalizada.

[6]

https://www.socialtools.me/blog/wp-content/uploads/2015/07/i-just-love-that.gifhttps://developers.facebook.com/docs/sharing/opengraph


3/12



[7]

En líneas generales, el Facebook Open Graph permite que el

contenido de cualquier sitio web se convierta en un objeto

enriquecido dentro de un gráfico social . Por ejemplo, esta

herramienta se utiliza con frecuencia para lograr que una página

web externa tenga la misma funcionalidad que cualquiera de los

elementos que aparecen en el Newsfeed de Facebook (imágenes,

vídeos, etc.).

En un sentido más técnico, el Facebook Open Graph reúne en un

sólo panel las funcionalidades que con anterioridad a su existencia

se llevaban a cabo separadamente y con distintas herramientas.

Por esa razón se ha convertido en un aliado de los desarrolladores

web en particular, y en general de cualquier persona que deseemejorar la apariencia de sus publicaciones en Facebook .

Por qué utilizar Facebook Open

Graph

Ahora que ya sabes qué es Facebook Open Graph y para qué se

https://www.socialtools.me/blog/wp-content/uploads/2015/07/i-just-love-that.gif


4/12



utiliza, es justo que te preguntes de un modo más concreto de qué

forma puede beneficiarte a ti . Y lo cierto es que existen múltiples

maneras de aprovechar las etiquetas Open Graph, pero todas

tienen en común una ventaja: la de permitirte decidir qué

elementos se mostrarán en tus publicaciones de Facebook ,

cada vez que compartes un contenido.

[8]

Otro beneficio de implementar Facebook Open Graph en tu sitio

web tiene que ver con el posicionamiento SEO (Search Engine

Optimization, u Optimización en Motores de Búsqueda en español)

de tus contenidos. En efecto, utilizar esta herramienta permite que

los motores de búsqueda (Google, Bing , etc.) puedan indexar mejor

tu contenido, de modo que los usuarios que realizan búsquedas

detalladas puedan hallarlos más fácilmente.

Además, como te comentaba más arriba el Open Graph de

Facebook es completamente personalizable. Por esa razón, deacuerdo a tus estrategias de marketing y al tipo de contenido que

produzcas, puedes establecer el diseño que mejor se adapte a tus

objetivos y al perfil de tu audiencia. Así por ejemplo, tienes la

posibilidad de asignar dos imágenes vinculadas a un mismo post,

de modo que puedan ser visualizadas correctamente en distintos

dispositivos.

Utilizar Open Graph en tu sitio web: Tras instalar este protocolo

https://www.socialtools.me/blog/wp-content/uploads/2015/07/do-want.jpg


5/12



en la Home de tu sitio, estarás habilitado para determinar cuáles

elementos se van a exhibir en tus posts de Facebook, cada vez que

compartas un artículo. Los más importantes son el Título, la

Imagen, la Descripción del contenido, el Nombre del sitio, la URL

y el Autor (entre otros). En la imagen de abajo puedes ver cómo

luce una publicación que utiliza Open Graph y cuáles son los

elementos personalizables.

[9]

[10]

Como puedes ver, Facebook Open Graph te habilita para

determinar cómo deseas que las publicaciones provenientes de tu

https://www.socialtools.me/blog/wp-content/uploads/2015/07/C%C3%B3mo-se-ve-Open-Graph.pnghttps://www.socialtools.me/blog/wp-content/uploads/2015/07/C%C3%B3mo-se-ve-Open-Graph.png


6/12



sitio se vean en el Newsfeed de tus fans. De esta forma puedes

tener un mayor control del modo en que tus contenidos llegan a tu

audiencia. Así, de manera estratégica y de acuerdo a tus

necesidades puedes escoger las mejores imágenes para mostrar y

redactar la descripción del contenido del modo más atractivo y

“cliqueable”.

Utilizar Open Graph en tu Aplicación Móvil: De manera similar,

este protocolo te permite personalizar la apariencia de los posts que

realizas desde tu aplicación. Así, de acuerdo a tu industria y tus

necesidades de marketing, puedes exhibir elementos puntuales que

resulten relevantes para tu público objetivo. En este sentido puedes

ver un ejemplo en la imagen de abajo, proveniente de la aplicación

multimedia Spotify .

[11]

[12]

https://www.socialtools.me/blog/wp-content/uploads/2015/07/C%C3%B3mo-se-ve-Open-Graph-app-m%C3%B3vil.pnghttps://www.socialtools.me/blog/wp-content/uploads/2015/07/C%C3%B3mo-se-ve-Open-Graph-app-m%C3%B3vil.png


7/12



Cómo instalar Facebook Open Graph

en tu sitio web

Dado que ya conoces las ventajas de utilizar Facebook Open

Graph, voy a enseñarte de qué forma puedes instalar este

protocolo en tu sitio web. Hacerlo casi no te costará demasiado

esfuerzo y te aportará grandes beneficios en términos de

engagement , es decir que la efectividad de tus publicaciones para

interesar a tu audiencia aumentará significativamente.

En caso de que tu sitio web se encuentre alojado en los servidores

de WordPress, el proceso de instalación del Facebook Open

Graph te resultará muy sencillo. Todo lo que tienes que hacer es

activar el Plug-In[13] en tu sitio, a través del menú “Plugins” de

WordPress. No debes olvidar añadir tu Facebook ID o el ID de tu

aplicación en el menú de configuración del Plug-In, dado que elloes lo que permitirá generar los meta datos Open Graph. En caso de

que no sepas cuál es, puedes conocer tu Facebook ID con ayuda

de esta herramienta[14].

[15]

https://www.socialtools.me/blog/wp-content/uploads/2015/07/Opan-Graph-plugin-WP.pnghttp://findmyfacebookid.com/https://wordpress.org/plugins/wp-facebook-open-graph-protocol/


8/12



[16]

Ahora bien, para instalar el protocolo Facebook Open Graph en tu

sitio web, tienes que insertar un conjunto de etiquetas dentro del

encabezado o “head ” de tu sitio. A través de ellas indicarás los

metadatos necesarios para que los rastreadores de Facebook y los

motores de búsqueda obtengan la información para proceder.

Estos datos se denominan OG Datos, a partir de su nombre en

inglés (Open Graph Data).

Para obtener los códigos que debes añadir en tu sitio, haz clic en

este enlace[17]. En él encontrarás indicaciones paso a paso sobre

cómo proceder y las herramientas necesarias para instalar Open

Graph en tu página web, en tus aplicaciones Android y en tus

aplicaciones iOS. Ten en cuenta que por el momento los textos se

encuentran disponibles únicamente en inglés.

Una vez que hayas terminado de instalar el código correspondiente

https://developers.facebook.com/docs/sharing/opengraphhttps://www.socialtools.me/blog/wp-content/uploads/2015/07/Opan-Graph-plugin-WP.png


9/12



en tu sitio web, es recomendable que compruebes que todo

funciona correctamente. ¿Cómo? Con ayuda del Open Graph

Debugger [18], una herramienta creada por Facebook para revisar

las metaetiquetas en busca de errores. En caso de que los

hubiera, te los señalará automáticamente para que puedas

corregirlos.

[19]

[20]

Un beneficio adicional del Open Graph Debugger es que te

permite obtener una vista previa de la apariencia que tendrán tus

posts a partir de la implementación del Facebook Open Graph. Ello

te ayudará a realizar ajustes de diseño, para lograr que tuspublicaciones se vean exactamente como lo deseas.

Espero que este blog post te haya servido para conocer qué es

Facebook Open Graph y por qué deberías comenzar a utilizarlo en

tu sitio web. Implementarlo en tus posts diariamente te ayudará a

que tus contenidos atraigan la atención de los usuarios con una

mayor efectividad mientras recorren su Newsfeed .

¿Te ha gustado el artículo? ¿Ya conocías esta herramienta de

https://www.socialtools.me/blog/wp-content/uploads/2015/07/OG-Debugger.pnghttps://www.socialtools.me/blog/wp-content/uploads/2015/07/OG-Debugger.pnghttps://developers.facebook.com/tools/debug/


10/12



1. https://www.socialtools.me/blog/author/euge/

2. javascript:void(0);

3. https://www.socialtools.me/blog/wp-

content/uploads/2015/07/Facebook-Open-Graph-PORTADA.jpg


content/uploads/2015/07/Facebook-Open-Graph-PORTADA.jpg

5. https://developers.facebook.com/docs/sharing/opengraph

6. https://www.socialtools.me/blog/wp-content/uploads/2015/07/i-

just-love-that.gif

7. https://www.socialtools.me/blog/wp-content/uploads/2015/07/i-

just-love-that.gif

8. https://www.socialtools.me/blog/wp-content/uploads/2015/07/do-want.jpg


Facebook? Comparte tu experiencia con nosotros y no olvides

recomendar este blog post a tus amigos.

Euge Skaf [21]

Content creator

Comments

comments

Links

https://www.socialtools.me/blog/author/euge/https://www.socialtools.me/blog/wp-content/uploads/2015/07/C%C3%B3mo-se-ve-Open-Graph.pnghttps://www.socialtools.me/blog/wp-content/uploads/2015/07/do-want.jpghttps://www.socialtools.me/blog/wp-content/uploads/2015/07/i-just-love-that.gifhttps://www.socialtools.me/blog/wp-content/uploads/2015/07/i-just-love-that.gifhttps://developers.facebook.com/docs/sharing/opengraphhttps://www.socialtools.me/blog/wp-content/uploads/2015/07/Facebook-Open-Graph-PORTADA.jpghttps://www.socialtools.me/blog/wp-content/uploads/2015/07/Facebook-Open-Graph-PORTADA.jpghttps://www.socialtools.me/blog/author/euge/


11/12



content/uploads/2015/07/C%C3%B3mo-se-ve-Open-Graph.png


content/uploads/2015/07/C%C3%B3mo-se-ve-Open-Graph.png


content/uploads/2015/07/C%C3%B3mo-se-ve-Open-Graph-app-

m%C3%B3vil.png


content/uploads/2015/07/C%C3%B3mo-se-ve-Open-Graph-app-

m%C3%B3vil.png

13. https://wordpress.org/plugins/wp-facebook-open-graph-

protocol/

14. http://findmyfacebookid.com/


content/uploads/2015/07/Opan-Graph-plugin-WP.png


content/uploads/2015/07/Opan-Graph-plugin-WP.png

17. https://developers.facebook.com/docs/sharing/opengraph

18. https://developers.facebook.com/tools/debug/


content/uploads/2015/07/OG-Debugger.png


content/uploads/2015/07/OG-Debugger.png

21. https://www.socialtools.me/blog/author/euge/

Consigue una cuenta gratuita de

Evernote para guardar este artículo y

https://www.socialtools.me/blog/author/euge/https://www.socialtools.me/blog/wp-content/uploads/2015/07/OG-Debugger.pnghttps://www.socialtools.me/blog/wp-content/uploads/2015/07/OG-Debugger.pnghttps://developers.facebook.com/tools/debug/https://developers.facebook.com/docs/sharing/opengraphhttps://www.socialtools.me/blog/wp-content/uploads/2015/07/Opan-Graph-plugin-WP.pnghttps://www.socialtools.me/blog/wp-content/uploads/2015/07/Opan-Graph-plugin-WP.pnghttp://findmyfacebookid.com/https://wordpress.org/plugins/wp-facebook-open-graph-protocol/https://www.socialtools.me/blog/wp-content/uploads/2015/07/C%C3%B3mo-se-ve-Open-Graph-app-m%C3%B3vil.pnghttps://www.socialtools.me/blog/wp-content/uploads/2015/07/C%C3%B3mo-se-ve-Open-Graph-app-m%C3%B3vil.pnghttps://www.socialtools.me/blog/wp-content/uploads/2015/07/C%C3%B3mo-se-ve-Open-Graph.pnghttps://www.socialtools.me/blog/wp-content/uploads/2015/07/C%C3%B3mo-se-ve-Open-Graph.png


12/12


verlo más tarde desde cualquier

dispositivo.

Crear cuenta

cómo puedes aprovechar facebook open graph

Documents