Las mejores prácticas recomendadas para crear una historia web exitosa

Las historias web son un formato de narración inmersivo, que se puede percibir y compartir fácilmente, estas se crean utilizando una subsección del Framework AMP. Las historias web son una oportunidad para que los creadores y los editores organicen el contenido en una experiencia dirigida a los dispositivos móviles en pantalla completa, con riqueza visual y atractiva para los usuarios.

Las historias de web son aperitivos, y a los lectores les gustan los bocadillos rápidos en sus micro momentos. Esperar el metro o tomar un café abre oportunidades para consumir contenido de forma resumida. Asegúrese de que con cada bocado enganche y deleite siguiendo estas mejores prácticas recomendadas para crear un aperitivo satisfactorio de una historia web.

Con un solo vistazo

Las principales enseñanzas para crear una historia web satisfactoria y entretenida son las siguientes:

• Contar una historia completa e interesante.
• Maximizar el impacto de su portada con imágenes de alta calidad y un título que sea fácil de recordar.
• Hacer que sea visible con videos e imágenes que se ajusten y llenen la pantalla del usuario.
• Se puede decir mucho con menos, especialmente cuando se utilizan medios visuales. El objetivo mantener el texto por debajo de las 10 palabras por página.
• Cuando se trata de videos, los más cortos son los mejores, así que intente ajustarlos a menos de 15 segundos de duración.
• Algunas personas y algunas situaciones necesitan visualizaciones sin sonido. Mantenga el contenido incorporado al agregar subtítulos a los videos.
• Ofrezca a los lectores algo que puedan aprovechar. Una longitud promedio de 10 a 20 páginas permite que la mayoría de los autores relaten una buena narrativa.
• No abuse de las animaciones ni inserciones, y ponga atención al periodo de transición.

Conozca su narrativa

Planifique la introducción de la historia, cree un arco argumental y desarrolle una narrativa completa. En cuanto sepa lo que quiere decir, sepárelo. Cada página de la historia web debe transmitir una idea única que funcione de manera coherente con las demás.

Cree contenido elegante y agradable

Cada historia web debe ser como mínimo de 4 páginas e idealmente menos de 30. Las historias web deben estar bien narradas y ser fáciles de disfrutar. Si su narrativa lo requiere, puede prolongarse más allá de 30 páginas.

¡Elígeme! Cómo realizar el empaquetado

Su portada es el empaque de su historia web. Es lo primero que verán los espectadores y, si no lo abren, es lo único que verán. ¡Asegúrese de que sea atractivo! Una buena portada consta de dos elementos, imágenes llamativas y un título breve y memorable.

Creación de imágenes

Utilice una imagen con formato de retrato o video de alta calidad que se ajuste a la pantalla completa. Permita que sus admiradores sepan que es su marca incluyendo un favicon y un logotipo.

Título

Publique un título preciso y claro, que idealmente tenga menos de 10 palabras en menos de 40 caracteres. Incluya el autor y el nombre de la publicación y agregue una fecha de publicación si la historia es urgente.

Marca y fecha

El lector necesita saber quién y cuándo publicó la historia web. Incluya la identidad de una marca y una fecha de publicación en la portada. Si a un usuario le gusta su contenido, esto estimulará su confianza y lealtad. Esta historia web de CNN sobre viajes en Italia facilita las consultas rápidas sobre quién publicó la historia y que tan reciente es.

Entretenimiento visual

Capte lectores con imágenes de calidad que cautiven su atención y escriba textos que puedan leer fácil y rápidamente. Utilice principalmente videos e imágenes de alta calidad, pero agregue un poco de ingenio en las animaciones, donde tenga sentido.

Todas las imágenes y videos deben ocupar toda la pantalla con el uso mínimo de adaptaciones, donde tenga sentido.

Videos

Los videos son sumamente atractivos para los lectores, definitivamente incluya tantos como sea posible en su historia web. Tenga como objetivo, videos que duren menos de 15 segundos; si tiene un video más largo, considere dividirlo en fragmentos más pequeños.

Las historias web se consumen en modo retrato, así que recuerde lo siguiente:

• Filmar videos en dispositivos móviles de gama alta, cuando sea posible.
• Grabar a 480p.
• Filmar en al menos 24 fotogramas por segundo.

Asegúrese de que su contenido sea accesible. Cambie el tamaño de los videos para hacer espacio para el texto y los subtítulos en la parte inferior. No todos los lectores podrán, o desearán, escuchar el contenido del video.

Imágenes

Utilice la pantalla completa y imágenes de retrato con buena resolución (828 x 1,792).

Evite fotos paisajísticas recortadas.

Cómo recortar con cuidado

Concéntrese en lo importante. Recorte los elementos innecesarios o que provocan distracciones, y asegúrese de que el tema fundamental de la foto esté enfocado y completo. Recuerde que la parte superior e inferior pueden quedar recortadas en algunos dispositivos, así que realice las pruebas adecuadas.

QUÉ HACER	QUÉ NO HACER
Esta imagen está recortada para ajustarse con el contenido de la página y es compatible con la idea principal.	Con este recorte no está claro dónde debería enfocarse el lector, y qué idea tiene pensado que transmita la imagen.

Texto

Asegúrese de que el texto sea legible. El tamaño mínimo que debe utilizar en la fuente es el 24, pero debe ser lo más grande y legible posible. Haga contraste entre el color del texto y el fondo o la imagen en la página de la historia. No incluya imágenes o videos que solo contengan texto.

