imagen porcentaje

Hasta 10% DTO / Formación PRESENCIAL

imagen promoción

Hasta 15% DTO / Formación ONLINE

imagen promoción

Hasta 10% DTO / Formación PRESENCIAL

Cómo crear la página de error 404 perfecta

crea-pagina-error-404-perfecta

Te damos las claves para crear la página de error 404 perfecta para tu próximo proyecto web. Un elemento con clara función: mejorar la usabilidad de la web para ayudar a nuestro usuario.

¿Qué es una página de error 404?

No importa si te dedicas al desarrollo web, o no. Muy probablemente te habrás encontrado, más de una vez, con una página de error 404 navegando por la web. Ocurren cuando el servidor no encuentra la página solicitada por el usuario, bien porque exista un error en la URL o porque la página haya sido eliminada o renombrada y no se haya aplicado una redirección automática a su nuevo destino. ¿Recuerdas la sensación que sentiste cuando te ocurrió por primera vez? ¿Recuerdas la diferencia entre una página estándar de error de servidor y una personalizada?

Una buena página de error 404 ayuda a reducir ese impacto negativo y ofrece alternativas de navegación al usuario. Por ello, en este artículo te daremos las claves para crear la página de error 404 perfecta.

Tipos de páginas de error 404

Por tipos de páginas de error 404 nos referimos a su complejidad, en otras palabras, del volumen de información alternativa o de ayuda que ofrecemos al usuario que se encuentra con el error:

  • Tipo 1: Mensaje de error + enlace a la página de inicio.
  • Tipo 2: Mensaje de error + enlace a la página de inicio + enlaces útiles a las páginas claves (contacto, categorías, etc.).

En el segundo caso, el usuario se encontrará con la página de error igualmente, pero le ofreceremos alternativas de navegación concretas y de interés, que pueden aprovecharse para promocionar determinados contenidos de la web.

Los elementos básicos de una página de error 404

Recordemos que una página 404 es una página de ayuda, así, su presentación y estructura debe estar muy meditada, simplificándose al máximo pero sin tener que sacrificar el diseño. Los elementos básicos serían:

  • Presentación corporativa que integre como una página más del sitio web corporativo.
  • Mensaje de error: “404 – Página no encontrada”, o derivados con humor.
  • Mensaje de advertencia por si se trata de un error al teclear la URL manualmente.
  • Campo de búsqueda para ofrecer la posibilidad de hacer una búsqueda rápida y directa.
  • Enlace al Sitemap y las categorías de contenidos para conocer la estructura de la web.
  • Vías de contacto con el administrador de la web para notificar el error.
  • Otros elementos que puedas considerar de interés promocionar. Por ejemplo, un artículo o proyecto destacado de la empresa, enlaces a las redes sociales corporativas, un vídeo, etc.

¿Cómo creo una página de error 404?

En este punto vamos a diferenciar entre dos tipos de web: ¿Con o sin CMS? En ambos casos, se puede crear una página de error 404 sin mayores problemas, pero con la ventaja de que prácticamente cualquier plantilla de CMS tipo WordPress, ya incorpora una página por defecto.

Caso 1: Mi web no tiene un CMS que la gestione

¡Qué no cunda el pánico! La situación es muy sencilla de solucionar:

  1. Confirmamos que nuestro servidor soporta Apache.
  2. Creamos la página de error 404 personalizada y la nombramos como: “404.php”.
  3. Creamos un fichero .htaccess con la siguiente línea de código: “ErrorDocument 404 /404.php”.
  4. Subimos ambos ficheros a la carpeta raíz de la web en el servidor.
  5. Hecho.

¿Qué? ¿Ha sido fácil verdad? Ahora, todas las peticiones de servidor que se realicen y no encuentren la página de destino, se redirigirán automáticamente a la página de error.

Caso 2: Mi web está gestionada con un CMS: WordPress

