Sitios web
Páginas de Error Personalizadas
A custom error page replaces the plain server default with your own branded HTML, while keeping the true error status so search engines still see a real 404. This guide covers adding a page for each…
Una página de error personalizada reemplaza el predeterminado simple del servidor con tu propio HTML con marca, manteniendo el estado de error verdadero para que los motores de búsqueda sigan viendo un 404 real. Esta guía cubre cómo agregar una página para cada código compatible, qué se elimina por seguridad y cómo funciona el distintivo de verificación.
Dónde viven las páginas de error en KPanel
- Inicia sesión en KPanel.
- Haz clic en Websites en la barra lateral izquierda y luego haz clic en el sitio.
- En la pestaña del sitio, abre Advanced y luego Error pages.
La dirección directa es /websites/<site-id>/error-pages.
Por qué molestarse
Una página de error predeterminada del servidor es un callejón sin salida. No tiene marca, sin navegación y sin explicación, por lo que un visitante que llega a una generalmente se va.
Una página personalizada convierte eso en una ruta de regreso al sitio: tu logo, tu tipografía, una frase con tu propia voz y un enlace a la página de inicio o a un cuadro de búsqueda. En un sitio grande, las URL mal escritas y anticuadas son un flujo constante de tráfico, y una página 404 es la recuperación más barata que jamás construirás.
Los códigos compatibles
Puedes configurar una página personalizada para ocho códigos, una página por código:
| Código | Significado | Causa típica |
|---|---|---|
| 400 | Bad Request | Una solicitud malformada |
| 401 | Unauthorized | Autenticación requerida o fallida |
| 403 | Forbidden | Una regla de acceso bloqueó la solicitud |
| 404 | Not Found | Nada existe en esa URL |
| 500 | Internal Server Error | Tu aplicación falló |
| 502 | Bad Gateway | La aplicación no respondió correctamente |
| 503 | Service Unavailable | La aplicación está inactiva o sobrecargada |
| 504 | Gateway Timeout | La aplicación tardó demasiado |
Comienza con 404. Es con mucho el más común, y es el único que un visitante alcanza a través de la navegación ordinaria en lugar de una falla.
La familia 5xx vale la pena hacer a continuación, porque esas son las páginas que la gente ve en tu peor día. Una página con marca tranquila que dice que algo salió mal y proporciona una dirección de correo electrónico es mucho mejor que un error del servidor en blanco.
Agregar una página
- Haz clic en Add error page.
- Elige un código de error del menú desplegable. Los códigos ya en uso no se enumeran.
- Reemplaza el HTML de ejemplo en el campo HTML body con el tuyo.
- Haz clic en Add error page.
El editor comienza con un documento 404 funcional que puedes editar, que es un punto de partida razonable si solo quieres algo ordenado rápidamente.
Escribir el HTML
Proporciona un documento HTML completo, comenzando con un doctype. Se sirve tal cual, por lo que debe ser independiente.
Algunos HTML se eliminan antes de que la página se almacene, por seguridad:
<script>tags- manejadores de eventos en línea como
onclick - iframes
- hojas de estilo remotas
Si algo fue removido, una advertencia te lo dice después de guardar.
Debido a que las hojas de estilo remotas se eliminan, una página de error no puede extraer el archivo CSS principal de tu sitio. Estílizalo con CSS en línea o un bloque <style> en el encabezado del documento. Esto es intencional: una página de error debe representarse cuando el resto del sitio está roto, y una página que depende de obtener activos de un servidor fallido se representará como texto sin estilo exactamente en el momento equivocado.
Orientación práctica:
- Mantenlo pequeño y autónomo. Alinea todo. Evita imágenes externas. La lista de páginas muestra el tamaño de cada página en KB.
- Di lo que pasó en palabras simples. "No pudimos encontrar esa página" es mejor que "404 Not Found".
- Proporciona una forma de avanzar. Un enlace a la página de inicio, un enlace a tus secciones principales o un cuadro de búsqueda.
- Incluye una ruta de contacto en las páginas 5xx, ya que el visitante no puede usar el sitio para comunicarse contigo.
- No lo uses para redirigir. Si una URL se ha movido, redirigela correctamente. Ver Site Redirects.
El código de estado se conserva
Tu página personalizada se sirve con el estado de error real, no 200. Un 404 permanece como 404 todo el camino hasta el cliente.
Esto importa más de lo que parece. Una página con marca devuelta como 200 es un 404 suave: los motores de búsqueda la indexan como una página real, tu análisis la cuenta como una vista exitosa y los enlaces rotos nunca se marcan por ninguna herramienta. Debido a que Kapsule mantiene el estado verdadero, todo eso continúa funcionando correctamente.
Leer el distintivo de estado
La columna Status reporta lo que realmente pudo verificarse, y deliberadamente es honesta sobre los límites.
| Distintivo | Significado |
|---|---|
| Verified: branded page served (true 404) | Forzamos un 404 desde afuera y obtuvimos tu página con el estado correcto |
| Configured (not externally tested) | La página está aplicada. Ese código no puede activarse desde fuera bajo demanda |
| Not yet verified | La verificación aún no se ha ejecutado |
| Applied, live test inconclusive | La sonda obtuve algo diferente a un 404 limpio, a menudo porque una redirección lo atrapó |
| Got a 404 but the branded page was not served | La regla está en lugar pero tu página no volvió. Intenta guardarla nuevamente |
Solo 404 puede forzarse externamente. Solicitar una URL que no existe produce confiablemente un 404, pero no hay forma de que un servidor saludable produzca un verdadero 500 bajo demanda sin romperlo. Entonces los otros códigos reportan Configured en lugar de reclamar una verificación que nunca sucedió. Aún así se sirven cuando el error ocurre genuinamente.
También puedes ver una advertencia de que otra configuración en el servidor reclama el mismo dominio. Hasta que eso se resuelva, la página de error puede no aplicarse. Contacta al soporte si lo ves.
Solucionar problemas de un sitio que realmente tiene errores
Si estás aquí porque tu sitio está lanzando errores en lugar de porque quieres páginas más bonitas, la página tiene un atajo: el botón Troubleshoot with Kora en el banner en la parte superior.
Le pide a Kora, el asistente dentro de KPanel, que lea tus registros de error y fallos recientes para este sitio y te diga la causa probable y cómo solucionarlo. Ese es un primer paso mucho más rápido que leer registros sin procesar.
Para la imagen de rendimiento subyacente, ver Site Performance and APM, y para la tasa de error a lo largo del tiempo, ver Site Traffic Analytics.
Editar y eliminar
Cada fila tiene un botón de edición, que abre el mismo editor con el código fijo y el HTML cargado, y un botón de eliminar.
Eliminar pide confirmación y explica el resultado: las solicitudes que alcanzan ese código vuelven a la página predeterminada del servidor.
Solución de problemas
Mi página no se muestra. Confirma que estés activando el código correcto. Una ruta que redirige nunca llega a un 404. Prueba con una URL que genuinamente no existe, en una ventana privada para que no haya caché involucrado.
La página se muestra pero se ve sin estilo. Tu hoja de estilo fue eliminada como un activo remoto. Alinea el CSS.
Mi script de seguimiento falta. Los scripts se eliminan por diseño. No hay forma de ejecutar JavaScript desde una página de error personalizada aquí.
Todos los códigos ya tienen una página. Los ocho están en uso. Edita una página existente en lugar de agregar otra.
El distintivo dice que la página con marca no fue servida. Guarda la página nuevamente. Si persiste, y no apareció una advertencia de conflicto de dominio, abre un ticket.
Páginas relacionadas
- Site Redirects para evitar que suceda el 404 en primer lugar.
- Site Traffic Analytics para ver cuántas respuestas 4xx y 5xx realmente estás sirviendo.
- Password-Protecting a Site, que produce respuestas 401 por diseño.