ūüĎČ 11 mejores 404 p√°ginas para convertir a los visitantes perdidos en clientes fieles

Qué hay de nuevo en WordPress 3.6

¿Y si le dijéramos que su página de error 404 podría aumentar sus conversiones y aumentar sus ingresos?

Mente soplada, ¿verdad? Sabemos que suena demasiado bueno para ser cierto, pero con un poco de esfuerzo creando el diseño adecuado de la página 404 y la optimización adecuada, puede convertir a los visitantes perdidos en clientes leales.

En este post vamos a cubrir 11 de las mejores 404 páginas que hemos visto y por qué trabajan.

Primero, sin embargo, hablemos brevemente sobre 404 páginas y por qué son importantes.

Qué es una página de error 404 y por qué debería importar

Los enlaces van mal con el tiempo. Sucede en cada sitio. Los productos se eliminan, el contenido se elimina o hay cambios en la estructura del enlace permanente.

Cuando un visitante hace clic en un enlace a una página eliminada o movida, verá su página de error 404. También lo verán si escriben mal una URL, o si hacen clic en un enlace roto o truncado.

¿Tu página 404 refleja tu marca?

Si no, eres absolutamente Perdiendo visitantes que pueden cancelarlo y nunca regresar.

Esta…

No es un buen aspecto para nadie.

Tomarse el tiempo para optimizar el texto de su página 404 y crear un diseño en la marca realmente puede reducir su tasa de rebote y aumentar sus conversiones.

Según lo prometido, aquí hay 11 ejemplos de página de error 404 para inspirarte y ayudarte a crear tu propia página 404 personalizada.

1. Lego: error amistoso de "página no encontrada"

Por qué funciona:

No solo la página 404 de Lego está 100% en la marca, sino que también es divertida y fácil de entender. No hay palabras técnicas ni referencias a un "error 404" que algunas personas no entienden.

Todo lo que su visitante necesita saber es que no obtuvieron la página que querían. Realmente no les importa el por qué; solo quieren una solución.

Cómo hacerlo:

Para empezar, reemplace el material con lenguaje humano normal. En lugar del mensaje 404 predeterminado, use frases que la gente comprenda:

  • "Página no encontrada."
  • "Lo siento, no podemos encontrar la página que estabas buscando".
  • "Oops! Algo está roto."
  • "Oh querido, este enlace no está funcionando".

2. Email Center UK – Ejemplo de página interactiva 404

Por qué funciona:

Email Center UK usa una página de 404 de dos partes que le quita toda la culpa al visitante, brindando al visitante una forma divertida de resolver sus frustraciones 404.

Cómo hacerlo:

No culpe al visitante por el error. En lugar, ser apologético.

Si está explicando qué salió mal, no use absolutos. En su lugar, use palabras y frases como "might have" o "possible". Es menos probable que esta frase haga que el visitante sienta que el error es su culpa.

También podría hacer lo que hizo el Correo Electrónico del Reino Unido y dejar que el usuario "dispare" a uno de los desarrolladores.

Pobre Luke, de hecho.

3. List25 – Mejor página de 404

Por qué funciona:

Esta página de error 404 de List25 es brillante y demás, marca duele.

La mejor práctica del diseño de la experiencia del usuario es explicar qué fue mal al enviar un mensaje de error. List25 ofrece 25 explicaciones. Naturalmente.

Tienen una barra de búsqueda en la parte superior para que los visitantes no tengan que desplazarse a lo largo de la lista, pero estamos bastante seguros de que la mayoría de los visitantes de List25 lo harán de todos modos.

Cómo hacerlo:

La mayoría de los sitios no van a tener una lista de explicaciones como List25, pero definitivamente tome un minuto para explicar qué salió mal.

Aquí hay una lista de posibles razones para el error 404:

  • Mistyped URL
  • Copiar y pegar el error
  • Enlace roto
  • Enlace truncado
  • Contenido movido
  • Contenido eliminado

Si quieres incluir algunos divertidos que funcionen con tu marca, ¡hazlo!

4. Brett Terpstra: diseño de página simple 404

Por qué funciona:

