Web Stories

Web Stories: el formato stories made in Google

En el mundo del marketing digital siempre hay nuevos formatos, nuevas plataformas y nuevas tendencias. Una de ellas son las stories. No os voy a engañar, ya tienen unos años de vida.

Las redes sociales han ido añadiendo las stories dentro de sus plataformas: TikTok, Instagram, Snapchat.. luego lo intentaron Twitter y Linkedin sin mucho éxito y, cómo no, Google no podía quedarse sin ellas.

Seguramente ya sabrás qué es una story, es un formato vertical pensado para reproducirse en el móvil, con navegación lateral entre cada fragmenteo, un formato que está más que extendido. En la mayoría de redes sociales tienen una vida útil de 24 horas.

Google ha querido darle una vuelta de tuerca a esta forma de utilizar las stories y ha pensado en un formato que pueda permanecer en el tiempo, que no esté limitado a las 24 horas, que pueda ser descubierto sin seguir al creador de las stories y sobre todo que cuente cosas relevantes, historias. Para ello, Google ha optado por crear un plugin para WordPress para crear Web Stories, un plugin que ha evolucionado mucho desde su lanzamiento.

Antes de ver cómo crearlas voy a explicarte qué diferencian las Web Stories y, por último pero no menos importante, por qué pueden ayudar a un storyteller con su trabajo.

¿Qué son y que tienen de especial las Web Stories?

Las stories son un formato archiconocido y omnipresente muy utilizado – por las generaciones más jóvenes – en dispositivos móviles. Un formato que, como habrás comprobado, nos muestra un contenido a pantalla completa donde podemos ir hacia delante o hacia atrás de un listado de diapositivas que conforman la historia y que nos convierte en zombies enganchados al clic lateral.

Aquí tienes otro ejemplo, por si las moscas:

Es un formato que se aprovecha de la recompensa variable para modificar nuestro comportamiento, en este caso delante de una web. Esa recompensa variable que nos engancha y sube nuestros niveles de dopamina, liberándose cuando se observa la señal, ya que actúa en la anticipación de la recompensa de ver la siguiente diapositiva de la historia.

¿A caso quién no ha mirado cuantas stories nos quedan por ver de la secuencia de un instagrammer? Esa es una señal.

¿Las web stories y las social stories (tiktok, instagram, snapchat, twitter…) son iguales?

No. Lo que diferencia radicalmente las web stories de las social stories es el objetivo. El objetivo de las web stories es totalmente diferente al objetivo de las social stories.

Me explico.

Las stories de instagram tienen más interacción con el usuario, persiguen el interés del usuario, conseguir engagement, está claro que captar la atención también es relevante, pero es más difícil ya que el factor diferencial es menor. Mientras las web stories al tener más alcance, ya que las encontramos en Google, tienen que perseguir captar la atención en un entorno diferente, lo que les permite destacar en el formato. Persiguen esta atención mostrando un formato novedoso, tanto en las SERP (resultados de búsqueda), como en Discover, que es donde nos interesa aparecer con las Web Stories.

Pero esto no es lo único que les diferencia. Vamos a compararlas en un mano a mano.

Diferencias de las web stories vs. las social stories

Social Stories

  • NO son accesibles a personas con dificultades visuales.
  • No se pueden incrustar fácilmente dentro de una URL.
  • Caducan en 24 horas, a no ser que las tengas guardadas dentro de los  highlights de tu perfil.
  • Sólo se pueden editar desde móvil, no permiten ser editadas una vez públicas.
  • Se pueden crear encuestas y se puede interactuar mejor con el usuario.
  • Sólo puedes crear enlaces si eres un usuario con más de 10K seguidores o mediante Stories patrocinadas.

Web Stories

  • Sí son accesibles a personas con dificultades visuales.
  • Alcance público, que le da mediante aparición en las SERPs y en Discover.
  •  Tienen URL propia y dentro de TU dominio, les permite ser rastreadas e indexadas por Google.
  • Se pueden añadir en una URL mediante un embed o un iframe.
  • No caducan. Pueden aparecer en Discover cuando temática es tendencia y pueden reaparecer tiempo después.
  • Se pueden editar desde desktop una vez lanzadas (mediante el CMS WordPress).
  • No hay interacción con el usuario.
  • Se pueden crear enlaces sin restricciones ni límites, aunque recomiendan un sólo enlace por story.

