Optimizando páginas de error: Creando oportunidades de nuestros errores

Después de leer el artículo en inglés, «Optimizing Error Pages: Creating Opportunities Out Of Mistakes» en Smashing Magazine me he animado a replicarlo en castellano pues creo que es muy interesante y útil. Espero que os guste mi adaptación en español y nos huyáis hacía la versión en inglés.

A través de la presente entrada trataremos de aplicar diferentes técnicas para diseñadores web y profesionales de los interfaces para mejorar sus páginas de error (404) y al mismo tiempo aprovechar estos errores para mejorar la experiencia del sitio web y como nos relacionamos con los visitantes que llegan a este error. Como C. S. Lewis dijo, «Los fallos son las entradas escritas en el camino hacia el éxito» (original en inglés «Failures are finger posts on the road to achievement»). Un diseñador web debería tener esto en su corazón. Ahora vamos a centrarnos en las páginas de mantenimiento y error, ambas debería ser monitorizadas con el fin de optimizar su usabilidad. Espero que los siguientes ejemplos y como usar google analytics, diseño defensivo para optimizar la experiencia de estas páginas os resulte útil. No encontré muchos ejemplo en castellano, pero la siguiente captura (por mejorar) es el error 404 de acens.


Imagen de la nueva web de acens cloud.

Lo primero sería ver las páginas de error y como las presentamos hoy, así podemos ver como optimizarlas de forma eficiente:

  • Consigue tu página de error 404 hacer participar al visitante y que sigua navegando, o por el contrario hace que este se fustre y abandone el sitio.
  • ¿Cómo disminuir el número de usuarios que acaban en un error 404?
  • ¿Cómo monitorizar el tráfico tus páginas de error 4040 de forma eficiente?

Más cosas, ver las técnicas que podemos usar para mejorar los ratios de conversión mientras nuestra página web se encuentra bajo un mantenimiento. Algunas preguntas que deberías hacerte son:

  • ¿Cómo definir cual es el tiempo que debemos estar bajo un mantenimiento?
  • ¿Como hacer para involucrar a los usuarios mientras que estamos bajo un mantenimiento?

Optimizar Páginas 404

El tema de como mejorar los mensajes en las páginas de error se describe de forma muy interesante en el libro  (solo en inglés) Defensive Design for the Web, que ha sido escrito por el equipo de 37signals. Este incluye como 40 temas de «como prevenir errores y rescatar clientes cuando ocurre una caida o error». En concreto el tema 16 trata sobre como mostrar «Páginas de No Encontrado» («Page Not Found«) personalizadas. Es realmente importante decir porque nuestra página no ha sido encontrada, explicar el porque de que una página no se ha podido localizar y ofrecer sugerencias a la derecha de la pantalla. Que tu página web ayude cuando esto sucede y que no tengamos un visitante que abandona posiblemente para siempre por la caída o error.

Alguna cosas que puedes añadir en tu página de error:

  1. El nombre y logotipo de tu empresa,
  2. Una explicación de porque el visitante está viendo esta página,
  3. Una lista de errores comunes que deben explicar el problema,
  4. Enlaces para ir a la página de inicio y/u otras páginas que puedan ser relevantes,
  5. Un motor de búsquedas donde los clientes/visitantes puedan encontrar información y
  6. Un enlace a un email (o formulario) donde los visitantes puedan reportar el error, páginas pérdidas u otros errores.

Te invito a conocer algunos ejemplos de páginas de error en los siguientes enlaces de Smashing Magazine (parte 1parte 2 y parte 3) y estos otros ejemplos: Hongkiat, the proper spark, instantShift, skyje, mashable, dzineblogsix revisions e inspired mag. Seguro que sirven para despertar tu inspiración para crear tu propia página 404. Esto es importante pero lo es mucho más entender y analizar, siempre me preguntaré, «¿Es suficientemente buena? ¿Cómo puedo hacerlo mucho mejor?. En esta entrada podrás conocer algunas de esas técnicas que podrás usar para monitorizar y optimizar tus páginas 404.

Y si no tienes página personalizada de error 404, puedes consultar esta explciación de como configurar tu propia página 404 (en inglés: How to Setup a 404 Page).

Monitorizar Tráfico de Página de error 404

