Una página 404 épica probablemente no va a ganar ningún premio para tu negocio. Lo entiendo.
Pero demuestra que te preocupas por tus clientes.
Una gran página 404 puede ser una forma inteligente de mostrar la personalidad de tu marca.
¿Pero vale la pena invertir en una página 404 elegante?
Puede serlo.
Porque cuando los usuarios aterrizan en su página 404, no están encontrando lo que necesitaban.
El uso de enlaces, gráficos inteligentes y un texto ingenioso puede hacer que se olviden de que (tal vez) lo has estropeado y que vuelvan a la pista.
A la luz de la importancia de las páginas 404, lo que sigue es una lista de 37 de los mejores ejemplos de páginas 404 que puede encontrar en línea.
Antes de sumergirse en los ejemplos, tomemos un momento para revisar los fundamentos de una página 404.
¿Qué es una página 404?
Una página 404 es una página de destino que indica a los espectadores de su sitio que la página solicitada no está disponible o, en algunos casos, no existe.
Un error 404 le dice a los usuarios que no se puede acceder a la página – y puede ser un problema importante.
Cuando los usuarios no pueden acceder a una página, no pueden encontrar la información que necesitan.
También le dice a Google que su sitio ofrece una mala experiencia al cliente, lo que puede resultar en menos tráfico y una clasificación más baja.
En principio, los visitantes del sitio nunca aterrizarían en una página 404, pero la realidad es que ocurren de vez en cuando – incluso de sitios bien mantenidos.
¿Por qué podría un visitante aterrizar en una página 404?
¿Por qué podría un usuario obtener un error 404?
Hay varias razones, que incluyen:
- El servidor está caído.
- La página se movió y no fue redirigida.
- La página nunca existió.
- El usuario escribió mal la URL.
- La URL está rota.
Básicamente, si un usuario intenta visitar una página que no puede ser encontrada, será enviado a su página 404.
¿Para qué sirve hacer una página 404 que destaque?
Una página de error 404 visualmente atractiva y fácil de usar muestra a los clientes que usted se preocupa por su experiencia y está interesado en mantenerlos en su sitio web.
Cuando se hace bien, una buena página 404 ayuda a los usuarios a perdonarte el error (incluso si fue su propia culpa al escribir mal la URL) y los mantiene en tu sitio.
Una gran página 404 puede hacer sonreír a los usuarios y -lo más importante- ayudarles a encontrar lo que están buscando.
Revisamos docenas de páginas 404 para encontrar las mejores que muestran la creatividad y la personalidad de las marcas.
Aquí tienes 37 de los mejores ejemplos de páginas 404 bien hechas.
Disney
Disney lo hace con su página 404 destacando a uno de los personajes más conocidos por su destrucción: Wreck-it Ralph.
Ambos personajes son apropiados para la página 404, pero fíjate en lo que hay justo al lado de KnowsMore: una pequeña barra de búsqueda.
Hay otra en la parte superior de la página, pero esta está justo en el centro, donde los usuarios la verán. Esta barra de búsqueda mantiene a los usuarios en la página ayudándoles a encontrar lo que están buscando.
Drift
Drift es una herramienta de marketing de conversión y una plataforma de ventas que ofrece herramientas para el chat en vivo, las páginas de aterrizaje y más.
El copy de su página 404 se mantiene dentro de la marca mencionando «conversaciones», pero también trabaja para mantener a la gente en el sitio web de Drift ofreciendo enlaces a su página de inicio, su blog y enlaces a algunas de sus piezas de contenido más populares.
En la esquina superior derecha, también ofrecen un camino hacia la conversión proporcionando el botón Get Drift Free.
Help Scout
Help Scout proporciona a las empresas herramientas para el software de mesa de ayuda, el soporte al cliente basado en el correo electrónico y las bases de conocimiento en línea.
Terapia de apartamentos
Terapia de apartamentos, un sitio de decoración del hogar, lo mantiene ligero bromeando con que el washi tape (una popular cinta de papel utilizada en decoración y scrapbooking) no puede arreglar el enlace roto.
Justo debajo del pliegue, enlazan a varios posts populares para mantener a los visitantes del sitio comprometidos.
También incluyeron una barra de búsqueda y su barra de navegación principal para que los usuarios puedan seguir explorando el sitio.
CoSchedule
CoSchedule, una herramienta de programación de marketing, mantiene la sencillez con un simpático GIF de un perro y enlaces a su página principal y a su blog.
Este ejemplo demuestra que no hace falta gastar mucho dinero para crear una página 404 atractiva.
Es simple, pero cumple su función.
Sprout Social
Sprout Social, la herramienta de marketing de medios sociales, realmente quiere mantener a sus clientes en la página.
Empiezan con una reacción irónica al aterrizaje en la página equivocada – pero también impulsan una demostración gratuita, mientras que el enlace de la página de inicio pasa a un segundo plano.
Entonces, su chatbot aparece para averiguar lo que necesitas.
En la parte inferior, promocionan su boletín de noticias.
Esencialmente, han convertido su página 404 en una página de aterrizaje.
ConvertKit
¿Quién no ama a los perros?
ConvertKit lo mantiene ligero ofreciendo una foto del perro de un miembro del equipo y un enlace a su página de inicio.
Pero, también lo mantienen profesional proporcionando su chat en línea y un CTA para registrarse gratis.
Screaming Frog
Screaming Frog es una herramienta diseñada para ayudar a los propietarios de sitios a encontrar y arreglar los enlaces rotos – y reconocen la ironía de tener una página 404 burlándose un poco de ellos mismos, luego ofreciendo enlaces a su blog, página de contacto y servicios.
A diferencia de las otras páginas 404 de la lista, ésta no es estática.
Las moscas se mueven por la página, los peces flotan y los nenúfares giran.
Es un pequeño cambio, pero hace que la página parezca bien pensada.
Moz
Moz mantiene la sencillez con un cameo de Roger Mozbat, la mascota de la marca.
Su presencia está en la marca y es una forma fácil de hacer sonreír a la mayoría de la gente.
Moz también te ofrece una barra de búsqueda del sitio para que puedas encontrar lo que buscas.
BigCommerce
La página 404 de BigCommerce ofrece muchas de las mismas características que hemos visto antes: el CTA para contactar, solicitar una demostración, y una forma fácil de explorar el sitio.
Pero lo que destaca es la imagen del espacio exterior bien diseñada, que hace que la página se sienta pensada y planificada.
Hay muchas posibilidades de que los usuarios que aterricen en tu página 404 se sientan molestos – un gráfico creativo ayuda a que se sienta que tienes las cosas claras y que esto fue sólo un pequeño paso en falso.
Kinsta
Kinsta, una empresa de alojamiento de WordPress en la nube, adopta un enfoque similar al de BigCommerce al ofrecer una imagen bien diseñada en su página 404.
Mantienen su navegación superior y la barra de búsqueda, para que los usuarios puedan encontrar fácilmente otra información.
También utilizan un pop up para sugerir contenido cerrado, lo que probablemente ayuda a impulsar los suscriptores de correo electrónico.
Lego
Lego mantiene la ligereza utilizando una gran imagen de un hombre Lego junto con la ocurrencia «¡Lo sentimos, no podemos encontrar esa página! No te preocupes, aunque todo sigue siendo ASOMBROSO!», que es una referencia a una canción de la Lego Película.
También ofrecen un enlace a su tienda para mantener a los usuarios en el sitio.
Slack
La página 404 de Slack es increíble.
La imagen de arriba realmente se desplaza para mostrarte un bosque con mariposas voladoras, cerdos, flores y gallinas.
También se pone en blanco y negro si vas a otra pestaña, lo que, por desgracia, hace que sea difícil obtener una captura de pantalla de la maravilla.
Dirígete a su sitio para ver la experiencia completa.
Mailchimp
La herramienta de correo electrónico Mailchimp lo mantiene simple – pero inteligente – con su página 404 animada de un animal buscando en un agujero para, presumiblemente, la página que se ha perdido.
Es inteligente y muestra que su página 404 no es una idea de última hora.
okta
Okta es una empresa de gestión de acceso basada en la nube con sede en San Francisco.
Su página 404 es bastante sencilla, pero me gusta mucho que ofrezcan las razones por las que el enlace puede estar roto, lo que ayuda a los usuarios a entender qué puede haber salido mal.
Suiza
Swiss Airlines no ofrece ninguna información adicional, aparte de un enlace a su página de inicio y a la barra de navegación, pero la imagen de su página 404 es realmente bonita.
Las nubes se mueven a medida que guías el cursor sobre la página, envolviéndote en nubes.
Es una característica interesante que me mantuvo en su página 404 más tiempo del que me gustaría admitir.
Wizarding World
Como muchos fans de Harry Potter sabrán, Harry se pierde la primera vez que intenta utilizar el polvo Floo, una sustancia brillante que permite a los magos viajar transportándolos a casi cualquier otra casa o edificio con chimenea.
La imagen de arriba muestra la escena en la que Harry sale de la chimenea a la que se transportó accidentalmente cubierto de hollín – lo que la convierte en la imagen perfecta para una página 404.
Suroeste
Aquí hay otra página 404 que me hizo sonreír – en primer lugar, utilizan una referencia a «Star Wars», que lo mantiene ligero.
La página también cuenta con un bastón de mando en movimiento utilizado por los mariscales de aviación que dirigen los aviones en la pista.
Al lado de la imagen, Southwest ofrece enlaces rápidos para ayudar a los usuarios a encontrar lo que necesitan.
Es funcional pero sigue destacando.
9GAG
9GAG, la plataforma online de memes y vídeos, utiliza un GIF totalmente on-brand para su página 404 y ofrece un único enlace que dirige a los usuarios a su app.
Es simple, pero mantenerse dentro de la marca asegura que los visitantes del sitio sepan que están en el sitio correcto, a pesar de no encontrar la página que estaban buscando.
Flywheel
Flywheel, una empresa de alojamiento gestionado de WordPress, ofrece esta peculiar página 404 para que la gente sepa que se ha equivocado de página.
El lenguaje desenfadado refleja su sensación de marca en general, y el enlace a la página principal ayuda a los usuarios a encontrar su camino.
Al igual que otras marcas, también ofrecen una función de chat para ayudar aún más a los usuarios que se han perdido.
Dan Woodger
Dan Woodger, artista e ilustrador, presenta su propio trabajo en su página 404. Su brillante y alegre hamburguesa está como en casa.
Nota que no menciona que es una página 404 ni da ninguna otra información, aparte de un enlace a su obra.
Este ejemplo viene a demostrar que una gran página no tiene por qué ser complicada.
Destilada
Muchas marcas llaman a su página 404. Se imaginan que no mucha gente verá la página, así que qué importa.
Pero mostrar el estilo de tu marca en una página (aparentemente) insignificante tiene mucho peso.
Si te preocupas por tu página 404, es muy probable que también te preocupes por tus clientes y consumidores.
Distilled utiliza una imagen tipo infografía para explicar qué es la página y qué puede haber fallado.
Taco Bell
Taco Bell es conocido por ser un poco irreverente. Su página 404 no es una excepción.
La página presenta un taco bailando que se resbala y derrama sus rellenos, para luego volver a meterlos en su cáscara.
Es un recordatorio divertido de que saben que algo salió mal.
La página también incluye un enlace a la página principal del sitio, el menú, las ubicaciones y dónde comprar tarjetas de regalo y mercancía.
Magnt
Magnt ofrece un constructor fácil de usar y herramientas para crear sitios, y se enorgullecen de ser mejores que el constructor de sitios web estándar basado en plantillas.
Su página 404 destaca la creatividad de la marca con un ingenioso diagrama de Venn que explora las razones por las que podrías haber acabado en la página: «Hemos roto algo» o «No puedes escribir.»
Dribble
Dribble, un mercado creativo para profesionales del diseño, ofrece una página 404 totalmente funcional.
Los usuarios pueden arrastrar el punto debajo de la fuente 404 para explorar diseñadores dentro de una gama de colores específica.
Al hacer clic en los bloques que componen los números 404 se accede a esos diseñadores específicos.
También ofrecen una barra de búsqueda, para los usuarios que prefieren buscar en el sitio de esa manera.
Overflow
La personalidad de Overflow se sitúa en el centro de su página 404.
Su tono conversacional y su humor invitan y dan la bienvenida, lo que conecta conmigo para querer volver a hacer clic en su página de inicio.
Y, la misma voz y tono se transmiten en la página de inicio.
Wendy’s
A estas alturas, probablemente te hayas reído con uno o dos tweets de Wendy’s.
Pero, al igual que Overflow, Wendy’s continúa con el mismo flujo de voz y tono a su sitio web, incluso a su página 404.
Crearon un videojuego interactivo para los usuarios similar al Pac-Man en su página 404.
¡A ver si consigues llegar con Wendy hasta el final!
Red Bull
La página 404 de Red Bull es el sueño de cualquier profesional del SEO o del marketing.
Está repleta de enlaces a artículos y listas de reproducción de vídeos.
Red Bull incluso rota la lista de reproducción de vídeos de su evento más reciente.
Puedes ver en la imagen de arriba que Red Bull utilizó su evento de surf Red Bull Big Wave 2020 como fuente de inspiración.
Ventisca
Blizzard Entertainment, los creadores de World of Warcraft, también conocido como WOW si eres un friki como yo. 🤓
Blizzard cuenta con uno de sus personajes más conocidos, un Murloc, para ayudar a rescatarte de su página 404.
Marvel
Marvel utiliza sus diferentes personajes de cómic como el Capitán América, Deadpool, etc. en una página 404 rotativa.
Una pequeña pista: sigue dándole a actualizar. Cada tres refrescos, Marvel servirá un visual diferente.
Patagonia
Patagonia cuelga diez en su página 404 jugando con su casual, y tropical.
Primero, enganchan al espectador con un vídeo en bucle, pero luego guían al usuario más abajo en la página hasta los enlaces a sus categorías de compra más populares.
Backcountry
Backcountry, un popular sitio web de equipamiento para actividades al aire libre en el que a menudo paso demasiado tiempo comprando cosas que nunca compraré, muestra su lado divertido mientras conecta con su audiencia.
Nintendo
Nintendo carece de algunas piezas visualmente atractivas, lo cual me sorprendió, ya sabes, siendo Nintendo y todo eso.
Pero, lo importante es que Nintendo añade enlaces de recursos para el usuario.
Obliga a los usuarios a quedarse en la web y no rebotar a las SERPs.
Zillow
Zillow ofrece un beneficio interactivo en forma de GIF a los buscadores de su casa.
Zillow utiliza los datos de sus clientes para ver que sus usuarios son amantes de las mascotas.
Y, para mantener a esos amantes de las mascotas comprometidos, han creado este gato interactivo que añade una pequeña risa al final cuando rompe algo en el salón.
¡Como amante de los animales, puedo conectar con esto!
H&Bloque R
H&R Block es otra mirada a una notan atractiva página 404, pero ofrece más información a los usuarios para que sigan haciendo clic y participando en su sitio web.
World of Warcraft
El equipo de World of Warcraft reconoce la destreza de su público con unas cuantas bromas sobre CDNs y above the fold.
Playstation
Playstation da un bonito reconocimiento a uno de sus juegos más recientes en su página 404.
Además, ofrecen opciones para volver a la página de inicio u obtener consejos del centro de ayuda.
Resumen
En un mundo perfecto, nadie vería nunca sus páginas 404.
Se quedarían escondidas muy lejos, como la bolsa de Reese’s thins que tengo escondida en el armario. Ya sabes, para momentos drásticos.
Pero en el mundo real, las cosas pasan.
Los enlaces se truncan, los dedos gordos se resbalan, y a veces simplemente te olvidas de redirigir una página. Empieza usando una herramienta como Screaming Frog para encontrar esos enlaces rotos.
Recuerda, lleva tiempo crear unas páginas 404 creativas que atraigan a los usuarios en lugar de ahuyentarlos.