Mientras las social stories buscan el engagement con el usuario, las web stories están más preparadas para poder captar la atención (permiten tener título y descripción, portada…). Al tener una URL propia, que no caduca, y ser indexables por Google, permiten ser descubiertas en cualquier momento por alguien que esté buscando información sobre esa temática.

Veamos ahora cómo se crean las Web Stories, y de forma gratuita. Para ello utilizaremos el CMS WordPress y el plugin oficial y gratuito de Web Stories que sacó Google.

¿Cómo crear Web Stories en WordPress?

Desde mediados del 2020 se pueden crear Web Stories desde tu página web hecha en WordPress mediante este plugin. Utiliza una interfaz totalmente gráfica, nada de código, así que si tienes un poco de gracia con Photoshop, esto para ti será pan comido.

Wordpress Web Stories

Del editor visual qué puedo decir que no se sepa de un editor visual. Es un editor muy intuitivo. Vamos a hacer un poco de repaso de varios aspectos y algunas recomendaciones de uso.

El editor visual se encuentra dentro del apartado «My stories«, se llega a él entrando a una de las stories o creando una nueva.

En el lateral izquierdo del editor encuentras 5 pestañas con diferentes opciones, los voy a analizar de izquierda a derecha según los iconos superiores que se ven en la captura de pantalla:

Panel Izquierdo Editor Web Stories

 – Subir imágenes o cargar imágenes desde la galería de medios de WordPress, si eliges la  opción de subirlas mediante botón Upload, te dejará subir imágenes de Pixabay.

–  Utilizar imágenes, videos y GIF’s de terceros: Pixabay (imágenes), Coverr (vídeos) y Tenor (gifs) para ser exactos. Aquí voy a dar un briconsejo. Ojo con el peso de las imágenes y los vídeos que te proporcionan. Sale mejor obtenerlos desde Instagram, vienen mejor comprimidos.

Añadir  textos y cabeceras: Con el mismo editor de diseño podremos cambiar el formato de estas cabeceras, tanto en tamaño cómo fuente.

Cabe recalcar que en este plugin no están implementadas las cabeceras (o headers) H1, H2, H3, H4, H5 y H6. A partir de mayo de 2022 ya podemos utilizar cabeceras sin que las transforme en span, aunque han tardado 2 años, además algunas veces te modifica automáticamente el tipo de cabecera según tamaño de fuente que especifiques. Tendréis que verificar que se os han aplicado bien si sois unos puristas de la jerarquía de cabeceras.

No todo son fallos, ya que desde hace poco se puede utilizar desde el apartado de añadir textos es importar módulos prediseñados de título y texto, para que se lean genial, además solucionan muy bien la papeleta si tus dotes de diseño son nulas. Además te dan la opción de utilizar estos sets con la fuente que hayas utilizado en el resto de la story, la fuente de tu marca, para evitar los típicos mejunjes de fuentes. Muy útil para evitar el sangrado de ojos.

Incluso en el apartado de settings puedes subir una fuente propia si la marca lo requiere, el enlace a la fuente será adaptado al formato AMP, así que se validará correctamente.

Añadir capas de diferentes formas, genial para crear fondos de los textos, botones y efectos muy chulos. Además tienen el formato SVG así que no pierden definición y pesan muy muy poco. Una opción a utilizar muy interesante si queremos crear animaciones.

– Por último, la pestaña Póker, como le llamo yo. Aquí encontraremos diapositivas enteras de stories donde únicamente tendremos que cambiar los textos y las imágenes. «Que inventen ellos» como decía Miguel de Unamuno. Estas plantillas de página son las mismas que se pueden utilizar si decides importar toda una plantilla entera de stories en el apartado «Explore Templates», ya llegaremos a él más adelante.

Editor de diseño de las Web Stories

En el lateral derecho del editor hay tres pestañas, empezando por Design, la pestaña para editar el diseño de la story. La pestaña Document para modificaciones del documento, y una reciente Checklist que te da muy buenas pistas para saber si vas en buen camino o no. Haremos un repaso y algunos tips, pero aquí ya entra más la capacidad creativa que puedas tener al utilizarlas:

Lateral Derecho Editor Web Stories