¿Con que frecuencia comprueba el tráfico de tus páginas de error 404? Posiblemente nunca compruebas los errores 404. La importancia de controlar los errores 404 constantemente nunca debes dejarla de lado. Por ejemplo, si un sitio web está enlazado desde un blog y el enlace está roto, esto provocará una experiencia negativa para los usuarios (que además han visto sus esperanzas en el enlace rotas) y además afectará a los buscadores/posicionamiento (el contenido no será seguido ni indexado para un contenido correcto). Seguro que usas Google Analytics y por eso nos centramos en dar trucos para esta herramienta de analítica.

Nota: Las capturas de pantalla se han realizado sobre la nueva versión de Google Analytics, que actualmente está en beta, igual ves cambios.

Crear una Alerta en Google Analytics

Puedes en la configuración del sitio en Analytics (en perfiles, Alertas) según ves en la captura configurar una alerta que te informe cada día por correo electrónico de si superamos las 30 páginas vistas con error 404. Si tienes alertas todos los días recuerda que tienes un problema por solucionar, aumenta el número de páginas vistas o días si no quieres recibir todos los días mientras lo solucionas.


Esta imagen te muestra como puede crear una alerta personalizada para seguir páginas vistas 404.

Seguimiento de tu página como un objetivo

También puedes configurar un objetivo para seguir la página 404 (siempre que tengas objetivos libres en tu analytics). Esto lo que hará es registrar estos objetivos para realizar un seguimiento diario (y por horas) de acceso a la página de errores. Es otra forma sencilla de localizar de donde viene el tráfico de enlaces rotos. La siguiente captura te muestra como hacerlo:


Esta imagen muestra como crear un objetivo para seguir páginas vistas de error 404 en tus informes.

Añade tu informe de contenido 404 en el escritorio de analytics

Todos los informes en Google Analytics pueden ser añadidos al escritorio. Es recomendable añadir el objetivo de la página 404 al mismo, para que puedas observar de forma directa la evolución. No mostramos captura sobre esto, pero es realmente sencillo.

Comprobar los informes resumen de navegación

Esto te puede ayudar a entender que hacen los visitantes después de pasar por la página de error 404, como es de importante optimizarlas:


Esta imagen en inglés muestra un ejemplo de navegación por el reporte de error 404 en Analytics.

Seguimiento de búsquedas internas

Si no tienes un cuadro de búsquedas en tu página 404, deberías pensar en añadirlo de forma seria. Conocer las búsquedas que se realizan en la página de error nos pueden ayudar a entender que suele buscar nuestros visitantes cuando algo falla y así definir que enlaces serían los más interesantes para colocar a la derecha en un menú de la página de error. Las siguientes métricas deberían estar activas para analizar si quieres usar este truco:

  • Total de Búsquedas Únicas
    El número de veces que una persona inicia una búsqueda desde la página de error 404. Las búsquedas duplicadas de una visita única son excluidas.
  • Visitas de páginas de resultados/búsqueda
    El valor medio de tiempo que los visitantes ven la página de resultados después de ejecutar la búsqueda.
  • % de abandonos de búsqueda
    El porcentaje de búsquedas que después de los resultados abandonan la página y se van de tu sitio.
  • % de refinamientos de búsqueda
    El porcentaje de búsquedas que resultan de otra búsqueda (por ejemplo. una nueva búsqueda utilizando otra palabra clave).
  • Tiempo posterior a la búsqueda
    La media de tiempo que ha invertido el visitante en nuestro sitio desde la búsqueda.
  • Media de páginas por búsqueda
    La media de páginas que el visitante ha visto desde la búsqueda.

Reducir tus errores (Corregir los enlaces rotos)

Monitorizar tus página de error 404 es muy importante, para al menos poder corregir los errores una vez detectado. Solucionar estos problemas reducirá el número de personas que llegan a tu página 404 y por tanto la experiencia del usuario mejorará. Ahora te damos unos consejos para encontrar y corregir enlaces rotos internos y externos.

Comprobar el Informe Resumen de Navegación

Esta ayuda debe entenderse como los visitantes que llega a tu sitio web, y que llegan a páginas internas que contienen enlaces rotos internos. Recuerda ver que porcentaje de visitantes vienen desde páginas internas y externas; las fuentes internas podrás listarlas fácilmente en Analytics o también sacarlas a través de Google Webmasters.

Comprobar fuentes de tráfico que aportar visitas a la página 404

Esto es sencillo de ver, son los sitios web que contienen enlaces rotos hacia nuestro sitio. Aquí tienes un ejemplo en inglés de este error. Localiza los enlaces rotos y crea redirecciones 301 hacia páginas correspondientes. Si no te gustan las redirecciones 301, también puedes volver a crear la página con contenido.


