Páginas de Error

Las páginas de error son respuestas del servidor web que indican que la página solicitada no se puede encontrar o no está disponible. Su diseño simple y conciso facilita al usuario comprender rápidamente el problema y, generalmente, ofrece un enlace para regresar a la página principal o continuar la navegación.

Playground

Buk

Lo sentimos, esta página no está disponible

404

Página no encontrada

No pudimos encontrar la página que estás buscando.

Por mientras puedes Volver a la página principal

Seleccionar código de error

404403500503

Cambiar título

Html

    <section class="error-page d-flex align-items-center justify-content-center vh-100">
    <div class="m-5 d-flex flex-column align-items-center" role="document">
      <div class="d-flex flex-column align-items-center">
        <img height="150" width="300" class="w-100" src="buk-white.svg" />
        <h2 class="error-page__subtitle">Buk</h2>
      </div>
      <div class="error-page__content text-center">
        <h2>Lo sentimos, esta página no está disponible</h2>
        <span class="error-page__num">404</span>
        <div class="error-page__link">
          <h2>Página no encontrada</h2>
          <p>No pudimos encontrar la página que estás buscando.</p>
          <p>Por mientras puedes <a href='#'>Volver a la página principal</a></p>
        </div>
      </div>
    </div>
  </section>
    

Lista de parámetros

Parámetro

Tipo

Detalle

errorCode	String	Define el código del error, puede ser 404, 403, 500, entre otros.
title	String	Define el titulo de la plantilla de la página error, se muestra debajo del código de error.
message	Block	Representa contenido que ofrece más contexto sobre el error, puede incluir elementos como textos y links y se muestra debajo del título.

---

Anatomía

El nuevo diseño de plantilla para páginas de error incorpora la paleta de colores actualizada de la marca, ofreciendo un diseño depurado y contemporáneo. Este template ofrece la flexibilidad de personalización, pues recibe códigos de error específicos, títulos y mensajes adaptados a cada situación.

1. Código de error

Un texto corto que muestra el número correspondiente al código de error, por ejemplo 404.

2. Título

Un texto breve que provee información sobre el error, por ejemplo para el caso del código de error 403, puede proveerse un título como Acceso no autorizado.

3. Mensaje

Un contenedor que usualmente recibe elementos como texto o link que proveen más contexto sobre el error u ofrecen una opción para navegar a la página principal.

---