Cómo afectarán los popups a tu estrategia SEO en 2017

Igual te estarás preguntando ¿Qué narices hace este hombre hablando de popups en su blog de SEO?

La verdad es que no me lo habría planteado si no fuese porque en esta ocasión puede existir una correlación entre el uso de popups y el posicionamiento de tus páginas en resultados móviles y es que Google anunció el pasado 23 de Agosto que iniciará una campaña a partir del 10 de Enero de 2017 contra los popups o ‘interstitials’ más intrusivos, es decir, aquellos popups que ocupan en gran medida la pantalla del dispositivo o su totalidad y que por ende dificultan al usuario el acceso al contenido.

Popups y rankings SEO

 

En este artículo te detallo qué popups pueden ser perjudiciales para tu posicionamiento según Google, cuales aceptará como válidos o necesarios, qué dicen en SumoMe al respecto y qué podemos hacer para evitar entrar en el saco de “los malos”.

Los popups intrusivos serán una señal más de posicionamiento

¡Los popups funcionan!

De esto no me cabe la menor duda, una ventana emergente que se muestre usando tecnologías modernas (no abriendo una nueva ventana) y que ofrezca un contenido digital o una oferta gancho, puede ayudarte -y mucho- a captar suscriptores y/o clientes.

Es muy probable que uses en tu blog o sitio web uno de estos popups para mostrar ofertas, captar emails para potenciar tu base de datos de suscriptores o leads a los que ofrecer más tarde tus productos o servicios.

Bien pues Google nos informa sobre qué tipo de popups podrían dejar de gustarle en dispositivos móviles y en consecuencia repercutir en tus rankings.

Popups intrusivos según el aviso de Google

Del artículo y los comentarios de John Mueller extraemos qué cosas hay que evitar:

  • Cargar los popups en cuanto el usuario accede a la web. Si tu herramienta de popups te lo permite configúrala para que cargue en el segundo render, con un retardo de al menos 5 o 6 segundos.
  • Evita los popups que ocupen la totalidad del dispositivo nada más entrar a la web y que deban cerrarse para poder acceder al contenido.
  • Evita también aquellos que carguen ocupando todo el above-the-fold (zona visible sin hacer scroll al entrar en un sitio web) y para los que el usuario tenga que hacer scroll para poder acceder al contenido.

Evitar, evitar…¡Ostras! y entonces...

¿Qué popups puedo mostrar en dispositivos móviles?

Pues la verdad es que la cosa tiene miga porque en el anuncio de Google la información de los popups que podemos usar es algo escueta, estos son algunos ejemplos que citan en el comunicado:

  • Los de avisos legales y cookies
  • Los de filtros de contenido para mayores de 18, logins, contenido privado, etc.
  • Los que ocupen una cantidad razonable de pantalla.

Popups no intrusivos según el aviso de Google

Yo me quedaría con el último caso, pequeños y que tarden en cargar más de 5 segundos o cuando el usuario vaya a abandonar la web.

¿Qué hacer si usas SumoMe?

SumoMe tiene un conjunto de herramientas relacionadas con el crecimiento de tráfico web y el análisis web entre las que encontramos el List Builder o constructor de listas -literal-.

Esta herramienta te permite mostrar en tu web un popup de suscripción a una lista de una forma muy sencilla, conectar estas suscripciones a herramientas de newsletter tan conocidas como Mailchimp y obtener una serie de estadísticas de suscripción, entre otras funcionalidades.

El staff de SumoMe ya estaba probando nuevos formularios de captación de emails para móviles antes del anuncio de Google como podéis ver en esta sección del apartado de ayuda.