– Diseño de la story: en el apartado Size & position te permite modificar la capa y ajustar atributos de tamaño, color,  posición relativa, rotación, alineación… Mil opciones para crear un estilo y conseguir que sea homogéneo. La capa tal y como hemos visto anteriormente puede ser una imagen, un video, gif, texto o un SVG. También las puedes ordenar para que se muestren en el frente o en el fondo desde el apartado Layers. Solamente debes arrastrar hacia arriba la capa que quieres que se muestre en frente de otra.

Si la capa es de texto se activan otras funcionalidades como crear un fondo para el texto (para que contraste),  alineación, tamaño y estilo de fuente, altura de línea y otros aspectos que afectan a las tipografías.

Un aspecto a destacar, a nivel de usabilidad, es que puedes crear un enlace (desde el apartado Link) a cualquier capa, Google recomienda no poner más de un enlace por Story, pero si estamos mostrando un outfit con varias prendas, irá genial para marcar los productos y vincularlos con la ficha de producto. Si no quieres que tu story sea visible en Discover, puedes crear tantos links como quieras, sin restricciones. No se si me explico.

Además tenemos el apartado Corner radius para redondear los bordes de las capas y Border para añadirle un borde, sea sólido, punteado u otro muy feo, no lo recomiendo para nada.

Si nuestra capa NO es de texto se activará el apartado Accessibility (realmente son etiquetas ALT) que permite leer el contenido y hacerlo accesible a las personas con dificultades visuales y atención, Google te puede añadir el contenido de este apartado dentro de una metadescripción.

Por último, en el apartado Animation encontrarás multitud de efectos que puedes aplicar a todas las capas de tu story. Google recomienda no pasarse con la cantidad de animaciones ni demorar mucho la visualización de la story por culpa de estas animaciones. Yo recomiendo que tengan un sentido, como reproducir el latido de un corazón (ver mi story de contacto), o mostrar un efecto que tenga que ver con el texto.

A bajo del todo del panel encontramos la pestaña Layers, que como he explicado antes, sirve para ordenar las capas. Aquí recomiendo ordenar el texto de arriba a abajo para hacerlo leíble, estas capas no dejan de convertirse en código y debe ser leíble y estar bien organizado para que sea accesible tanto a Google como a las personas con dificultades visuales. Pensad que estas Stories son accesibles a personas con discapacidades, una gran ventaja respecto a las social stories.

– En la pestaña de Document puedes realizar las modificaciones de la portada y de publicación de la story, la puedes tener en borrador, publicada o en modo privado para trabajarla en equipo.

Es un apartado que debemos trabajar muy cuidadosamente porque desde aquí podemos cometer los principales errores de una web story. Un apartado que tiene miga porque puedes configurar:

– Cover de la story, la cual es aconsejable que sea 640x853px y que no contenga texto, siempre respetando una proporción 3:4 y al ser posible con la «chicha» de imagen en la parte central, ya que existen varias visualizaciones de las stories en SERPS y Discover. Podrás comprobar los diferentes tipos de visualizaciones de las stories en el validador de stories que te ofrece Google, si la validas y accedes a la previsualización de la story verás muy claro a qué me refiero.

– Se puede modificar fecha de publicación. Aunque avances esta fecha, no ayudará a que el contenido vuelva a aparecer en Discover, a mi no me funcionó.

–  Añadir o modificar logo del publicador, que recomiendo sea mayor de 96x96px.

– La descripción de la story, hasta 200 carácteres, pero no te preocupes que como siempre, google se la salta a la torera y utiliza el texto que quiere para tu meta description. En las Stories no es una excepción.

– Podrás escribir el enlace permanente de la story. Siempre recomiendo pocas palabras, si quieres poner la keyword principal para quedarte tranquilo, ponla, pero eso sí, si son varias palabras, separadas por guiones medios.

– Seleccionar el avance automático o manual de las stories y además seleccionar segundos entre cada salto de stories, en el caso que quieras un avance automático. Depende de qué stories yo prefiero que salte de forma manual. Es un apartado fácilmente desconfigurable, siempre vuelve a los 7 segundos, por arte de magia.

 A parte del editor de Stories que hemos analizado, hay otros apartados del plugin que son fácilmente configurables.

Plantillas de Stories para no calentarse la cabeza

En el apartado «Explore Templates» podrás crear una story entera con una plantilla, un uso muy habitual debido al tiempo que te ahorras. Si decides importar estas plantillas, ten en cuenta que muchas de ellas incorporan Animaciones que NO podemos reproducir desde el editor, ya que las pone dentro de una categoría «Move» que no podemos encontrar dentro del catálogo de animaciones (por ahora). Así que utilizar estas plantillas puede proveernos de efectos que no tendremos si las creamos desde 0.