Lo comentábamos anteriormente: Prácticamente todas las plantillas diseñadas para WordPress, deberían tener una página 404 por defecto, y que podemos personalizar a nuestro gusto sin demasiado esfuerzo si disponemos de unos conocimientos mínimos de HTML y CSS, siguiendo las recomendaciones descritas en el apartado anterior. En este caso, no será necesario crear los ficheros y subirlos manualmente al servidor. ¡Ya funcionan por defecto!

La página de error 404 es funcional, y una oportunidad

Todos cometemos errores. La diferencia la encontramos siempre en la reacción que tengamos para solucionarlos y que en el caso web, radica en la solución que ofrecemos al usuario. Las páginas de error 404 son una oportunidad de destacar y de ofrecer algo diferente al usuario (incluso con animación como Airbnb o minijuegos como Blue Fountain Media).

crea-pagina-error-404-perfecta-1

crea-pagina-error-404-perfecta-2

Lógicamente, la imagen podrá volar si el target o público objetivo de la web así lo permite, porque no será lo mismo diseñarla para una entidad bancaria que para una agencia de marketing; pero que en todos los casos cumplirán su objetivo funcional de orientar al usuario y reducir, en la medida de lo posible, la sensación negativa que produce el error.

Evita los enlaces rotos, porque afectará negativamente al SEO

Una vez que conocemos la utilidad y las opciones de configuración de una página de error 404, conviene recordar que hay que evitar, en la medida de lo posible, que entren en acción por un enlace roto (fruto de la modificación o eliminación de una página, o cualquier otro recurso interno en nuestro servidor, como un enlace de descarga de un fichero PDF, por ejemplo). La razón es doble: reduce la usabilidad e influye negativamente en el posicionamiento SEO. Caso distinto son los errores por una URL mal escrita manualmente en el navegador. ¡Eso es inevitable!

Para detectar estos enlaces rotos (tanto internos, como externos), existen diversas utilidades gratuitas, de las que destacaremos tres: Broken Link Checker for WordPress (uno de los plugins gratuitos más populares para WordPress), Google Webmaster Tools (el conjunto de herramientas web para desarrolladores de Google) y W3C Link Checker (la herramienta online para revisar enlaces rotos del W3C, el consorcio responsable de los estándares web HTML y CSS).

Cualquiera de ellas detectará, casi en tiempo real o tras un breve periodo de búsqueda, cualquier enlace roto que aparezca en nuestra web y que deberíamos solucionar de forma inmediata. Una tarea titánica en sitios web tipo blog, o página de noticias, que pueden generar miles de enlaces cada año. En estos casos, y cruzando los datos del servicio de estadísticas que tengamos instalado (tipo Google Analytics, por ejemplo), la recomendación lógica sería comenzar a actualizar, de forma prioritaria y progresiva, aquellos enlaces con mayor tráfico.

12/04/2016 | , | Artículos Arquitectura Artículos BigData, BI y Marketing Online

Miguel Gómez

Miguel Gómez

Escribe tu
Comentario

Si quieres personalizar tu avatar, click aquí.
Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *
Recuerda que los comentarios deben ser revisados por un administrador.

O si lo prefieres, déjanos tus datos y nosotros te llamamos.

*Selecciona una titulación

Te llamamos sin compromiso

Puedes llamarnos al 91 401 07 02 (Centro Maldonado) o al 91 435 58 43 (Centro Povedilla).

Si lo prefieres, déjanos tus datos y nosotros te llamamos.

Solo hasta el 25 de marzo

¡MATRÍCULA

GRATIS!

Solo quedan


*Consulta condiciones aquí
Cómo crear la página de error 404 perfecta
Buzón de Sugerencias
SOLICITAR UNA CLASE DE PRUEBA GRATUITA
Cómo crear la página de error 404 perfecta

Horario atención al cliente

  • Lunes a viernes

    • De 9 a 14 horas
    • De 16 a 21 horas
  • Sábados

    • De 9 a 14 horas

Teléfono de contacto: 91 435 58 43

Solicita información sobre
Envíanos tu opinión sobre CICE
Nosotros te asesoramos

¿No te decides?

Nosotros te ayudamos. Utiliza nuestro buscador avanzado para encontrar el curso que quieres.