QUÉ HACER	QUÉ NO HACER
Un gran contraste hace que las palabras sean fáciles de ver.	Con poco contraste sus palabras e imágenes pueden mezclarse, lo cual hace que las palabras sean difíciles de leer y la historia será más difícil de seguir.
Resaltar el texto hará que las palabras se distingan y ayudará a que sus lectores se concentren en su historia.	Utilizar un texto de color claro sobre una imagen animada hará que las palabras sean difíciles de leer.

Bocadillos de palabras

El texto debe venir en bocadillos, no en comidas. Procure que el texto se mantenga por debajo de 200 caracteres por página, o sea menor a eso.

Encárguese de los detalles como una lista de ingredientes, haga que estén disponibles, pero solo si los usuarios lo solicitan. Incluya el contenido del texto en formato largo en un archivo adjunto dentro de la página. Los archivos adjuntos de la página le notifican a los usuarios que hay texto más para leer. Si están interesados, pueden desplazarse hacia arriba en su dispositivo.

Puede que sea inevitable una página con contenido de texto más largo que una oración. Intente que estos no ocupen más del 10% del total de páginas en la historia.

QUÉ HACER	QUÉ NO HACER
Trate de almacenar solo el texto esencial. La variación en el tamaño del tipo y estilo para separar los bloques de texto puede aumentar la capacidad de escaneo.	Un gran muro de texto como este puede ser difícil de leer y puede disuadir la participación con su historia.

Animaciones

Las animaciones son apetitosas cuando se hacen con un propósito, como agregar movimiento a las imágenes estáticas. Puede animar imágenes y activos con efectos de vuelo, rotación o transiciones audiovisuales.

QUÉ HACER	QUÉ NO HACER
Las imágenes en movimiento de este ejemplo le ayudan a respaldar la idea principal y agregan un elemento dinámico a la página.	Esta página estática es útil, pero puede estar perdiendo la oportunidad de ser más atractiva para los lectores.

Pero utilícelas con moderación, ya que las animaciones pueden volverse desagradables si se usan en exceso. Evite agregar demasiado de un solo sabor y sazonar en contadas ocasiones con animaciones.

La sincronización es esencial

Rápidamente las páginas deben entrar por completo en su ubicación, una animación no debe impedir que el usuario presione la siguiente página, ¡pero no tan rápido! Es importante ofrecer la combinación correcta de estilo y duración. Por ejemplo, las animaciones simples deberían tardar menos de 500 milisegundos, pero el barrido de una imagen de fondo debería durar más.

Considere la posibilidad de ser creativo con las imágenes en movimiento. Haga animaciones de varios objetos en una secuencia, en vez de hacer que se muevan juntos en un solo efecto. Cada elemento puede tener diferentes efectos y duración, los cuales funcionan para formar una animación homogénea.

Combinaciones perfectas

Combine su estilo de animación con la estética de su historia. Utilice la biblioteca de animaciones de la historia web que esté disponible para encontrar un estilo y una intensidad que funcione para usted sin que se desvíe la atención del contenido.

Más deseos

Permita que los usuarios exploren su tema más a fondo al insertar contenido de terceros, adjuntando información adicional y al establecer enlaces hacia nuevas ubicaciones.

Inserciones estratégicas

Las inserciones proporcionan una dimensión adicional cuando resultan pertinentes y se presentan de forma agradable. Incluya el contenido pertinente junto a la inserción para que sea una pieza incorporada en la historia. Es posible que tenga que habilitar la comunicación para realizar su inserción.

QUÉ HACER	QUÉ NO HACER
La inserción en esta página se integra bien con el resto del diseño. Los gráficos del título, fecha y fondo ayudan a mejorar la imagen.	Poner la inserción de forma aislada en la página hace que esta parezca sin terminar, y no se integra bien con la historia completa.

Cómo adjuntar contenido adicional

Mantenga su historia web optimizada al colocar contenido relacionado mediante archivos adjuntos. De esta manera, los lectores pueden profundizar si quieren aprender más sobre su historia. Los lectores navegan por una historia con mayor facilidad cuando se adjunta contenido adicional en las páginas relevantes.

Los archivos adjuntos funcionan bien con bloques de texto largo, o si su historia contiene un video destacado, puede incluir el video completo como un archivo adjunto.

Enlaces hacia nuevas ubicaciones

Puede agregar enlaces en cualquier sitio de la página de una historia web. Al presionar un enlace, hará que aparecerá la información sobre las herramientas. Esto le informa al usuario hacia dónde se dirige el enlace, y le permite confirmar la acción antes de salir de la historia.

QUÉ HACER	QUÉ NO HACER
Los enlaces de esta página claramente están etiquetados y rodeados de contenido relacionado. No interfieren con la navegación dentro de la historia.	Los enlaces de esta página bloquean completamente la navegación. Los lectores no podrán dirigirse fácilmente a la página anterior o a la siguiente.

Piense de manera estratégica en el tamaño, la ubicación y la frecuencia de aparición de sus enlaces. Si hay demasiados elementos que se puedan tocar, la navegación sería complicada y los lectores se frustrarían.

Cómo codificar o crear historias web

Las historias web pueden codificarse manualmente desde cero o desarrollarse mediante herramientas de creación.

Si codifica manualmente una historia web, la creará desde cero usando el Framework AMP. Siga las instrucciones para Crear su primera historia web desde un inicio. Después de que haya creado su historia web, asegúrese de que sea un AMP válido. Puede probar la suya en el validador de AMP. Para obtener más información, lea la información técnica sobre las historias web.

• Written by @CrystalOnScript