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:
- Bonitos diseños para tus páginas de error 404 (recomiendo ver su propia página)
- 404 Error Pages: Reloaded
- 70 more fantastic 404 error pages
- 17 brilliant 404 pages and why they are cool
- The 100 most funny & unusual 404 error pages
- 60 beautiful 404 error pages
- Grupo Flickr sobre páginas de Error 404
Tags: error 404, personalizar pagina





Abril 30th, 2009 at 13:53
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…
Abril 30th, 2009 at 16:32
Muy buen aporte
Junio 1st, 2009 at 6:26
[...] 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 [...]