Diseño Web & UX

Los mejores ejemplos de páginas 404

    Por David Tomas, publicado en 11 septiembre 2019

    Admitámoslo: los profesionales del marketing también cometemos errores, y uno de los más habituales es dejarnos enlaces rotos en nuestra web.

    Pero si errar es humano, diseñar una página 404 eficaz e ingeniosa es divino. Si logras dar en la diana, conseguirás arrancar una sonrisa al visitante de tu web en lugar de provocarle frustración y enfado. ¿Necesitas inspiración para conseguirlo? ¡Aquí tienes 20 ejemplos!

    * ¿Quieres saber cómo mejorar tus landing pages para captar leads o  incrementar tus ventas? Clica aquí y descárgatenuestro curso gratuito.

    Los mejores ejemplos de páginas 404

     

    20 grandes ejemplos de error 404

     

    1) Gymbox

    Esta empresa de clases de fitness londinense tiene una gran personalidad de marca, y su página 404 lo demuestra.

    Además del consabido aviso de error, en ella encontrarás a un señor en top y minipantalones cortos meneando la cadera de forma sugerente. Seguro que vuelves corriendo a la página de inicio... o no.

    gymboo

     

    2) Drift

    Aquí el humor se usa para relativizar la frustración del usuario. Sí, a nadie le gusta caer en una página de error 404, pero siempre podría ser peor. Por ejemplo, podrías estar perdido en el mar, como en el vídeo de DJ Khaled que se muestra en la página. Visto así, ¿a que no es para tanto?

    Drift-404-Page

     

    3) 20th Century Fox

    Un ejemplo de página 404 que aprovecha el acervo cultural de la marca. Cada vez que aterrizas en ella, se muestra una referencia distinta a una de las películas de esta productora: Eduardo Manostijeras, El jovencito Frankestein, Napoleon Dynamite... Si tienes curiosidad, puedes probarla en este enlace.

    20th-Century-Fox-404-Page-error

     

    4) Magnt

    Magnt te muestra un diagrama de Venn con dos opciones posibles: o no sabes escribir, o son ellos los que se han equivocado y han roto algo. En cualquier caso, eres bienvenido a volver a la página de inicio.

    Magnt-404-page-error

     

    5) Hootsuite

    Un ejemplo de error 404 que refuerza el branding de la marca. Aquí, la adorable mascota de Hootsuite (una lechuza) aparece en el cartel de "Se busca". Además, te explican posibles razones del error y te invitan a volver a la página de inicio, lo que siempre refuerza la usabilidad.

    Hootsuite-404-error-page

     

    6) eharmony

    ¿Quién ha dicho que no puedas usar la página 404 para vender tu producto? En este ejemplo, el sitio de citas eharmony te hace saber que la página que estás buscando no está disponible... pero hay miles de solteros que sí lo están.

    Eharmoney-404-error-page

     

    7) BluePath

    BluePath es una empresa de consultoría estratégica que es capaz de tomarse a sí misma con humor. Por ejemplo, aquí te muestra lo perdido que estás con un diagrama. Para rematar, es un diagrama de la tasa de criminalidad en Atlanta desde enero de 2015... porque es un crimen que todavía no les hayas contratado.

    Blue-path-404-error-page

     

    8) Email Center UK

    Un ejemplo de página 404 sin compasión. Alguien se ha equivocado con la página que estabas buscando, así que puedes elegir de forma interactiva a qué miembro del equipo despedir. O si tienes el día comprensivo, siempre puedes volver a la página de inicio.

    Email-Center-UK-404-page

    9) IMDB

    "A donde vamos, no necesitamos carreteras" (ni, aparentemente, páginas web). IMDB deleita a sus fans con una referencia pop nostálgica en su página 404.

    IMDB-404-page

     

    10) Marvel

    Ya sabes que el humor es cuestión de gustos, así que si quieres ser ingenioso, no hay nada mejor que adaptarse a tu nicho. Marvel lo tiene claro con esta referencia a El Vigilante y la Viuda Negra. Y por si fuera poco, el ojo te sigue al mover el cursor.

    Marvel-404-Page

     

    11) Steve Madden

    Esta marca de zapatos combina dos grandes ideas en su página de error 404: una disculpa cargada de humor y un poco de product placement. Porque ya que estás aquí, lo mismo te animas a comprar...

    steve-madden-404-page

    12) MailChimp

    Un ejemplo de error 404 muy sencillo, pero en el que la ilustración aporta el componente de humor necesario: estás tan perdido como un burro con la cabeza en un agujero, así que es mejor que vuelvas a la página de inicio.

    MailChimp-404-error

     

    13) Taco Bell

    Taco Bell es una marca que no duda a la hora de emplear el humor. Por ejemplo, aquí explica amablemente a los usuarios que lo que están buscando no existe... A no ser que estuvieran buscando un vídeo animado de un taco.

    Taco-Bell-404-page

     

    14) Pixar

    Otra marca que aprovecha sus propias referencias culturales, en este caso, el personaje de Tristeza de la película "Del revés". A lo mejor lo que buscas se ha perdido en la memoria a largo plazo...

    Pixar-404-page-error

     

    15) TSheets

    De nuevo, una referencia a la icónica "Regreso al futuro". Aquí te dice que has conducido tu Delorean demasiado rápido y has causado una discontinuidad en el espacio-tiempo... ¡Ups!

    Tsheet-404-error-page

     

    16) Buzzfeed

    Mira, ¡un gatito que mueve la cola! Al igual que Hootsuite, Buzzfeed aprovecha una mascota adorable para reforzar su branding y te invita a volver a la página de inicio para encontrar lo que estabas buscando.

    Buzzfeed-404-page-error

     

    17) Lego

    Lego es una de las marcas más reconocidas y queridas a nivel mundial, y es fácil ver por qué. Aquí consigue transmitir el mensaje y capturar su esencia con una ilustración divertida y llena de color. Su objetivo: hacerte sonreír y que olvides tu frustración.

    Lego-404-error-page

     

    18) 9GAG

    9GAG es una biblioteca inmensa de vídeos, imágenes y GIFs de todo el mundo, así que no podía dejar de incluir alguna referencia cultural. Su página de error 404 muestra a Vincent de Pulp Fiction buscando a Mia con el texto "Aquí no hay nada". Pero en lugar de dejar al usuario abandonado, le ofrece la opción de descargar la aplicación.

    9gag-404

     

    19) AirBnB

    La página 404 de AirBnB combina dos recursos sencillos pero efectivos: una ilustración divertida y una serie de enlaces a las principales categorías de la página, para que puedas volver a ubicarte rápidamente.

    airbnb-404-page

     

    20) Dropbox

    En 2018, Dropbox renovó su identidad de marca y rediseñó su web de arriba a abajo... incluyendo la página de error 404.

    Drop-Box-404-Page

    ¡Toma nota y no te olvides de la tuya! Al igual que en el caso de AirBnB, este ejemplo combina una ilustración humorística con enlaces a los principales sitios de la página.

    Curso: Landing Pages y cómo aumentar tu conversión alead

     

    David Tomas

    CEO y cofundador de Cyberclick. Cuenta con más de 20 años de experiencia en el mundo online. Es ingeniero y cursó un programa de Entrepreneurship en MIT, Massachusetts Institute of Technology. En 2012 fue nombrado uno de los 20 emprendedores más influyentes en España, menores de 40 años, según la Global Entrepreneurship Week 2012 e IESE. Autor de "La empresa más feliz del mundo" y "Diario de un Millennial".