EMOJI en los resultados de Google: Cómo conseguirlos

Probablemente ya los hayáis visto en algún resultado de búsqueda de Google: Los emoji. Hacen que ese resultado destaque entre el resto que no tiene estos elementos gráficos. Aquí os explicamos como añadir emojis a vuestros meta title y meta description.

Lo que os vamos a explicar es como conseguir un resultado en Google como el siguiente:

Ese resultado de Google lleva dos Emoji en el META TITLE y Google los muestra en el resultado de búsqueda. Estos resultados de búsqueda resaltan mucho entre el resto y por eso obtienen un CTR mayor, sobre todo ahora que no todo el mundo lo está utilizando.

El único inconveniente en este momento es que en los navegadores de los ordenadores se muestran cuadrados blancos con un borde negro en vez de los emoji. Este es un ejemplo de Google Chrome bajo Windows:

Suponemos que esto en algún momento se solucionará. Por ejemplo en Safari bajo Apple IOS se ve perfectamente:

Y en Google Chrome para MAC también:

Lo que es divertido es que en cada ordenador se muestra un poco distinto. Pero lo importante es que en los resultados de Google aparecen siempre en todas las plataformas.

¿Cómo conseguir un emoji en un resultado de búsqueda de Google?

Por un lado la página web tiene que tener una codificación UTF-8. Esto lo tienen casi todas las webs actuales, pero es un requisito imprescindible sin el cual no funcionará este truco. Podéis comprobarlo fácilmente en el código fuente de cualquier página buscando por UTF-8.

Para insertar un EMOJI dentro del meta title de una web necesitamos su código Unicode HTML. Esto es lo más complicado. El resto es sencillo. Aquí tenéis un ejemplo de un META TITLE con dos EMOJIS:

 

Los dos emojis son: Un hombre 👨 y una mujer 👩.

Por tanto conseguir que Google muestre los EMOJI en los resultados de búsqueda es tan sencillo como editar el META TITLE y pegar los códigos UNICODE HTML. Esto mismo funciona para el META DESCRIPTION.

¿Qué pasa si uso WordPress con YOAST SEO o ALL IN ONE SEO?

Buscamos el código UNICODE HTML y lo pegamos en el recuadro de TITLE y DESCRIPTION del plugin. Y ya está. No hay que hacer nada más. Incluso sale en la previsualización de los plugins (dónde muestran cómo podría quedar el resultado de búsqueda en Google).

[ ACTUALIZACIÓN 20/junio/2015: ] OJO: Si usas YOAST SEO y has introducido códigos EMOJI en el título o descripción y una vez publicada la entrada o página quieres modificar el contenido del título o descripción con el Emoji, Yoast no guarda los cambios cuando se actualiza la página o entrada. Al publicar o actualizar una entrada o página con un Emoji, Yoast traduce el Emoji a su equivalente en imagen (sustituyendo el código Unicode HTML) por la imagen a la que corresponde y posteriormente no permite guardar los cambios que se realicen en los mismos.

Para hacer un cambio de un meta title o description con EMOJI y Yoast SEO: Primero eliminamos el título o descripción; actualizamos la entrada o página; escribimos el nuevo texto (volviendo a incluir los emojis deseados con su código Unicode HTML); y volvemos a actualizar la página o entrada.

Este error ocurre en la versión 2.2.1 de Yoast SEO; esperemos que en próximas versiones lo solucionen. [ /ACTUALIZACIÓN 20/junio/2015 ]

¿Cómo obtener los códigos Unicode HTML de los Emojis?

Esto puede ser lo más complicado de todo este proceso. Hay dos formas de hacerlo y ambas son válidas.

Unicode HTML mediante Unicode.org y The Unisearcher

Nos vamos a la página de Unicode.org que tiene un resumen de todos los emoji.

Ahí buscamos el emoji que nos interese insertar. Copiamos su código (el primer valor del documento):

Y con ese código nos vamos a la página de The UniSearcher y lo pegamos en el recuadro «Codepoint (hex)» y apretamos ENTER para que busque:

Y nos saldrá un resultado de búsqueda como este:

Lo que nos interesa es el código de UNICODE (HTML) que es el que copiaremos y pegaremos en el META TITLE o META DESCRIPTION para obtener el EMOJI.

Unicode HTML mediante iEMOJI.COM

Existe otra forma de obtener los códigos UNICODE (HTML) de cada Emoji y es usando la página web de iEmoji.com.

En esta web hay distintas categorías de EMOJIs. Visitamso la categoría que nos parezca interesante, buscamos el Emoji y hacemos click sobre el mismo para obtener todos sus datos:

• Personas (People)
• Sitios (Places)
• Naturaleza (Nature)
• Objetos (Objects)
• Símbolos (Symbols)
• Nuevos (New)
• Tonos de piel (Skin Tones)

Y el resultado será algo como lo siguiente:

Copiamos el código que hay en «Decimal HTML Entity» en la columna «Unified Unicode».

¿Vas a probar usar EMOJIS en los títulos de tus páginas?

A nosotros nos encanta usarlos y de momento como no está masificado los resultados que los tienen, obtienen un CTR más alto que los que no lo tienen. Pero esto es como todo lo relacionado con Google: Hoy muestra los emojis en sus resultados de búsqueda. Mañana no lo sabemos. Pero merece la pena aprovecharse ahora que funciona.

Para cualquier duda dejarnos un comentario.

Y compartirlo si os ha parecido interesante.

[ACTUALIZACIÓN 03/JULIO/2015]: OJO: A día de hoy ya NO funciona. Ni Google ni Bing muestran ya los Emoji en sus resultados de búsqueda y los filtran como otros códigos UNICODE. Una pena que ya no podamos aumentar el CTR de nuestros resultados de búsqueda de esta forma. Hay más información en la respuesta que le hemos dado a Fabio aquí. 🙁 [/ACTUALIZACIÓN]