En este comunicado nos indican qué acciones podemos llevar a cabo para gestionar o eliminar la visualización de la ventana del List Builder en dispositivos móviles.

  • Comportamiento (Behaviour): Por defecto tendremos la opción ‘smart’ activada pero podemos cambiarla a ‘manual’ y seleccionar que se muestre una vez transcurridos N segundos. ¡Recuerda! mínimo 5 o más.
  • Reglas de visualización (Display Rules): Aquí podemos ir un paso más allá y si no queremos exponernos al temido descenso de posiciones podemos hacer una configuración más avanzada.

    Podemos gestionar si se muestra sólo en PCs de escritorio, que no se muestre en dispositivos móviles o bien que se muestre o no en dispositivos con un determinado tamaño de pantalla.

    También podemos seleccionar en esta sección si queremos que se muestre en páginas específicas de modo que, habilitando el popup sólo para las páginas que nos ayuden a convertir más, lo haríamos mucho menos intrusivo.

    ​Cierto es que muchas de las opciones pertenecen a la versión Pro -de pago- pero eliminar el popup de dispositivos móviles no es una de ellas.

 

Espero que te sirva este artículo para tomar decisiones sobre qué hacer antes del 10 de Enero del próximo año.

¿Qué opinas de los popups? ¿Te disgusta su uso? ¿Pondrás en práctica estas optimizaciones? ¡¡Soy todo "oídos"!! :D

 

Liferay URLs amigables, cómo optimizarlas

Liferay Friendly URL - URLs amigables

Hola de nuevo! Han sido unos meses complicados para escribir pero aquí estoy de nuevo con otro consejo más relacionado con Liferay y SEO. 

En esta ocasión te voy a enseñar un sencillo truco para optimizar las URLs amigables en artículos de Blog y Contenido Web de Liferay

 

¿Qué son las URLs amigables o friendly URL?

Bueno, por si acaso haré un pequeño recordatorio, la URL amigable es aquella que es entendible por un usuario, ni más ni menos. Por ejemplo una URL del tipo www.dominio.com/article?id=27 no es muy amigable que digamos, sin embargo la URL www.dominio.com/como-optimizar-urls-amigables dónde hay semántica sí es amigable, entendible por un usuario y con información sobre su posible contenido.

 

¿Cómo son en Liferay las URLs amigables de blogs y contenidos web?

Cuando hagas un artículo de blog o un contenido web Liferay convertirá el título de éste contenido en su correspondiente URL. 

Por ejemplo, imaginad que el título de este artículo es “Cómo optimizar las URLs amigables de Liferay Portal”, bien pues tendría de partida la URL “.../como-optimizar-las-urls-amigables-de-liferay-portal….” más un chorrazo de parámetros. Esta URL amigable además de ser muy larga no está limpia de stop words

 

¿Y qué son las stop words?

Pues son palabras vacías de significado como por ejemplo los artículos, conjunciones, preposiciones, pronombres, etc. que no aportan nada relevante a nuestra URL amigable. Cuando escribimos el título de un post del blog estamos añadiendo, por supuesto de forma natural, montones de estas "stop words".

 

¿Cómo escoger qué URL es la recomendable?

Haz un estudio de palabras clave, detecta qué criterios relacionados con el contenido que vas a crear son los que tienen mayor volumen de búsqueda, escoge entre unos pocos y trata de construir una URL lo más optimizada posible. 

Por ejemplo para este contenido podría escoger entre “liferay friendly url” o “liferay url amigable”. El primero, en inglés, es el único que tiene volumen y muy poco además, por lo que aunque mis contenidos son en español optaré por ese y añadiré la coletilla “amigable”, es decir, la url amigable que quiero para este post me quedará del siguiente modo:

/liferay-friendly-url-amigable

 

Entonces ¿Cómo optimizo la friendly URL de Liferay para que sea como yo quiero?

El desarrollo de este artículo, punto tras punto, puede haberte dado una pista. Aquí es donde viene el truco:

Entra en el editor del blog o de un contenido web, escribe en el campo Título la URL amigable que quieras y haz clic en “Guardar como borrador”, LISTO!

Optimizar liferay friendly URL en blogs

Ahora pon el título real que quieras darle a tu artículo y escríbelo con normalidad. ¿Sencillo no?