Esta imagen muestra fuentes de tráfico que envian visitas a la página de error 404.

Herramientas SEO para ayudar con errores 404

Puedes hacer uso de herramientas SEO como Raven Tools, Advanced Link Manager, SeoMoz, … y otras tantas para encontrar y monitorizar también tus errores con mucha más información.

Trucos de usabilidad para mejorar los 404

Los trucos de usabilidad para páginas de error no son muy diferentes a los de usabilidad en general para buenas prácticas con tu sitio web. Algunos de estos elementos te ayudarán a incrementar los ratios de conversión de tus páginas de error; en este contexto debería considerar tener el mejor ratio de conversión Click (CTR), para asegurar que cumplimos el objetivo buscado de no perder la atención de los visitantes. Puntos a tener en cuenta:

  1. Simplifica y busca el Foco
    Es muy importante utilizar imágenes y diseños origionales. Es crítico tener un foco claro para esta página; si el usuario percibe que lo estamos liando no cumpliremos nuestro objetivo. Hay que definir de forma clara y sencilla las acciones de nuestros 404.
  2. Conoce a tus Visitantes
    Muchas páginas de error 404 son usadas para sacar alguna que otra risa, utilizadas con humor y bromas de los técnicos. Es importante pensar que son nuestros visitantes/clientes y no podemos permitir que malinterpreten nuestro humor, es nuestra responsabilidad hacerlo bien.
  3. Deja que tus visitantes decidad
    Creo que es muy interesante que sean los usuarios los que decidan que es lo mejor para nuestra página de error, a través de todo el análisis y seguimiento que le hacemos. Quizás sea un buen sitio donde realizar pruebas A/B. (Revisar el artículo de técnicas avanzadas de test A/B escrito en inglés por Paras Chopra).

Optimizar páginas de mantenimiento

Es muy importante como diseñamos y desarrollamos una estrategia para nuestra página de mantenimiento. Hay que definir cuando se realizará esta tarea, que sea a horas de menor tráfico e impacto para nuestros visitantes, a la vez que sea el menor tiempo posible. Podéis leer una entrada previa en Smashing Magazine, donde Cameron Chapman nos da una buena lista que podemos usar para comprobar que tener en cuenta cuando diseñamos páginas de mantenimiento efectivas:

  1. Haz tus páginas de mantenimiento sencillas y útiles.
  2. Piensa que será un problema/incoveniente para tus visitantes/usuarios/clientes.
  3. No te agusties usa el humor.
  4. Manten la imagen de tu página de mantenimiento con un diseño igual que tu sitio habitual.
  5. Haz saber a tus visitantes cuando estarás de vuelta.
  6. Proporciona recomendaciones de contenidos.
  7. Invita a tus visitantes a volver cuando el sitio esté activo otra vez.
  8. Informa a tus visitantes acerca de los avances del mantenimiento.

Elegir el tiempo de mantenimiento adecuado

Una práctiva muy habitual es realizar los mantenimiento en horarios de menos tráfico, a una hora y día concreto de la semana, para minimizar el impacto. Es importante que tengas en cuenta que tu sitio web está optimizado para el rendimiento y no para el tráfico. Busca el momento de menos visitas, pero especialmente busca el momento de menos conversiones para realizarlo.

Incrementa tu relación con los visitantes usando las páginas de mantenimiento

¿Es posible mejorar e incrementar tu relación con los visitantes mientras que estás en modo de mantenimiento?. Si es posible. Mientras que estás en mantenimiento tienes una oportunidad única para promover canales adicionales de marketing: tiendas offline, páginas de facebook, canales de Youtube, cuentas de twitter, newsletter, etc. El siguiente ejemplo de página de mantenimiento de Online Behavior es un claro ejemplo de marketing online:


Esta imagen muestra una página de mantenimiento de ejemplo.

Notas finales

Los errores siempre puede aparecer y tenemos que estar preparados para controlarlos y corregirlos. Debemos tener de la mano a nuestros visitantes para evitar que se lleven una mala imagen, podemos hacer que se sientan bien, cómodos y que sigan navegando con nosotros. El nivel de paciencia online suele ser bajo, hay que intentar evitar que los visitantes nos abandonen.

Tienes algo que decirnos, esperamos tus comentarios y trucos.