Otros apartados del plugin que no debes menospreciar

El apartado All Stories permite acceder, editar o borrar cualquier story, ver cuando se ha creado y quién lo ha hecho, cómo si accedieras a cualquier otro post type de WordPress y en Add new creas una story nueva, hasta aquí nada relevante. Pero hay un tercer apartado, el de Settings, que este puede ser muy relevante para que las Web Stories te interesen.

– En Settings puedes añadir tu código de Analytics para poder analizar las visitas y crear eventos para las Web Stories, de nada Google. Por aquí empecé yo a trastear las Stories, y mira ahora…

– Podemos añadir el Publisher logo, que será como mínimo de 96x96px y que tenga un fondo, para que sea visible. Si no tiene fondo, puede que no haga contraste con el Cover de la publicación, no sea leíble y Google no te querrá.

Por último, la guindilla. Puedes añadir tu código de Adsense para Monetizar las Web Stories. En tu cuenta de Adsense deberás crear un bloque de anuncios del tipo Display vertical y añadir tanto el código de publicador de Adsense – el «data-ad-client» – que empieza por «ca-pub-…..» y el código del bloque de Display vertical, el «data-ad-slot».

Y todo esto te permiten hacer las web stories. ¿Te parece poco?

 ¡Ah! Que no lo he dicho antes pero el lenguaje que utilizan estas Stories es AMP. Y lo mejor de todo es que no vas a tocar una línea de código.

Nunca había sido tan fácil editar AMP stories

Realmente las web stories estan creadas mediante el formato AMP (Accelerated Mobile Pages), formato al cual Google había dado siempre tanto crédito, estamos en 2022 y las cosas han cambiado ya que no le dan ninguna ventaja para mejorar su visibilidad, aún así es un formato válido para indexar.

Anteriormente se llamaban AMP stories, pero se les ha hecho un «rebranding» para que parecieran más inofensivas a los departamentos de IT, a los que, cuando mencionas la palabra AMP se les ponen los pelos como escarpias. Google lo que ha hecho es adaptarlo a un plugin para WordPress para hacerlas más accesibles, pero realmente estaban creadas por AMP Project y OpenJS Foundation.

¿Quiere decir esto que tengo que aplicar AMP en toda mi web para tener web stories? No, por suerte.

El problema actual del formato AMP es que es un poco tedioso de implementar, existen muchos problemas de validación, múltiples incompatibilidades con otros scripts o plugins.. ¿Quién no se ha peleado con el formato AMP para añadirlo a su blog y ha desistido?

Además es un formato que años atrás gozaba de preferencia en Discover, mediante el etiquetado que mostraba que era un contenido rápido, ahora compite sin ninguna preferencia con otros formatos.

Pero aquí hemos venido a hablar de las AMP stories, construidas con el framework de AMP, con la ventaja que no tocaremos una sola línea de código. Este formato de Amp Stories imita al formato de historias de Instagram, pero nos ahorran la mayoría de inconvenientes de formato que AMP nos ocasiona.

Seguirás pensando en que es otra copia más de las stories de instagram.¿Estás seguro que sirven para lo mismo?

¿De qué me sirven las Web Stories?

Si llegado a este punto aún no has encontrado una aplicación para las web stories, es que las odias demasiado. Siento decírtelo. Y esto me beneficia porque yo sí pienso sacarles partido con múltiples aplicaciones (incluso las utilizo para felicitar aniversarios).

Veamos diferentes aplicaciones que pueden tener. Es un formato ideal para:

  • Captar la atención, tan volátil como es en una búsqueda o en una navegación por Discover.
  • Reforzar imagen de marca con un formato muy dinámico.
  • Presentar una novedad de una forma creativa.
  • Ser el primero en utilizar un formato novedoso que te diferencie del resto, por ejemplo crear tu currículum en formato story ¿os suena de algo?
  • Explicar una historia con la ayuda de imágenes, videos y animaciones que ayuden a transportar al usuario dentro de la historia.

¿Únicamente se pueden utilizar para storytelling?Puedes utilizar las web stories para contar historias (el famoso storytelling). Son ideales para vender un concepto de una forma muy visual mediante un formato que capta la atención, pero que también la mantiene. Algo muy importante si queremos explicar historias y que no desconecten rápidamente.