Sí, es una chorrada como la copa de un pino pero en Liferay no tenemos un editor de URLs para los posts como nos podemos encontrar en Wordpress así que… ahí lo dejo! ;)

¿Tienes más dudas sobre URLs amigables en Liferay? No te cortes!! Comenta!!

Cambios de Google para el marcado de datos en SEO local

Cambios de Google para el marcado de datos en SEO local

A mediados de Octubre publiqué un post sobre marcado de datos orientado a SEO local con el objetivo de ofreceros unas recomendaciones de optimizaciones on-page con Schema.org orientadas al posicionamiento SEO local en buscadores como Google, además incluía la posibilidad de descargaros una plantilla gratuita para hacer esto en Liferay que también podía ser aprovechada en cualquier otro tipo de web. Este artículo tuve que modificarlo justo al día siguiente de su publicación debido a que, casualidades de la vida, en Google “les tocó” ese día quitar de su sección de desarrolladores las recomendaciones sobre este marcado de datos estructurados.

Todavía podéis ver estas recomendaciones en webarchive:
https://goo.gl/MGF2CB
https://goo.gl/YWlPDr 

Hice varios tweets y mensajes directos y viendo que no obtenía información al respecto opté por publicar una consulta en este grupo.

Por lo que parece la información sobre el marcado de datos había quedado “desfasada” y mientras la nueva salía del horno decidieron eliminar esos contenidos, las dos recomendaciones a las que yo enlazaba desde el mi artículo.

Bien pues hará un par de meses hemos tenido una serie de actualizaciones relacionadas con este tema tanto en la documentación de Google como en tests realizados en otros países para la implementación de este marcado para ayudar a mejorar el posicionamiento SEO Local.

  1. Local Business Information
  2. Proporcionar información de tu negocio local
  3. ¿Quiere decir esto que ha dejado de funcionar el marcado con microdatos?
  4. ¿Deberíamos seguir usando microdatos para implementar este marcado?
  5. ¿Qué más podemos extraer de este cambio?
  6. Integrando acciones con lugares (negocios locales)
  7. ¿En qué consiste “Place Actions”?
  8. Herramientas para ayudarte en el marcado de datos estructurados con JSON-LD

Local Business Information

Por un lado tenemos dos nuevas secciones en el apartado Structured Data de Google Developers, una introducción a cómo debemos proporcionar a los buscadores la información de tu negocio local y por otro un apartado en el que se nos facilita información sobre cómo implementar posibles acciones a llevar a cabo con el site (reserva de cita/hora para el médico, etc..)

Proporcionar información de tu negocio local

En el primer apartado del marcado de datos estructurados para negocios locales nos hacen una introducción de qué propiedades podemos incluir dentro de este marcado de datos. Cabe destacar, aquí está uno de los cambios importantes, que ya no nos encontramos con ejemplos de programación dentro del código HTML usando microdatos sino que todos los ejemplos de código se centran en JSON-LD.

¿Quiere decir esto que ha dejado de funcionar el marcado con microdatos?

No! Esto sigue siendo 100% funcional y si tenéis este marcado implementado en vuestras webs podéis comprobar que todo está correcto usando la herramienta de comprobación de Rich Snippets:

https://developers.google.com/structured-data/testing-tool/

Microdatos para Negocios Locales

¿Deberíamos seguir usando microdatos para implementar este marcado?

Pues desde mi punto de vista diría que no. Google parece estar apostando fuerte por JSON-LD y teniendo en cuenta lo que os contaré a continuación sobre las acciones con negocios locales y por el anuncio de John Mueller a principios de febrero sobre el soporte de marcado de datos con JSON-LD….yo optaría por esta tecnología sin dudarlo.

Soporte de JSON-LD para marcado de datos estructurados

 

¿Qué más podemos extraer de este cambio?

