Una página error 404 o “página no encontrada” es una pausa en la navegación del usuario cuando busca en internet. La reacción más normal es que cierre la pestaña del navegador o vuelva atrás. Y es en ese preciso momento, cuando tienes unos segundos para enganchar su atención, con un mensaje divertido, original y que se quede en tu página. Porque lo siguiente que podría pasar será devolverlo de nuevo al buscador de Google, en el que encontrará a tus competidores. Es aquí donde entra el marketing visual a actuar.
Si tienes un blog o sitio web, debes saber que esta página puede ser modificada y hacer un diseño atractivo y que enganche para aprovecharla como una oportunidad. ¿Conoces la definición que Google aplica a la página error 404? «El famoso buscador descubre contenido siguiendo enlaces que dirigen de una página a otra. Por lo general, se muestra un error de página no encontrada (normalmente, un código de error HTTP 404) cuando Googlebot intenta visitar una página que no existe, ya sea porque se ha eliminado o se le ha cambiado el nombre sin redireccionar la URL antigua a la nueva página o porque el enlace está mal escrito».
Causas frecuentes que producen el ERROR 404
- Enlace roto.
- Páginas que caducan o se mueven.
- Al escribir o copiar mal una URL.
- Por lo general, los errores 404 no afectan a la clasificación de los sitios en Google y se pueden ignorar tranquilamente.
- Puedes evitar el error de escritura ofreciendo URL sencillas y consistentes, es recomendable además utilizar siempre minúsculas en los nombres de fichero y tampoco usar espacios.
Una página error 404 debe ser útil y creativa
Cuando un usuario aterriza en una página error 404, tenemos que ser creativos, no queremos perder a nuestro visitante. Hazte algunas preguntas y sácale partido a esta página ¿Qué estará buscando? ¿Cómo podemos ayudarlo? ¿Qué podemos ofrecerle? ¿Cómo podemos cautivarlo? Si optimizas bien los recursos de esta página 404 puede convertirse en una aliada para potenciar la interacción de tus visitantes.
- Si tienes un blog, puedes mostrar un listado de tus entradas más populares para llamar la atención del usuario.
- En páginas corporativas, una buena estrategia sería incluir un enlace directo hacia la página de contacto para permanecer siempre accesible.
- Otra alternativa es mostrar la barra de búsquedas.
Ejemplos de páginas error 404 creativas y estratégicas.
Te muestro una recopilación que derrocha creatividad e ingenio, son 12 páginas de error 404; de ellas puedes obtener inspiración e ideas, y por supuesto te sacarán más de una sonrisa.
Hasbro Saluda al desarticulado señor patata, un texto te informa de tu situación y porque has llegado hasta allí, te invita a salir con un enlace a su página principal. 
Mailchimp En este caso es su famoso chimpancé inmovilizado en hielo, el que nos recibe, mientras soporta una suave y sutil escarcha de hielo sobre él. Te indican que en la parte superior existe un menú de navegación o bien que puedes utilizar su buscador.
Angry Birds Un diseño alegre y divertido para una página 404 de los famosos dibujos animados. La gamificiación está presente como no podía dejar de ser, si clicas en el botón central te lleva a un divertido recorrido por el espacio y los juegos de Angry Birds.
Creashit Lo primero que provoca es una sonrisa, y eso es bueno, es minimalista y directa. Observa que es otra página error 404 que ofrece un sidebar con buscador y enlaces a sus contenidos.
Alexarts Emplea el color azul y para que el usuario pierda cualquier sensación de peligro, induciéndolo a la calma, mientras le indica la salida con un enlace a su home.
Biltmore Han logrado no modificar la página de la Home, para mantener al usuario siempre en contacto con los servicios. Una vez que llegas a la página 404, cambia un banner y te enseña otro copywriting. Una idea para copiar.
Wearespry Qué elemento puede ser más tierno como una mascota, un perro que se ve perdido para connotar lo que es una página no encontrada con un enlace a la HOME.
Duoh Emplea su página de error para informar que su sitio web ha sido rediseñado y utilizan un enlace para llevar al usuario a su home.
Dusty Miller Un ejemplo muy original. Aprovecha el error para hacer branding personal, siendo su fotografía la principal protagonista, generando curiosidad e interés por el creativo.
Launchlist El sentido del humor es un recurso muy explotado en el diseño del error 404, en este caso te avisan de los agujeros negros en Internet que se traga sitios web.
Jumpingjackrabbit Un ejemplo de gamificación para una página 404 ¡Peligro! ¡Zona de monstruos! Tal vez debas seguir sus consejos y salir de este sitio a través del link, también puedes ser un valiente y descargarte su fondo de pantalla.
Hotdot Un error 404 con suaves efectos de desplazamiento, incorpora enlaces a sus principales redes sociales, todo vale para no perder a un usuario.
¿Conoces el proyecto NotFound? Miles de niños desaparecen cada año en toda Europa. El proyecto NotFound, es una idea de solidaridad brutal para quien quiere apoyar en esta causa. Utiliza las páginas de error para publicar imágenes de niños desaparecidos, solo tendrás que instalarte su aplicación, cada página no encontrada de tu sitio, se convertirá en una imagen de un niño desaparecido. Me parece una iniciativa maravillosa.
Página error 404, una aliada para la captación de usuarios
Los errores 404 fuera de control pueden hacerte perder visitas, ya que la mayoría de ellas no dudará en abandonar tu sitio para buscar una mejor alternativa. Si quieres emplear el marketing visual en esta página tan olvidada, ten presente en la realización del diseño estos tres puntos:
- Informa al usuario por qué está allí, reconoce que su causa es un error en la navegación, del cual podríamos ser los responsables.
- Capta su atención la creatividad no tiene límites, pero no olvides que sigue siendo una página relacionada con tu web, es importante que sea corporativa, tener visible el logo y usar los colores de tu marca, no queremos que el usuario se sienta más perdido de lo que está.
- Condúcelos a tu sitio web, utiliza enlaces a tu página de inicio, contacto o blog. Deja accesible el menú de navegación o una sidebar donde puedan seguir navegando. Puedes incorporar un buscador beneficiándote con los resultados, puesto que buscará la información dentro de tu web.
Saca partido a tu “página no encontrada”, los usuarios que lleguen a ella no se sentirán perdidos y será una gran aliada para encontrar nuevos usuario para tu web o blog, un buen diseño puede aumentar tu engagement.
¿Y tú? ¿Cómo gestionas los errores 404?
17 comentarios
Qué estupendos ejemplos Susana, me han encantado. Voy a tomar nota para personalizar la mía con algunos de los ejemplos que das introduciendo una imagen.
Dan mucho juego y la verdad que nunca está de más estar preparados para quien encuentre una página 404 en tu web.
Saludos RamGon. 🙂
Con un poco de imaginación, se puede convertir la página 404 en una página de ‘aterrizaje forzoso’. 🙂
Si es un aterrizaje forzoso, es nuestro deber hacerlo más Visualmente divertido. 🙂
Gracias por estos artículos, Susana =)
Me alegro mucho de que te gusten Marcos. Saludos. 🙂
Hice hace tiempo un post sobre este tema con bastantes ejemplos, por si e quieres echar un ojo. http://palabrasapunto.blogspot.com.es/2013/09/un-error-404-de-cine.html Enhorabuena por el tuyo 😉
Hola Miriam, tienes muy buenos ejemplos. Si es que la creatividad de algunas página te impulsan a no quedarte atrás y a hacer la tuya 😉
Saludos y gracias por compartir.
Convertir una tasa de rebote del 100% asegurada en un visitante sonriente no tiene precio.
Grandes consejos Susana, me lo apunto en las tareas pendientes.
Muy buen enfoque Jesús, de eso se trata, sacar una sonrisa y por qué no atrapar a tu visita.
Saludos Jesús. 🙂
Creo que la frase que mejor resume el post es la que señalas para tuitear «Optimiza bien los recursos de una página 404 y conviértela en una aliada». Muy buenos ejemplos. Gracias.
Un saludo
Alfonso
Hola Alfonso,
Siento no responderte antes, llevo una temporada muy mala de trabajo y eso no me deja tiempo para más cosas.
Me gustó la frase para representar el post y atraer visitas desde Twitter 😉
Gracias a ti por pasarte. Saludos.
Hola Susana!
¡Estupendos ejemplos de páginas 404 creativas, sobre todo desde el punto de vista estético!
Aunque para mi uno de los mejores usos (depende de tipo de web y sus objetivos) puede ser utilizarla para captar suscriptores 😉
Esta es una captura de algunas páginas que controlo y que tienen formularios donde suscribirse a una lista de correo: http://nnja.info/1KOtTup
Si pinchas para aumentar la imagen verás que las que consiguen un mayor porcentaje de suscriptores son precisamente dos páginas 404… una de ellas con un 55% 🙂
Hola Javier,
Me encanta tu blog y tu ejemplo. No he entendido muy bien a qué te refieres con «si pinchas para aumentar la imagen…» ¿Cuales son esas páginas a las que haces mención?
Un saludo. 🙂
Hola Susana! hace poco me encontré con tu artículo y decidí que nosotros también teníamos que mejorar nuestra página 404. Así que tras encargarlo al diseñador ha quedado bastante chula (o eso nos parece)… qué te parece?
Es esta: http://personalizatumovil.es/zxczxc
Gracias por el artículo, muy chulo.
Hola Joaquín, está muy bien, enhorabuena! 😉
La verdad es que nunca había pensado en editar esa página, es una excelente idea. Voy a ponerme con ello y seguro que cuando alguien acabe en esa página por error, no será tan traumático. Felicidades por el post.
Saludos cordiales