¿Aún no tienes página de error 404? 7 ejemplos a seguir (y por qué son tan eficaces)

Se estima que el 73.72% de las personas que llegan a una página de error 404 abandonarán el sitio web sin regresar. Esta elevada tasa de rebote se explica por la falta de optimización de estas páginas, cuya importancia se subestima en la actualidad. Sin embargo, una parte de los cibernavegantes tropezarán con ellas, y por ello se recomienda optimizar su diseño para mejorar la UX y evitar los molestos rebotes.

¿Qué significa el error 404 de página no encontrada? Esta es una consulta habitual entre los usuarios de Google, que son redireccionados a dichas páginas cuando aquello que buscan (un producto, un artículo informativo, etc.) no se encuentra en el servidor. Por lo general, es un error motivado por dos factores causantes:

Sea cual sea la razón, los errores 404 implican una obstáculo en la experiencia de los usuarios, que se ve obligado a volver sobre sus pasos o realizar una nueva búsqueda. Sin embargo, estas páginas no pueden eliminarse. La única solución pasa por optimizarlas con rótulos, enlaces, imágenes y funciones que impulsen a los usuarios a seguir navegando, en lugar de abandonar el site. Heinz, Steve Madden, GameSpot, Disney y otras reconocidas empresas presumen de tener algunos de los mejores ejemplos de páginas de error 404. ¿Todavía no los conoces?

Estos ejemplos de páginas 404 exitosas te inspirarán

Heinz

Esta prestigiosa empresa agroalimentaria cuenta uno de las mejores páginas de error 404, adaptada a su producto estrella (el Ketchup Heinz) de forma creativa y eficaz. En el título puede leerse “Parece que la página que buscas está vacía”, acompañada de una imagen de un recipiente de kétchup tumbado y vacío. Este mensaje, que además de informar hace un nada sutil juego de palabras, genera una reacción positiva en los usuarios a través del humor.

¿Por qué es tan efectiva? Esta página de error incorpora, entre el titular, el subtítulo y la imagen, un menú dividido en tres columnas, cada una de las cuales corresponde a una sección de la empresa. De esta forma, Heinz ofrece a sus clientes una ayuda básica para continuar la navegación. Es posible que la página que buscaban perteneciera a su sección de recetas; cuando el usuario la identifique en el menú, podrá clicarle y continuar su experiencia de navegación.

Steve Madden

Este ecommerce de moda de alcance internacional dispone de una cuidada página de error 404. Al igual que Heinz y otras empresas, se sirve del humor para evitar una respuesta negativa por parte de los usuarios (un rebote), pero utilizando su mismo tono y vocabulario: “Esto es embarazoso” dice un titular de gran puntaje en color negro, acompañado de la foto de una modelo con expresión amistosa.

¿Por qué es tan efectiva? Ayuda a los visitantes gracias a la presencia de una práctica caja de búsqueda, acompañada de un menú de navegación y un carrusel de fichas de productos relacionados en la parte inferior. Asimismo, conserva el menú principal en la parte superior, que orientará a los clientes familiarizados con su diseño web. De ahí que sea uno de los ejemplos de páginas de error 404 más representativos.

Disney

Como no podía ser de otra manera, Mickey Mouse es el protagonista de la página de error 404 de los estudios animados de Walt Disney. En su página oficial, aparece este personaje en su error 404, junto al título “Oh, no podría encontrar eso. Inténtalo de nuevo” sobre un fondo blanco. Esta ausencia de elementos logra un objetivo fundamental: focalizar la atención de los usuarios en el mensaje de aviso y la caja de búsqueda que parece debajo y que les ayudará a encontrar lo que estaban buscando.

¿Por qué es tan efectiva? Además de generar simpatía en el lector a través de su mascota simbólica, Disney logra reducir las tasas de rebote y optimizar la navegabilidad manteniendo el menú principal (en la parte superior) y en el menú del footer, siendo ambos complementarios. De esta forma, sus visitantes tienen múltiples opciones donde elegir.

Umbro

