30 Abr 2009

Personaliza tu página de error 404

Autor: admin | Guardado en: Artículos, Diseño, Trucos, Tutoriales

Aprovecho que he cambiado la página de error 404 de TeoAtienza, para explicar cómo y porqué debemos personalizar nuestra página de error. Pero, antes de empezar, deberás saber qué es una página de error 404:

El mensaje de error 404 o No encontrado es un código de error HTTP que indica que el Navegador web ha sido capaz de comunicarse con el servidor, pero no existe el fichero que ha sido pedido.  Éste error no debe ser confundido con “servidor web no encontrado” o errores similares en los que se indica que no se ha podido realizar la conexión con el servidor.

Quizás algunos de tus lectores (mejor si no lo hacen, señal de que todo va bien)  verán este mensaje; no cuesta nada alegrarles un poco la vista (normalmente, las páginas de error predefinidas suelen ser muy aburridas) y echarles una mano cuando están perdidos. ¿Cómo hacerlo?

Antes de empezar a diseñar tu página de error 404 personalizada, tendrás que tener claro algunos puntos (que puedes ver, más ampliados, en SIGT):

  • Adiós al 404. Bien, seguramente nosotros sabemos que significa Error 404, pero algún lector puede no saberlo. Háblale en cristiano, simplemente infórmale de que no se ha encontrado lo que buscaba.
  • Ofrécele otras alternativas. Ya ha llegado al error, ¿y ahora qué? Digo yo que no lo dejarás ahí, sin más. Sugiérele que revise la palabra-palabras que intentaba buscar, en busca de algún error, que lo intente con otra palabra similar, o que le eche un vistazo a tus entradas relacionadas.
  • Diseño limpio y amigable. El lector que llegue a tu página de error, ya tendrá bastante con ver que no encuentra lo que busca. No le atosigues con muchos enlaces o con un mapa del sitio.

Si ya tienes claro qué debe y qué no debe tener tu página de error, empieza a diseñarla (al final del post tendrás algunos enlaces de grandes páginas de error 404 que te pueden servir de inspiración). Se original.

Ok, ya la has diseñado, ¿y ahora? Tendrás que subir la imagen (guárdala preferiblemente en formato PNG, para conservar una buena resolución) a tu servidor FTP, entrar a tu Panel de Administración, y llamarla :) Para editar la página de error de tu blog, una vez dentro del Panel de Administración, tendrás que ir a Diseño>Editor de Temas y seleccionar tu plantilla. Hecho esto selecciona el archivo 404.php y añade esto:

<div id=”left-inside”>

<align=”left”><img src=”http://www.teoatienza.com/wp-content/themes/blakmagik/images/error404.png” alt=”Una pena, no lo hemos encontrado!” style=”border:0″ /></align=”left”>

</div>

Acuérdate de poner tu dirección (no la mía xD) y la ruta dónde has guardado tu imagen (sólo tendrás que cambiarlo por el nombre de tu plantilla y, en caso de ser diferente, el nombre y la extensión con el que has guardado la imagen).

Siguiendo estos pasos, ya tendrías que haber personalizado tu página de error 404. Aquí puedes ver la mía. Si quieres, puedes descargártela en formato PSD para modificarla a tu gusto.

Por último, te dejo algunos enlaces interesantes para inspirarte a la hora de diseñar tus páginas de error:

Tags: ,

3 Comentarios en “Personaliza tu página de error 404”

  1. Bitacoras.com dice:

    Información Bitacoras.com…

    Valora en Bitacoras.com: Aprovecho que he cambiado la página de error 404 de TeoAtienza, para explicar cómo y porqué debemos personalizar nuestra página de error. Pero, antes de empezar, deberás saber qué es una página de error 404: El mensaje d…

  2. eContento dice:

    Muy buen aporte :-)

  3. [2009 Mayo] Colaboraciones de diseño/fotografía en el twitter de NoticiasDA, rico contenido « InFénix dice:

    [...] y LIBRES DE DERECHOS Figuras de ajedrez en formato .ai para #descargar gratis (157 KB) Personaliza tu página de ERROR 404 Posters de películas en vectores, muy buenos ¿Tienes tu portafolio en la web? ¡¡Crea uno [...]

Deja tu comentario