¿Y ya está?

También podemos utilizar las stories para otras funcionalidades, y ahí van algunas ideas que han funcionado muy bien:

  • Guías turísticas (como hace localhood.com)
  • Cartas, menús y sugerencias para restaurantes TOP TOP TOP.
  • Presentar nuevos productos de una forma muy dinámica
  • Mostrar próximos eventos.
  • Importar stories de opiniones del instagram de la marca a la web, con la finalidad de hacer una página de opiniones propia, con control total de contenido de las opiniones que quieres destacar y además con enlaces hacia los productos, enlaces altamente transaccionales.
  • Landing para campañas de ADS, para mejorar el primer impacto y calentar al visitante (ojo segunda idea).

Como podemos ver con las múltiples aplicaciones que os sugiero, las web stories no nacen con la intención de substituir todo el contenido de nuestra web ni de su blog, su razón de ser no es dejar de hacer todo lo que hacíamos anteriormente.

Las web stories no vienen para SUBSTITUIR contenido, sino que vienen para COMPLEMENTARLO

10 beneficios de las Web Stories

  1. Introducción a un contenido más denso >> Menos tasa de rebote a la URL final.Aquí debo hacer una puntualización: Google NO quiere Teasers sobre una temática, sino que quiere que creamos historias completas. Crear una web story con 2 o 3 diapositivas introduciendo un TOP 10 un producto concreto y enviar hacia la URL final para seguir con el TOP 10, no es una práctica recomendable. En este caso, es recomendable crear una historia que ayude a comprender este TOP 10 de productos o la URL final (Ver post oficial sobre esta recomendación).
  2. Puedes saber como interactúa el usuario con las stories, cuáles de ellas son las más vistas, cuál es el % de usuarios que finalizan las stories. (Ver post sobre analítica de las web stories).
  3. Contenido ÚNICO, difícilmente copiable. Debido a su componente altamente gráfico.
  4. Las web stories te pertenecen, están en TU dominio. He probado otras opciones como Tappable y todo el contenido que creas está dentro de su dominio. También he probado otros formatos que parecen Stories pero al final resultan ser modals sin URL propia… Con las Web stories puedes estar tranquilo porque el contenido te pertenece.
  5. Son relativamente baratas de realizar.  Vamos a matizar un poco este aspecto. El plugin de Web Stories, colgado en el repositorio de WordPress, es gratuito y las plantillas que vienen también, así que solo dependes del factor tiempo para crearlas. Si tienes un perfil diseñador y tienes facilidad para redacción y para contar historias, puede ser un formato ideal para ti, si no contáctame y te hago presupuesto.
  6. Aumentas el alcance de tu contenido porque pueden aparecer en Discover (es difícil, no nos engañemos).
  7. Carga rápida sin alterar los recursos de la web. Esto es muy interesante porque se cargan independientemente los recursos de las stories que de la web, de este modo una página web con muchos complementos o muy cargada de plugins no afectará negativamente a las web stories, ya que no carga (no hereda) los recursos. Y viceversa, muchas stories no afectarán al rendimiento del resto de la web (a no ser que tengas las web alojada en un servidor pésimo).
  8. Desde la versión 1.2 disponen de Animaciones, tanto en texto, capas como imágenes. Así que puedes ofrecer un contenido mucho más dinámico (ver mi portada). Hay un sinfín de tipos de animaciones, y además podemos especificar en qué segundo queremos que se activen y algunas de ellas permiten repeticiones. Así que podemos reproducir el latido de un corazón (ver mi portada).
  9. Desde la versión 1.3 se pueden monetizar mediante Adsense u otras plataformas, así que puede ser un buen aspecto a considerar si conseguimos que tengan impacto en Discover. Además salen en formato viñeta pantalla completa, un formato que está en auge dentro de Adsense.
  10. Puedes utilizar las Web Stories para «blanquear» tu estrategia de SEO. Si tu web utiliza algunas técnicas blackhat, las web stories te pueden servir para «limpiar» tu reputación delante de los bots y sobre todo ante los revisores de google mientras ellos piensan: «¡oh! utiliza formatos creativos de creación de contenido, seguro que no copia nada ni obtiene enlaces a cambio de billets.»