Una de las cosas más molestas acerca de las páginas de error 404 es que puede señalar un callejón sin salida. Si la página no está bien diseñada, es posible que no tenga dónde ir a continuación.

La página 404 de Brett Terpstra proporciona una lista de publicaciones que contienen palabras clave relacionadas con el enlace al que intentabas acceder. Las publicaciones están vinculadas por lo que es fácil y rápido navegar hacia ellas.

La página no es llamativa, pero es extremadamente útil.

Cómo hacerlo:

Puede usar la API de búsqueda personalizada de Google para obtener las mejores coincidencias de su sitio web para aparecer en su página 404. Esta da a los visitantes una solución inmediata a su problema de página perdida.

Esto requiere acceder a la consola para desarrolladores de Google y no es para cardíacos. Hay un gran tutorial en el sitio de Smashing Magazine que puede ayudarlo a comenzar.

5. Steve Madden – Página 404 con productos

Por qué funciona:

La página 404 de Steve Madden ofrece opciones para los visitantes perdidos. El cuadro de búsqueda es una gran adición a cualquier error 404 y ofrece algunas maneras diferentes de obtener ayuda para que los visitantes sepan que están escuchando.

También incluyen enlaces a otros productos populares para distraer a los visitantes de lo que podría ser una experiencia muy frustrante. Disimulado y efectivo.

Cómo hacerlo:

Ayude a sus visitantes perdidos con su texto y diseño del mensaje de error 404. Incluir algunas de las ideas a continuación puede alentar a los visitantes a continuar navegando y buscando, extendiendo su tiempo en su sitio.

Algunas cosas para incluir en su diseño de página 404:

  • Menú de navegación
  • Un enlace a la página de inicio
  • Un enlace a su mapa del sitio
  • Una barra de búsqueda
  • Enlaces a publicaciones populares
  • Enlaces a productos populares

6. 9gag – Texto de la página 404 con llamado a la acción

Por qué funciona:

La página 404 de 9gag tiene un propósito: hacer que descargues su aplicación. Ni siquiera pretenden querer nada más.

¡Agregar una página completa del popular gp de Pulp Fiction Travolta es un toque divertido!

Cómo hacerlo:

La simplicidad es la clave. Sí, acabamos de hablar de ofrecer formas de mantener a sus visitantes navegando, pero no los abrume con demasiadas opciones.

Idealmente, debe apegarse a una sola llamada a la acción, tal vez dos.No querrás que los visitantes sufran una ola de parálisis indecisa y huyan de tu sitio aterrorizados.

La hierba siempre es más verde, ¿verdad? Si les da demasiadas opciones a sus visitantes, pueden terminar lamentando su elección y resintiéndose por ello.

7. Ruta – Diseño de página 404 super simple

Por qué funciona:

La página 404 de Path es simple y directa. No quieren tener enlaces rotos y páginas faltantes, por lo que le dan a los visitantes la opción de contactar al soporte de Path para informarlo.

Tenga en cuenta que Path también incluye un pie de página de navegación en caso de que el visitante no quiera informar el problema y prefiera buscar. Esto devuelve el poder al visitante y ayuda a aliviar su frustración.

Cómo hacerlo:

El objetivo aquí es dar a los visitantes la oportunidad de informar el problema.

Puedes hacer esto de varias maneras. Puedes mantenerlo simple como Path e incluir la opción para contactar con soporte. Otra opción es usar un formulario de comentarios.

8. IMDB – Página divertida y en la marca 404

Por qué funciona:

¿Recuerdas esa terrible página de error 404 predeterminada desde el comienzo de este artículo? No hay familiaridad para que su visitante se sienta cómodo. IMDB elimina eso al mostrar a los visitantes una cita de una película en su página 404.

La marca es sutil aquí. No hay carteles de películas, ni trailers que compitan por la atención del visitante. IMDB simplemente ofrece una cita de película, un enlace a la página principal del sitio y un enlace a la película citada.

Cómo hacerlo:

Al diseñar su página de error 404, asegúrese de mantener la familiaridad con la marca.

En lugar de desorientar a los usuarios, será reconfortante para ellos experimentar la misma marca que han llegado a conocer.

9. Everipedia – Ejemplo de texto del mensaje de error 404

