Páginas de error personalizadas en Nginx: Mejora la experiencia del usuario

Crea y configura páginas HTML personalizadas para los errores de Nginx (como 404 o 500) para ofrecer información útil y una experiencia de usuario más profesional.

Cuando un usuario encuentra un error en tu sitio web, la página de error predeterminada del navegador puede resultar confusa o poco profesional. Personalizar estas páginas en Nginx no solo mejora la estética, sino que ayuda a guiar al usuario de vuelta a tu contenido.

1. Crea tus páginas de error

Primero, crea los archivos HTML que deseas mostrar. Por ejemplo, crea un directorio para tus errores:

sudo mkdir -p /var/www/html/errors

Crea un archivo 404.html dentro de esa carpeta con tu diseño personalizado.

2. Configura Nginx

Edita tu archivo de configuración de Nginx (generalmente en /etc/nginx/sites-available/default o en tu archivo de configuración específico del sitio):

server {
    # ... tu configuración existente ...

    error_page 404 /404.html;
    location = /404.html {
        root /var/www/html/errors;
        internal;
    }

    error_page 500 502 503 504 /50x.html;
    location = /50x.html {
        root /var/www/html/errors;
        internal;
    }
}

3. Prueba y recarga

Verifica que la sintaxis sea correcta y reinicia Nginx:

sudo nginx -t
sudo systemctl reload nginx

¡Listo! Ahora, cuando ocurra un error, tus usuarios verán tu página personalizada en lugar del mensaje genérico del sistema.