Si bien lo que solíamos encontrar habitualmente era un marcado de negocio local a secas, lo que en schema hacía referencia a https://schema.org/LocalBusiness simplemente, ahora deberíamos optar por refinar la información que proporcionamos a los buscadores sobre la actividad de nuestro negocio.

En esa misma URL de schema encontraréis un apartado bajo el título "More specific Types" con varias subdivisiones de tipos de negocios locales que además cuentan, algunas, con subcategorías. Para que os resulte más fácil os he preparado una lista de los typos que tienen Subcategorías más específicas.

Tipos específicos de Negocios Locales - Local Business Specific Types

Por ejemplo dentro de “FoodEstablishment” podemos encontrar panaderías o restaurantes y dentro de “Store” hasta 30 tipos distintos de tiendas.

Tenéis toda esta información en este apartado:

https://developers.google.com/structured-data/local-businesses/ 

Integrando acciones con lugares (negocios locales)

De forma experimental con algunos proveedores de servicio y hasta el momento parece que solo en EEUU Google ha lanzado lo que viene a llamar “Place Actions”, un elemento más para retener al usuario en las SERPs gestionando reservas y citas en negocios locales desde la propia página de resultados de Google.

¿En qué consiste “Place Actions”?

Como ampliación de la ficha de empresa local y una vez hayamos implementado esta programación usando para ello JSON-LD, obtendremos en las SERPs una opción para que los usuarios hagan por ejemplo una reserva en nuestro restaurante o soliciten hora en nuestra peluquería.

SERPs - Reservas y pedidos en negocios locales

Para esto es imprescindible que tengamos hecho un correcto marcado de datos de negocio local y una especificación lo más aproximada posible del tipo de negocio que estamos mostrando. 

Las acciones que podremos implementar son Pedidos y Reservas.

En esta URL tenéis toda la documentación

https://developers.google.com/structured-data/local-businesses/place-actions-standard

En esta otra tenéis un formulario que ofrece Google para hacer una solicitud y convertirse en proveedor de este tipo de datos durante la fase de pruebas. Suerte! :)

https://docs.google.com/forms/d/19n7cIIDxTxantWXE6E3TbPnY6WBl0TbZiYuwf8CofXA/viewform

Herramientas para ayudarte en el marcado de datos estructurados con JSON-LD

Tras muchas búsquedas, solo he econtrado unas pocas herramientas de marcado con JSON-LD que nos pueden ayudar en todo este proceso.

la única que he encontrado que me gusta por lo rápido que resulta usarla y lo ágil que es para un marcado de datos “a manopla” (a mano) es esta: 

The JSON-LD Structured Data Generator v0.1 de @JDDoesDev

https://www.jamesdflynn.com/development/json-ld-markup-generator/

Podemos hacer prácticamente todo el marcado de datos para LocalBusiness incluidas las horas de apertura, pero no podemos especificar con el asistente una subcategoría específica de negocio local, tocaría hacerlo a mano.

Por otro lado la herramienta que parece más completa sin duda alguna, aunque requiere registro y probablemente su uso sea muy limitado, es JSON+LD Schema Generator que podéis encontrar aquí:

https://www.schemaapp.com/tools/jsonld-schema-generator/

Una vez registrados podéis crear el marcado de datos en JSON-LD que se os ocurra ya que su editor tiene absolutamente todas las entidades de Schema.org (o eso creo).
Con su editor podemos escoger Organización > LocalBusiness > Store > Computer Store por ejemplo para iniciar la configuración del marcado de datos para nuestra tienda de informática.
Editor JSON-LD Schema Generator LocalBusiness Store
 
Con su asistente podemos completar todos los datos de cuantos campos queramos informar a los motores de búsqueda
Editor JSONLD LocalBusines information
 
Una vez completados todos los datos que queramos del formulario y guardados los datos podemos generar el código con la opción "Get Schema JSON-LD"
Editor JSONLD obtención de código
Solo quedaría para terminar cambiar la URL de la propiedad @id para que sea una única de nuestro sitio web que no esté siendo usada por nada (no tiene ni que estar operativa, esta URL no es visible)
 