Como siempre no todo es tan fácil ni tan bonito, pero la cantidad de beneficios supera a los inconvenientes, vamos a ver ahora qué aspectos no gustan tanto.

Inconvenientes de las Web Stories. Que no son pocos, pero a mi me suenan a excusas.

  1. Es un formato que no te garantiza un buen posicionamiento en las SERP. Al ser un contenido más visual, es más fácil que aparezca en Discover o mediante alguna tarjeta reservada a las stories. Tampoco se garantiza que aparezca en Discover, de las stories que he creado hasta la fecha, solo un 20% han salido en Discover. Así que, puede ser que la story no tenga repercusión.
  2. Es lento crearlas, comparado con las stories sociales.
  3. No permite interacción con el usuario. No se pueden enviar mensajes (aún) ni se pueden crear encuestas (aún), aunque parece que esta última funcionalidad la tengan en su roadmap.
  4. Si no tienes un perfil de creador tipo «Juan Palomo», necesitas de un Copy, un diseñador y un SEO, para poder lanzarlas.
  5. El sector del desarrollo web y SEO tiende a demonizar/odiar/menospreciar/velipendiar/aborrecer las Stories, debido a la inclusión masiva del formato story a casi todas las redes sociales; tenemos stories en TikTok, Instagram, Twitter, Linkedin, Whatsapp, Facebook, Snapchat.. Hay cierto escepticismo dentro de la comunidad SEO de su uso.
  6. No funcionan los H1 en el plugin Web Stories de WordPress.
    ¿Qué? ¿No funcionan los H1? Pues no. No te muestra ninguna cabecera, ya que las transforma en span. Cualquier cabecera, sea H1, H2 o H6 te las convierte en span. Este bug está reportadísimo en github, veremos cuando lo solucionan.

    (Después de 2 años machacándoles en Github activaron las cabeceras y en marzo de 2022 ya se pueden añadir correctamente. Es más, creyeron oportuno detectar cabeceras en tu contenido especificandolas automáticamente mediante sus algoritmos, lo que creó un pifostio importante de cabeceras en stories que antes no tenían y en la jerarquía de cabeceras que te generaban. Tal fue el desastre que tenías que borrar el título y volverlo a generar. No ha sido hasta 20 de julio de 2022 que se pueden modificar fácilmente las que ya existían desde el editor. Dos años y 3 meses después de lanzar la app. 2 años, 3 meses. Google, no un desarrollador independiente de Chiquitistán, Google.)

    Bien… seguimos.

Recomendaciones de Google para crear Web Stories

Aquí van algunas recomendaciones que he sacado de la web oficial de Web Stories de Google y de las píldoras que crean mediante el blog de Web Creators de Google:

  • Crear stories con menos de 20 diapositivas. Aunque es una recomendación que me he saltado más de una vez y creando posts de 58 diapositivas, sin que esto afecte a su funcionamiento.
  • No añadir más de 270 caracteres por diapositiva de la story. Como si fuera un tweet, puntualizan.
  • Imágenes y vídeos en vertical. Sobre todo los vídeos, y más si tienen que aparecer como fondos de pantalla.
  • Imagen de portada (cover) con un aspecto ratio 3:4, con la imagen centrada. He creado posts con «covers» de tamaño 640x853px (mínimo aceptable) y en 1280×1706, válidas ambas.
  • No añadir enlaces de afiliado a terceros desde las stories. Recomiendan utilizar las stories para dirigir al usuario hacia otro contenido donde se amplíe el contenido. Esta recomendación aplícala únicamente si quieres aparecer en Discover.
  • No crear trailers de una historia (historias incompletas que te envíen a un contenido final) ni stories cortas de 2 o 3 diapositivas con múltiples enlaces. Recomiendan crear historias completas que puedan servir de referencia para explicar tu propósito. ¿Qué sería una historia sin una moraleja?
  • «No utilizar titulares clickbait» y lo pongo muy entre comillas, ya que muchos de los titulares que aparecen en Discover son clickbait, no disculpa, TODOS son clickbait. Así que esta recomendación es el típico Disclaimer que nadie se cree.
  • Esta recomendación es mía, es obvia pero de tan obvia muchas veces no la aplicamos. Ordena las capas de texto e imágen. Para que el texto tenga un sentido, en el control de capas pon arriba de todo las que quieres que se lean primero (como photoshop), independientemente de la ubicación que tengan dentro del contenido, lo que manda el orden del contenido son las capas. No sirve de nada meter el típico «Haz clic aquí» si no sabe dónde le pides que haga clic. O meter el titular después del texto, otro error típico, ya que gráficamente no lo notamos, vemos que el titular está arriba y pensamos que la capa también, pero dentro del código se muestra desordenado e ilegible.
  • Compartir las web stories en redes sociales cómo Instagram o Twitter. Si vamos a compartirlas en Twitter hay que asegurarse que se muestren los metadatos, ya que estos generarán la tarjeta de Twitter correctamente. Para validar tu story puedes hacerlo aquí.