Otro de los ejemplos de páginas de error 404 más inspiradores lo encontramos en Umbro. Este fabricante británico de calzado y ropa deportiva hace un guiño al deporte rey en su error 404 con un diseño tan ingenioso como eficaz: el mensaje de error 404 aparece en distintos títulos (al menos 3), siendo el último el más singular, pues señala “Formación 4-0-4”, con la imagen de la clásica pizarra de fútbol con 8 jugadores además del portero.

¿Por qué es tan efectiva? Nuevamente encontramos el uso del humor para prevenir reacciones negativas por parte del usuario y prolongar su permanencia en el sitio web. No obstante, está lejos de ser perfecta. Se echan en falta un mayor número de opciones y al menos una caja de búsqueda, pues en su lugar sólo encontramos el botón ‘Umbro Home’ para proseguir la navegación.

Lego

En la página con error 404 de Lego reconocemos los mismos pros y contras de la página homóloga de Umbro: una imagen simpática relacionada con sus productos, que muestra a una de sus minifiguras desconectando dos enchufes (reforzando así la idea de que la navegación ha sido interrumpida). Se complementa con el mensaje “Lo siento, no podemos encontrar la página. Tal vez el enlace haya caducado o haya sido movido”.

¿Por qué es tan efectiva? La efectividad de esta página de error 404 reside en su simplicidad. La palabra ‘error 404’ no aparece por ningún lado. ¿Por qué? Porque el cliente objetivo de Lego no está familiarizado con este lenguaje; en su lugar, muestra una imagen y el texto mencionado, con información más que suficiente. Sin embargo, se echan en falta un mayor número de enlaces y al menos una caja de búsqueda.

GameSpot

La nostalgia por los 16 bits está presente en una de las páginas de error 404 divertidas preferidas por los entusiastas de los videojuegos. GameSpot, revista de reviews y noticias especializada en este sector, dispone de una página de error 404 muy llamativa, diseñada en estilo retro y con minijuego similar a los títulos de los años 80-90.

¿Por qué es tan efectiva? GameSpot acierta al utilizar imágenes y funciones que provocan sensaciones positivas en los usuarios, que disponen de dos opciones: hacer click en el botón de regresar a la home o hacer lo propio en el ‘usar nuestro buscador’. No obstante, incluir menús adicionales hubiera sido un acierto a la hora de reducir las tasas de rebote.

Pixar

La creatividad de Pixar está presente también en su página de error 404. La protagonista de ‘Del Revés’ (2017), Tristeza, es la cara visible de este página, que muestra el rótulo “Ay, no llores. Es sólo un error 404”. Con este tono tan simpático y cómic, Pixar comunica a sus usuarios el problema que han experimentado navegando.

¿Por qué es tan efectiva? Para los fans de la filmografía de Pixar, encontrarse con uno de sus personajes más entrañables es una grata sorpresa, dentro de la molestia que suponen las páginas de error 404. Para continuar con la navegación, los usuarios disponen del menú principal que permanece visible, aunque hubiera sido una gran idea incluir una caja de búsqueda junto al aviso de error 404.

Cómo debería ser la página de error 404 de tu negocio digital

Después de repasar algunos de los ejemplos de páginas 404 más llamativos, merece la pena preguntarse por los ‘ingredientes’ que componen la receta de una gran página de error 404. En primer lugar, la efectividad de su diseño reside en su capacidad para adaptar el mensaje de aviso a sus clientes objetivos. Lego y Pixar utilizan la sencillez, con palabras accesibles frente a vocabulario más técnico de GameSpot. Por otra parte, Heinz y Umbro comparten el humor, siempre efectivo en estas páginas, para informar a sus usuarios.

Adaptar las imágenes y objetos del diseño a los productos/servicios de la marca es importante, pues crea una asociación natural y lógica en la mente de los usuarios. Heinz con su botella, Lego con sus minifiguras o Disney con Mickey Mouse muestran imágenes apropiadas a su espacio web, que disminuyen el impacto negativo de los navegantes que tropiezan con errores 404.

En cualquier caso, no crear una página de error 404 personalizada es uno de los mayores errores de usabilidad web que puedes cometer, ya que tendrá un impacto negativo en métricas fundamentales.