Blog

Open Graph y las ventajas de su uso

social sharing con open graph

Hoy en día los medios sociales se encuentran sumamente desarrollados, es raro que alguien no tenga una cuenta en una red social, el open graph nos permite compartir contenido de nuestra pagina web en esos medios de una manera más agradable a la vista o mucho más enriquecida para los usuarios, lo cual proporciona una pequeña demostración de lo que se está compartiendo dando al usuario mas confianza al momento de clickear para visitar el sitio web. Esta, como muchas otras es una de las principales ventajas de su uso, muchas empresas lo utilizan para permitir socializar su contenido con los demás, facebook, youtube, spotify y casi la mayoría si no es que el 100% de los blogs lo utilizan.

El uso del open graph es simple y permite conectar organizaciones, empresas y comunidades con los usuarios o seguidores dejando compartir su contenido para que este alcance una mayor visibilidad.

Los puntos que vamos a cubrir son:

  1. Que es el Open Graph
  2. Como utilizarlo
    1. Propiedades
    2. Configuración de Links para Social Sharing
  3. Usos
    1. 5 Ventajas de usarlo
  4. Open Graph y los CMS
  5. Conclusión

ahora, que ya establecimos los puntos de lo que vamos a hablar en este post, creo que es importante que empecemos definiendo que es el open graph para tener una idea mejor de a lo que vamos a ver.

Que es el Open Graph Protocol (Facebook Open Graph)

Es un protocolo para compartir tu pagina o sitio web en las redes sociales, convirtiendolo en un objeto enriquecido para social media, este es principalmente utilizado por facebook pero sus propiedades funcionan igualmente para los demás medios sociales como google+, twitter y pinterest.

Open Graph Protocol

Cómo utilizar el Open Graph

El uso es relativamente sencillo y cualquier persona con pocos conocimientos en el área de desarrollo web podría implementarlo, aunque si no posees muchos conocimientos en estas áreas, pero administras tu propio sitio web, es importante saber que existen maneras ya prefabricadas si usas un plugin para algun CMS, para convertir tu sitio web en un objeto enriquecido para social media solo se necesita añadir metadatos a tu página utilizando las etiqueta <meta> en el <head> de tu sitio web, pero si quieres realizar de una forma mas personalizada y no tienes idea de como, es recomendable asesorarse por una persona con mas conocimiento en esta área.

Propiedades del Open Graph

<meta property="og:title" content="Título del artículo" />
<meta property="og:site_name" content="KoshucasWeb" />
<meta property="og:url" content="http://koshucasweb.com/blog/título-del-artículo" />
<meta property="og:description" content="La descripción a mostrar, generalmente es un resumen de 150 - 200 caracteres " />
<meta property="og:image" content="http://koshucasweb.com/imagen/blog/título-del-artículo" />
<meta property="og:type" content="article" />

Existen muchas otras propiedades que podemos utilizar y diferentes tipos de open graph dependiendo del contenido, pero estas son indispensables para el correcto funcionamiento en los sitios web.

post de blog compartido en facebook con open open graph

Esta es una imagen de como se ve uno de nuestros post sobre landing pages compartida en facebook con el open graph, puedes ver esta pagina aqui Landing Pages: El Porqué Usarlas, verifica el social sharing compartiendola en cualquier red social, o cualquiera de nuestros post funcionan perfectamente, confirmalo tu mismo.

Configuración de los Links

Para configurar los links de open graph simplemente añadimos en las etiquetas (<a>) el link al que se dirige el contenido, estos links pueden conseguirse en google, una de las páginas que utilizamos en KoshucasWeb para obtener los links es www.sharelinkgenerator.com. Los links son modificados para que funcionen automático con cualquier artículo añadiendo los datos pedidos en variables de php.

<a class="item icon-facebook" target="_blank" href="https://facebook.com/sharer.php?m2w&s=100&p[url]=<?php echo $surl; ?>" title="Share it on Facebook"></a>
<a class="item icon-google-plus" target="_blank" href="https://plus.google.com/share?url=<?php echo $surl; ?>" title="Share it on Google+"></a>
<a class="item icon-twitter" target="_blank" href="https://twitter.com/share?url=<?php echo urlencode($surl); ?>" title="Share it on Twitter"></a>
<a class="item icon-linkedin" target="_blank" href="https://www.linkedin.com/shareArticle?mini=true&url=<?php echo $surl; ?>"&title="<?php echo $item->title; ?>"&summary="<?php echo JHtml::_('string.truncate', strip_tags($item->introtext), 200); ?>" title="Share it on Linkedin"></a>
<a class="item icon-pinterest" target="_blank" href="https://pinterest.com/pin/create/button/?url=<?php echo $surl; ?>&media=<?php echo $imgUrl; ?>&description=<?php echo JHtml::_('string.truncate', strip_tags($item->introtext), 200); ?>"></a>

Usos del Open Graph

Los usos dependen de cada empresa, es comúnmente usado para promocionar sus negocios o dar a conocer el contenido que publiquen en sus posts compartiendolos en las redes sociales mediante estos protocolos, mejoran su posicionamiento en los buscadores como google de manera orgánica y es buena estrategia para obtener viralización de contenido, el open graph es completamente personalizable para obtener fácilmente la atención del usuario, pero principalmente es el contenido lo que capta la atención, es sumamente importante tener un contenido de calidad, atractivo y original para destacar más fácilmente.

5 ventajas de usar Open Graph

  1. Contenido más Llamativo - El utilizar open graph nos permite presentar el contenido que se comparte de una manera mucho más estilizada y enriquecida para los usuarios.
  2. Atracción de público  - Con la presentación de contenido de una forma más acondicionada para los usuarios permite captar la atención del público sobre lo que se comparte, generando más visitas a tu página web.
  3. Ser Reconocido - Permite viralizar tu contenido lo cual genera un amplio reconocimiento de tu marca.
  4. Confianza - Permite a los usuarios obtener más confianza de tu contenido que con un simple link.
  5. Optimización SEO - Posiblemente lo que consideras más importante para tu empresa, organización o comunidad, el utilizar contenido más enriquecido permite a los buscadores como google indexarte en las primeras páginas permitiéndole a los usuarios encontrarte más fácilmente.

Open Graph y los CMS

Ya existen muchos plugins completamente personalizables para la utilización del Open Graph en los CMS más populares como Wordpress y Joomla, con configuración ya establecida para que el usuario común sin necesidad de tener conocimientos en el desarrollo web pueda agregarlo más fácilmente sin necesidad de acceder al código de su página y fácil de adaptar a los requerimientos, inclusive con los iconos sociales ya incluidos en ellos, listos para su completo uso, sin embargo, de igual manera se tiene que configurar desde el back - end de tu sitio, por lo que es recomendable informarse de su funcionamiento y si no posee conocimiento alguno, dejarlo en manos de alguien con experiencia en el tema.

Conclusión

El open graph es muy útil y nos ofrece muchas ventajas, así que si no lo has implementado creo que no hace falta decirte que lo hagas después de leer este post, pero si todavia tienes alguna duda puedes comunicarte conmigo que mas abajo dejare mi twitter, puedes escribirme o llamar al administrador de esta pagina, cualquiera de los 2 te asesoraremos con mucho gusto.

Si te gusto este artículo o te ha sido de utilidad, compartelo en las redes sociales que sean de tu interés . Muchas Gracias!

Escrito por Carlos L. Bracho, síguelo en sus redes.

Twitter: @CarlosL24295

Google + : Carlos Bracho