En cuanto a plugins no he conseguido localizar ninguno focalizado en LocalBusiness, los que he encontrado son todos para otros tipos de marcados de datos estructurados como los de producto, pero parece que el de esta herramienta de schemaap.com tiene ya implementada la funcionalidad de Place Actions para reservas y pedidos. (no he tenido ocasión de cacharrear con él)

Lo tenéis aquí: https://wordpress.org/plugins/schema-app-structured-data-for-schemaorg/

 

¿Estás utilizando ya alguna de estas tecnologías o tienes previsto hacerlo? >> Deja tu comentario!!

Vídeo-Tutorial para implementar Universal Analytics en Liferay 6.0

Este vídeo tutorial está orientado a usuarios de Liferay 6.0 que, aunque es una versión bastante antigua de Liferay, existen numeros portales que la usan.

Dado que tenía que documentar para un proyecto de un cliente cómo hacer esta implementación he aprovechado para compartir el proceso con todos vosotros. 

Si necesitas información adicional sobre versiones superiores de Liferay puedes leer el artículo Universal Analytics en Liferay Portal: nuevo código de seguimiento, dónde hablo de las diferencias entre versiones. 

Implementar Analytics en Liferay 6.0

Liferay es una aplicación web por lo que modificar directamente los ficheros sobre el servidor no es el procedimiento adecuado. Básicamente lo que tendremos que hacer es un Hook de Liferay, un pequeño plugin que nos sobreescriba los dos ficheros que tenemos que modificar. 

Estos dos ficheros son bottom.jsp y top_head.jsp que los podemos encontrar en /ROOT/html/common/themes

Los pasos a seguir serán:

  1. En Liferay IDE usar el asistente para crear un Hook nuevo con el SDK de Liferay 6.0.6 y un runtime de esta misma versión, un portal en el que podamos desplegar nuestro plugin para probar
  2. Creamos la estructura de carpetas bajo WEB-INF añadiendo de forma anidada estos 3 directorios html > common > themes
  3. Metemos dentro de la carpeta themes nuestras copias de bottom.jsp y top_head.jsp
  4. Editamos bottom.jsp para eliminar las líneas del script de Analytics y guardamos, el código es el siguiente:
    <%-- Google Analytics --%>
    <%
    UnicodeProperties groupTypeSettings = layout.getGroup().getTypeSettingsProperties();
    String googleAnalyticsId = groupTypeSettings.getProperty
    ("googleAnalyticsId");
    if (Validator.isNotNull(googleAnalyticsId)) {
    %>
    <script type="text/javascript">
    var _gaq = _gaq || [];
    _gaq.push(['_setAccount', '<%= googleAnalyticsId %>']);
    _gaq.push(['_trackPageview']);
    (function() {
    var ga = document.createElement('script');
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    ga.setAttribute('async', 'true');
    document.documentElement.firstChild.appendChild(ga);
    })();
    </script>
    <%
    }
    %>
  5. Editamos el fichero top_head.jsp para añadir nuestro nuevo código de Universal Analytics y guardamos, el código es el siguiente:
    <%-- Google Analytics --%>
    <%
    UnicodeProperties groupTypeSettings = layout.getGroup().getTypeSettingsProperties();
    String googleAnalyticsId = groupTypeSettings.getProperty("googleAnalyticsId");
    if (Validator.isNotNull(googleAnalyticsId)) {
    %>
    <script>
     (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
     (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
     m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
     })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
     ga('create', '<%= googleAnalyticsId %>', 'auto');
     ga('send', 'pageview');
    </script>
    <%
    }
    %>
  6. Compilamos el Hook y lo desplegamos en el directorio /deploy del portal.

SEORCH Snippet Optimizer vs otros optimizadores

En esta ocasión os cuento en este vídeo review de pocos minutos las ventajas de usar el optimizador de snippets SEORCH frente a otros más conocidos como el de SEOmofo o el de MOZ entre otros.