Por qué funciona:

La página 404 de Everipedia es todo lo que sus visitantes esperarían de una enciclopedia en línea. Esto les recuerda a los visitantes por qué les encanta el sitio y siguen volviendo.

Cómo hacerlo:

El orador y vendedor de TED Renny Gleeson dijo sobre la página de error 404,

Un simple error puede decirme lo que no eres. O recuérdame por qué te amo.

Use su página 404 para recuerda a los visitantes por qué te quieren. ¿Cuál es su propuesta de valor única? ¿Qué te diferencia de tus competidores?

10. Heyzap: la mejor página interactiva de 404

Por qué funciona:

¿A quién no le gusta jugar juegos?

La página 404 de Heyzap agrega un elemento interactivo que mantendrá a los visitantes entretenidos e involucrados en el sitio por un tiempo. ¡Tal vez incluso el tiempo suficiente para superar su frustración de aterrizar en una página de error en primer lugar!

Cómo hacerlo:

No, no tienes que desarrollar un juego, pero considera agregando un elemento interactivo a su página.

Agregar un elemento interactivo le da a los visitantes de su sitio algo que hacer en su página de error 404. Esto aumenta el tiempo en la página y reduce los porcentajes de rebote, ambos importantes para mantener su sitio web en los resultados de búsqueda de Google.

11. OptinMonster – Ejemplo de página 404 con imán de plomo

Por qué funciona:

La página 404 de OptinMonster incluye un imán de plomo súper genial. Además, ofrecer una descarga sobre cómo convertir el abandono de visitantes de una página de error es bastante genio.

No queremos que las personas consideren perdido su tiempo en nuestros sitios. Proporcionar una lección de mercadotecnia de la página 404 aún obtiene gran información en manos de nuestros visitantes.

Sí, somos un poco parciales, pero también somos buenos en esto. Esto se convierte como gangbusters.

Cómo hacerlo:

Ofrezca su propio imán de plomo por agregando un MonsterLink a tu página de error 404.

MonsterLinks es una de las geniales características de OptinMonster que te permite convertir cualquier enlace, botón o imagen en un proceso de 2 pasos.

El optin de 2 pasos requiere que el usuario inicie el proceso haciendo clic en el enlace primero antes de que aparezca la forma optin.

Así es como se ve el proceso de 2 pasos:

¡Se ha demostrado que este tipo de opciones aumenta las conversiones hasta en un 785%! Haga clic aquí para comenzar con OptinMonster y luego siga este tutorial para agregar MonsterLink a su página de error 404.

Sección de bonificación: salida-intención

Una de las cosas que no hemos visto mucho es el uso de la tecnología exit-intent en 404 páginas. El propósito de la salida ayuda a reducir la tasa de rebote, es fácil de configurar y funciona para aumentar las conversiones en todo momento.

El intento de salida funciona al detectar cuándo un usuario está a punto de abandonar su página de error 404 y luego presentar una ventana emergente en ese momento. Esto evita que pierdas más del 70% de los visitantes que abandonan tu sitio y nunca regresan.

Aquí hay un ejemplo de una ventana emergente que aparece cuando el usuario está a punto de rebotar desde una página de error 404.

(Esto fue creado usando el tema Canvas de OptinMonster).

Esta ventana emergente es un sitio de bienvenida para el usuario porque les ayuda a encontrar lo que necesitan. Y funciona de maravilla para usted como propietario del sitio web porque les brinda una última oportunidad de seguir navegando por su sitio.

También puede usar exit-intent para proporcionar un cupón o código de descuento a los visitantes cuando salen de su página 404.

¡Ahí tienes! 11 de las mejores 404 páginas que hemos encontrado y muchísimos consejos que puede usar para aumentar las conversiones y aumentar los ingresos.

¿Busca más consejos para aumentar los ingresos? Consulte la Guía de optimización de eCommerce definitiva: ¡13 pasos para aumentar al instante los ingresos!

Síganos en Facebook y Twitter para obtener más consejos y guías excelentes de OptinMonster.

Ver el vídeo: WordPress Que hay de nuevo?

Like this post? Please share to your friends:
Deja un comentario

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: