Hoy hablamos de…

Página de error 404 personalizada

Tiempo de lectura: 4 minutos

¿Qué incluir en una página de error 404?

Ya sea como usuaria o como profesional de la web, seguro que la página de error 404 no te resulta ajena.
Se trata de un error que se produce cuando llamamos a una URL que no existe, ya sea porque no la hemos escrito de forma correcta o porque la página que queremos visitar ha sido eliminada. Es normal, tu negocio crece y tu web va cambiando, añades de aquí y quitas de allá, es inevitable que en algún momento termines teniendo algún enlace roto, pero tampoco hay que llevarse las manos a la cabeza.

El Chapulin colorado diciendo ¡que no panda el cunico!
No contaban con mi astucia

Un error 404 puede producirse por más de un motivo, muchos son fácilmente solucionables, pero algunos de ellos escapan a nuestro control 🤷‍♀️

  • La persona usuaria puedes haber escrito mal la URL
  • Puede existir algún error o ausencia en el archivo .htaccess
  • Quizás te hayan enlazado desde otra web y hayan metido la gamba al escribir la URL
  • Si has instalado algún plugin nuevo, comprueba si modifica al estructura de enlaces permanentes
  • Oye, ¿no habrás modificado tú misma la estructura de enlaces permanentes?
  • Si has estado haciendo redirecciones dentro de tu web, asegúrate de que están bien hechas
  • A lo mejor has borrado algún documento que ofrecías como descargable, generando así un enlace roto
  • ¿Has hecho algún cambio en tus DNS? Igual aún no han terminado de propagarse, compruébalo aquí

¿Cómo evitar que aparezca el error 404?

Si estás realizando cambios en tu web, una buena práctica en el momento en el que le pongas el lacito final es hacer una comprobación de enlaces rotos.

Herramientas para comprobar enlaces rotos

  • Broken Link Check. En esta web sólo tendrás que introducir la URL que quieras inspeccionar para comprobar si todo está en orden
  • Google Search Console. Si estás familiarizada con GSC sabrás que esta herramienta ofrece un millón de opciones para analizar el rendimiento de tu web. Si vas a la pestaña “Rendimiento” verás un listado de todas las URL’s de tu web que presentan algún problema, incluyendo aquellas que generan un error 404.

Es recomendable que incluyas la comprobación de enlaces rotos en las tareas de mantenimiento de tu web.

Pero la fiesta viene cuando el error 404 aparece por causas ajenas a nosotros, como una URL mal escrita. Para estos casos en los que nada podemos hacer para evitar que la temida página de error aparezca, nuestra mejor baza es una página de error 404 personalizada. Personalizando esta página que, nos guste o no, más de una persona terminará viendo, minimizamos las posibilidades de que esas personas abandonen nuestra web ofreciéndoles alternativas de navegación.

¿Qué incluir en una página de error 404 personalizada?

Hay un par de elementos que no son negociables, tienen que estar presentes sí o sí en tu página de error personalizada.

Aviso de error 404

Las personas usuarias tienen que saber en todo momento lo qué está pasando. Si les explicas dónde están y cómo han llegado hasta allí será mucho más fácil convencerles de que sigan navegando por tu web.

Danbee Shin 404
Danbee Shin

Opciones de navegación

El problema con las páginas de error 404 que aparecen por defecto si no has configurado una página personalizada es que son callejones sin salida, lanzan el mensaje de error y se quedan tan panchas. Pero si no queremos que las personas usuarias se vayan de nuestra web, es nuestro trabajo ofrecerles alternativas de navegación. Puede ser un menú de navegación completo o simplemente un botón que les invite a volver al inicio, eso ya es decisión tuya 😉

Error 404 trece matices
Trece Matices

➡ Y luego hay otros elementos que aportan, pero no son estrictamente necesarios. De estos puedes elegir un par, uno o ninguno.

Barra de búsqueda

La verdad es que no se me ocurre una forma más directa de invitar a las personas usuarias a continuar buscando eso que no han podido encontrar.

Jordan Prindel 404
Jordan Prindle

Formas de contacto

Depende del tipo de web que tengas, añadir un formulario, un botón para chatear con un soporte técnico o directamente un número de teléfono puede tener más o menos sentido. Valora si aportaría valor a tus personas usuarias, decide con sabiduría.

Dinahosting 404
Dinahosting

Un poco de autobombo

Puedes aprovechar este momento de confusión de tu público para venderte un poco. Puedes darles a conocer la landing page de tu última promoción, enlazar el último artículo de tu blog o invitarles a seguirte en redes sociales.

Neil Patel 404
Neil Patel

Una última recomendación

Cada vez es más frecuente encontrar páginas de error con un tono desenfadado, pero antes de tomar una decisión recuerda tener en cuenta el contexto.

Tu página de error debe ser coherente con la identidad visual y el tono de comunicación de tu marca.

Si se te ocurre algún otro elemento que debería incluir en mi página de error o tienes una página 404 favorita que te apetece compartir, la sección de comentarios es toda tuya 👇

¡Nos vemos en el próximo!

Niña rubia lanzando un beso

0 comentarios

Enviar un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

También te podría interesar

Identidad visual y diseño web

Identidad visual y diseño web

¿Es necesario que la identidad visual y el diseño web vayan de la mano? La identidad visual y el diseño web son elementos clave para la presencia on-line de cualquier negocio. Juntos, estos elementos pueden tener un impacto significativo en la percepción de tu marca y...

Las mejores fuentes de Google 2023

Las mejores fuentes de Google 2023

Combinaciones tipográficas de Google Fonts Hace unos días te contaba porqué es recomendable utilizar fuentes de Google Fonts en Wordpress y te prometí un post con las mejores fuentes de Google en 2023 que sí o sí voy a utilizar este año en mis proyectos de diseño web....

Google Fonts en WordPress

Google Fonts en WordPress

La importancia de la tipografía en el diseño web A estas alturas del partido a nadie se le escapa la importancia de escoger una tipografía adecuada en cualquier diseño, pero cuando hablamos de diseñar una web las implicaciones van un poquito más allá de la estética,...

¿No quieres perderte nada?

Sigue a Oficina Trece en redes sociales para mantenerte al día de todo lo que me traigo entre manos.

Ir al contenido