Outage error page generator

When your site is down, the error page is the only page anyone sees. Make it say what is going on and send people to a live status page, instead of "502 Bad Gateway". This runs in your browser - nothing you type is sent anywhere.

What a good outage page says

A default error page answers the wrong question. "502 Bad Gateway" tells a visitor which machine gave up, which is no use to anyone who is not on your operations team. What they want to know is whether the problem is theirs, whether you know about it, and when to come back. A good outage page answers all three in two sentences and then gets out of the way.

The most useful thing on it is a link to somewhere that shows the live state. A visitor who can see that the site is being checked, and that the check is failing, stops refreshing and stops emailing you. That is why the generated page points at a status page rather than a support form - the common causes of downtime are rarely fixed faster by more people reporting them.

Keep it self-contained. The page is served exactly when your application, and often your database and asset server, are unavailable, so it cannot load fonts, scripts or images from them. Everything this generator produces is inline for that reason. Pair it with uptime monitoring so you hear about the outage before the first visitor sees this page, and with the uptime calculator if you need to explain afterwards what the outage cost against your SLA.

Where to put it

Cloudflare

Upload error.html anywhere public (Cloudflare Pages works), then set it under Custom Pages → 5XX Errors in the dashboard. Cloudflare serves it whenever your origin fails.

nginx

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

Apache

ErrorDocument 502 /error.html
ErrorDocument 503 /error.html
ErrorDocument 504 /error.html

Questions

Where does this page go?

Anywhere your stack shows its own error page: Cloudflare's custom error pages (5xx errors), an nginx error_page directive, an Apache ErrorDocument, or a maintenance page on your host. The instructions for each are below the generator.

Why link to a status page from an error page?

Because an error page is the one page every stranded visitor sees. Sending them to a live status page answers "is it just me?" and stops them emailing you to ask.

Does the page need JavaScript or anything from your server?

No. It is one self-contained HTML file with its styles inline. It keeps working when everything behind it is down - which is the only time anyone sees it.