MOZ Title tag preview tool (2014 edition)

Hasta hace un año más o menos me gustaba revisar la optimización de snippets con la herramienta de MOZ ya que permitía simular una búsqueda introduciendo un criterio y ver así si el número de caracteres introducidos en el Título HTML se mostraba completo o no. Esta herramienta quedó desfasada en el momento que Google eliminó el texto en negrita del Título HTML de las SERPs.

https://moz.com/blog/new-title-tag-guidelines-preview-tool

SEOMofo Google SERP Snippet Optimization Tool

Otro optimizador que tenemos, uno de los más conocidos y utilizados, es el de SEOMofo pero de este no me gusta la recomendación que hace de disponibilidad de caracteres ya que muestra un límite de 70 caracteres para el meta-title y muy probablemente este número de caracteres hará que se corte el texto y aparezcan los puntos suspensivos y salvo que la redacción del title tenga el objetivo de generar interés con esos puntos suspensivos no nos interesaría que se cortase.

Como funcionalidades complementarias la herramienta de SEOMofo nos permite:

  • Activar un simulador de resultados de búsqueda (SERPs simulator) añadiendo resultados orgánicos y/o resultados de pago en sus dos variantes
  • Simular resultados en formato Rich Snippet con o sin estrellas de Review
  • Añadir una fecha al resultado de búsqueda
  • Añadir palabras en negrita al Título HTML (obsoleto)

http://www.seomofo.com/snippet-optimizer.html

Portent SERP Preview Tool

Otra que podíamos encontrar entre el repertorio de herramientas de optimización de snippets es la de portent.com dónde ya encontramos una optimización de Título HTML ortientada a un ancho máximo en píxeles de 512px, el dato que realmente deberíamos tener en cuenta para optimizar la visibilidad completa o no de este texto.

Como funcionalidades complementarias en esta tenemos:

  • Añadir una fecha al snippet
  • Añadir formato de Rich Snippet

https://www.portent.com/serp-preview-tool

SEORCH Snippet Optimization Tool

Por último me voy a centrar en SEORCH, la que os recomiendo, ya que es la que veo más completa.

  • En el Título HTML y en la meta descripción tenemos el número de píxeles y caracteres disponibles a medida que vamos escribiendo, la única que tiene esa doble orientación.
  • Una de las funcionalidades más interesantes es que podemos extraer el contenido del Título HTML y la meta-descripción al poner una URL y procesarla haciendo clic en “Fetch data from URL” y empezar a optimizar a partir de ahí.
  • La otra funcionalidad que considero también muy interesante es poder visualizar formatos de snippets en resultados de búsqueda de escritorio, móvil con una resolución de iPhone 6 a 375px y tablet tomando de muestra la de iPad a 768px ambas en formato vertical (portrait).

SEORCH Optimization Tool

Además tenemos también en esta ocasión otras funcionalidades complementarias que afectan a la visualización de los textos del snippet, estas son:

  • Simular la fecha en el snippet
  • Mostrar el texto “Mobile-Friendly” en los resultados para dispositivos móviles

Para terminar cabe destacar que nos mostrará cómo debería ser el marcado HTML para Open Graph y Twitter Cards partiendo de los datos introducidos en los primeros 4 campos. Esto nos podría valer de referencia para comprobar que el plugin o la programación que estemos usando para esto los está generando correctamente pero poco más.

http://seorch.eu/html/snippet-optimization-tool.html

¿Utilizas alguna de estas herramientas o tu preferida no es ninguna de ellas? Entonces deja tu comentario! :)

— 5 Resultados por página
Mostrando el intervalo 1 - 5 de 28 resultados.

Proyectos en los que colaboro

XML Portlet Factory: CRUD portlet development

 

Licencia de Creative Commons
This obra by Miguel Ángel Pau is licensed under a Creative Commons Reconocimiento-NoComercial-CompartirIgual 3.0 Unported License.