11/12/2014

La importancia de una buena página de error 404

La importancia de una buena página de error 404

Ya nos referimos a HTTP, el protocolo basado en un esquema de pedidos y respuestas que nos permite navegar por la Web. Cuando solicitamos acceder a un recurso web (que puede ser una página, una imagen, un video o cualquier otro archivo alojado en un servidor), recibimos un código de estado, consistente en un número de tres dígitos, que nos informa el resultado de la petición. En particular, los códigos cuyo primer dígito es 4 nos indican que pudimos conectarnos con el servidor, pero hubo un error por parte del cliente. El más conocido es el código 404, Not Found, que obtenemos cuando solicitamos un recurso inexistente en el servidor. Puede ser que queramos acceder a un archivo eliminado recientemente, o que hayamos seguido un enlace roto, o bien que hayamos escrito mal la dirección, pero no existe ningún recurso con el nombre especificado.

¿Qué pasaría si un usuario, navegando por nuestro sitio web, se encontrara con este problema? Debería encontrar algo más que un mensaje estándar en letras negras sobre fondo blanco. Al igual que las páginas correspondientes a otros códigos, la del 404 en particular puede y debe personalizarse, por las siguientes razones:

  • Es recomendable para un buen posicionamiento en buscadores.
  • Los mensajes «por defecto» de los browsers suelen emplear una jerga técnica que puede ser problemática para la mayoría de los usuarios.
  • Una página de 404 generada por el browser no contendrá un menú de links que le permitan al usuario seguir navegando por nuestro sitio web. Por eso, lo más probable es que termine abandonándolo.

Muchos desarrolladores olvidan personalizar esta página o bien la descuidan, limitándose a incluir un mensaje de dos líneas que respeta el diseño del resto del sitio. Consideran, erróneamente, que una página de error es menos importante que la de contacto o la de novedades. Sin embargo, existen muchísimos ejemplos de páginas de 404 elaboradas con creatividad y dedicación. ¿Qué características presentan?

  • Mantienen el diseño de las demás páginas, haciendo que el usuario se sienta «contenido» dentro del sitio y no crea que se perdió.
  • Explican detalladamente el problema, por qué pudo haber pasado y cómo resolverlo. Incluso pueden pedirle al usuario que reporte un enlace roto si esa fue la causa.
  • No le echan la culpa del error al usuario, o lo hacen pero en un tono humorístico.

Si bien es útil tener una buena página de error 404, es ideal revisar el sitio periódicamente en busca de enlaces rotos, para reducir la posibilidad de que el usuario aterrice en ella.

0

angularjs Aplicaciones en Facebook aplicaciones mobile behavioral targeting Botones Call-to-action breadcrumbs breadcrumbs web búsqueda de personal búsqueda facetada Call-to-action buttons Client-side cliente-destacado cms a medida coding comercio electrónico content marketing CSS3 PIE cuanto debe pesar un sitio data-driven web design Datos estructurados Defacement Denegación de servicio Desarrollar una aplicación web desventajas de PhoneGap diseñar newsletters diseño web diseño web argentina diseño web esqueuomórfico Diseño web responsive Diseño web responsivo diseño web santa fe diseño web Smart TV diseño web televisores DOM desde PHP enlaces rotos filtros de búsqueda flash flat web design formularios sitio web fragmentos enriquecidos función de autocompletar futuro de la realidad aumentada html HTML5 html5shiv inbound marketing Initializr interfaces Web para televisores javascript jobs jQuery Mobile Mapbox maquetado html/css maquetador web masonry layout menú de navegación menú desplegable Metodologías ágiles Modernizr MVC Navegación por teclado oferta laboral OpenStreetMap paginas de Facebook Paper js Paper js framework personas Phishing plan de QA Polyfills polymer portfolio-destacados portfolio-inicio programacion de CMS Programadores WordPress página de contacto página de error 404 que es Backbone.js Realidad aumentada Resultados instantáneos server-side skeuomorphic design sliders y usabilidad soporte Internet Explorer Storytelling Underscores usabilidad usabilidad buscadores user-centered design ux velocidad de carga web Vendor prefixes ventajas jQuery Mobile Ventanas integradas versiones antiguas de Internet Explorer WAI-ARIA web components web imprimible Web Semántica WordPress para ecommerce