¿Qué visibilidad me pueden aportar las Web Stories?

Las web stories pueden aportar visibilidad en el ecosistema de Google, tanto en los resultados de búsqueda (SERP) como en Discover:

Web Stories: El Formato Stories Made In Google 6
  • Aparecer en Discover:  un hito que nos interesa mucho por el alcance que tiene, su creciente utilización y la forma de navegación del usuario, que está en búsqueda de la recompensa variable de la que anteriormente hemos hablado. Este formato lo convierte en ideal para aumentar el alcance en búsquedas indirectas, ya que aparecerá en audiencias afines a nuestro perfil.
  • Exposición, que por ahora es muy poca, en los resultados de búsqueda de Google.es. Los resultados que salen en nuestro mercado compiten, a mi parecer y según mi experiencia, en desventaja con las URL debido a varios aspectos de SEO en URL’s clásicas que a las Web Stories no podemos utilizar tanto contenido. Sí, lo sé, mi portada está hecha con web stories, pero mi objetivo no es posicionar por «Consultor SEO». La baja exposición de las Web Stories en las SERP no me quita el sueño. Mi objetivo es otro (diferenciación).
  • ¿Cómo puedo ver el alcance de mis Web Stories? Puedes rastrear la exposición de estas Stories desde Google Search Console, desde el apartado de Rendimiento, añadiendo el filtro de Apariencia en el buscador y filtrando resultados según «Historia Web». Tal y como puedes ver en esta captura de pantalla:
    Web Stories En Google Search Console

¿Cómo pueden aparecer mis Web Stories en Discover?

Magia negra, y punto. Un muñeco de vudú con la figura de John Müller es la única manera para aparecer en Discover.

Es broma.

Existen varias señales de diseño y muchas optimizaciones SEO que podemos dar a Google para aparecer en Discover, y son las siguientes:

  • Story validada en AMP validator y en la herramienta de validación de Google Search Console.
  • Coincidencia con los intereses del usuario. Formar parte de la audiencia interesada es básico en Discover. ¿Cómo definen audiencias en Google?
  • Incluir datos estructurados (Schema) a elegir entre los siguientes: Article, LocalBusiness, Recipe, VideoObject. IMPORTANTE: si utilizas Rank Math para gestionar el Schema (aparte de otras muchas funcionalidades de SEO) de tu web, solamente podrás utilizar el Schema de Article para las web stories.
  • Que el usuario interactúe y que no vuelva atrás buscando otro resultado (Pogo-sticking). Esto quiere decir que si un usuario viene de Discover y no interactúa con el resultado y vuelve a Discover, esta web story se muestra menos, hasta desaparecer. Comprobado.
  • Contenido bien redactado y único. Este aspecto es bastante obvio.
  • Crear enlaces desde la web hacia las stories para poder mejorar la relevancia de la Story.Por ejemplo: poner un enlace en el menú de «Últimas stories» con un enlace a la última story publicada. También puedes mejorar la relevancia de esta story mediante un enlace desde la categoría más afín a la story. En la web de Mesaka (dale para googlearla) he utilizado las Stories como puente desde la página principal hacia las páginas de categorías y hacia algunas reseñas. También funciona muy bien enlazar stories desde la categoría concreta.
  • Crear un Sitemap.xml de las web stories. Desde Rank Math ya dispones de esta funcionalidad.
  • Crear enlaces hacia diapositivas concretas de una web story, los típicos anchors, añadiendo el parámetro: /#page=[ID de página] al final del enlace. Por ejemplo, si habéis dado en el enlace de «contáctame y te hago presupuesto» os envia a: bernietorras.com/#page=… Saber la ID de la web story ya es otra historia. Pista: está en el código fuente.
  • Imágenes con el etiquetado de Accesibilidad correspondiente, no deja de ser el ALT. Este puede parecer otro aspecto poco común, pero he detectado que, no solo una vez, sino que muchas veces lo ha utilizado como meta description. Sí, aunque hayas establecido una meta description concreta en la web story, Google se la salta y muestra el contenido que quiere. ¡Oh! ¡Qué novedad! Google saltándose las meta descriptions.
  • Buen diseño de las stories y que se ajuste a la imagen de marca, este aspecto es fácil de conseguir, ya que permite utilizar muchas fuentes de Google, animaciones, capas y bloques de texto con estilos ya diseñados. Si no dispones de un diseñador experto, puedes utilizar las múltiples plantillas gratuitas que incluye.
  • Utilizar vídeos cortos para incluir en diapositivas, en formato vertical y que cada vídeo colgado dentro de la web story tenga una imagen de portada (cover poster) para mejorar su carga.
  • Contenido de actualidad, sobre una temática que esté de moda. No tenemos que olvidar que estamos compitiendo con medios los cuales logran que sus noticias se muestren en Discover.
  • Pocas animaciones de texto o que sean rápidas.
  • Crear una historia que enganche. Sea una historia personal,  y es que de historias tenemos muchas que contar, y si las explicamos bien, ayudándonos de la parte audiovisual, te ayudará a ganar alcance y seguramente unas buenas ventas.

Podcasts en los que he participado dando tips sobre Web Stories

Ahora que ya has leído un poco sobre las Web Stories, un poco de audio.

Aquí te dejo 2 participaciones en podcasts para que puedas descubrir qué más se puede hacer con las web stories:


Pensabas que ya estaba… El Bernie «Turras» este mete los audios al final y apa, artículo terminado. ¡Pues no!

Mi conclusión después del uso de las Web Stories

Tras más de 2 años de experimentar con las web stories, de aprender como se analizan, equivocarme una y otra vez, testear y probar usos muy diferentes entre sí, saco algunas conclusiones.

Las Web Stories son buenas para utilizarlas incrustadas o en un apartado específico de la web y sorprender al visitante. Sorprenderle y retenerlo. Además aportan una buena imagen de marca, pueden servir para mostrar opiniones en instagram sin tener que salir de la web, mejorando la confianza del usuario, y de rebote aportando un contenido E-A-T friendly (fácil de comer y perdón por el chiste).

Si queréis ver cómo hacerlo, aquí os dejo un pequeño tip que presenté en el SEOplus de 2022.

Me gustaría recalcar que indirectamente sí pueden ayudar al SEO, ya que está más que comprobado que las acciones que mejoren el branding del negocio tienen un efecto positivo en el posicionamiento orgánico, es algo que Google se esfuerza mucho en recomendar a los creadores de contenido.

Pero hay un asunto que a la mayoría de SEO’s nos preocupa, cómo obtener beneficio de nuestras implementaciones en las SERP. Vamos a hablar de los resultados de búsqueda (SERP) y de su visibilidad en ellas.

Es bien cierto que en google españa (google.es) hay módulos en las SERP que aún no son visibles, por ejemplo el módulo de «Visual Stories» que está pensado únicamente para stories. Es allí dónde las stories cobran sentido para la obtención de visibilidad, también en Discover donde podemos buscar el codiciado alcance masivo, pero como explico anteriormente, la probabilidad de aparecer, es muy baja.

Su presencia en Discover y en las SERP en España se irá modificando dependiendo de la respuesta que tengan, Google está en constante adaptación. Google son expertos en ubicar con calzador un formato dentro de los resultados de búsqueda.

Por otro lado, si nos ponemos pesimistas, no será la primera vez en Google que después de meter algo con calzador, lo quitan por mil razones, por ejemplo Google plus.

Ahora bien, para explicar una historia con el fin de vender un producto o un servicio te pueden ayudar mucho.

¿Te imaginas una buena historia contada con la ayuda de estas Web Stories? 

Y es que las historias venden. Perdón, las historias bien contadas venden. Imagínate si además le pones imagen y audio.

¡Por último!

¿Cómo descubrí las web stories?

Gracias a un post de Carlos Ortega que hablaba de ellas, me entró la curiosidad de aprender como se medía su visualización en Analytics, y me puse con ello. Podéis ver mi post sobre analytics para web stories aquí.

Scroll al inicio