Custom 404 Pages on Static.app

Quick Answer

To create a custom 404 page on static.app: build any HTML page (name it something like not-found.html ), open Page Settings, and select 404 (Page Not Found) from the Custom Error Page dropdown. Static.app then serves that page with a proper 404 status whenever a URL doesn't match. Add a <meta name="robots" content="noindex"> tag so the page itself doesn't get indexed.

A 404 page is what visitors see when they try to load a URL on your website that doesn't exist. The default looks ugly and sends people away. A custom one keeps them on your website, helps with SEO indirectly, and takes about 20 minutes to make. Static.app has a built-in feature for this, so you don't need to hardcode anything.

How error pages work on static.app

The platform lets you take any HTML page in your website and assign it to a specific HTTP error code through Page Settings. The supported codes are:

404 — Page Not Found (the one almost everyone needs)
400 — Bad Request
401 — Unauthorized
403 — Forbidden
500 — Internal Server Error
503 — Service Unavailable
504 — Gateway Timeout

For most websites, the 404 is the only one you need to worry about.

Setting it up

Step 1. Create a new HTML page for your 404. In your dashboard, go to Pages and click Add New Page. Name it something clear like not-found.html or error-404.html .

Step 2. Click the page's three-dot menu and choose Edit Code. Build the content (template below).

Step 3. Open the page's Settings (also in the three-dot menu, or click the page name). In the Custom Error Page dropdown, select 404 (Page Not Found). Save changes.

That's it. From now on, when someone visits a URL that doesn't match any file in your project, static.app serves this page automatically with a proper HTTP 404 status code (not a 200, which would be a soft 404 and confuse search engines).

What to put on the page

A good 404 does four things:

Tells the user the page doesn't exist, clearly
Matches the rest of your website's design (so it doesn't feel like an error from somewhere else)
Offers ways back: home link, navigation, search if you have one
Links to your most popular or important pages

A minimal example you can drop in via the built-in Edit Code editor:

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <title>Page Not Found | Sara's Pottery Studio</title>
 <meta name="robots" content="noindex">
</head>
<body>
 <main>
 <h1>That page isn't here</h1>
 <p>You may have followed an old link, or I may have moved something. Sorry about that.</p>
 <p>Try one of these:</p>
 <ul>
 <li><a href="/">Home</a></li>
 <li><a href="/shop">Shop</a></li>
 <li><a href="/classes">Pottery Classes</a></li>
 <li><a href="/contact">Contact</a></li>
 </ul>
 </main>
</body>
</html>

The noindex tag is intentional

Note the <meta name="robots" content="noindex"> in the head. You don't want Google to index your 404 page itself. The page only exists to be displayed when something goes wrong. Adding noindex prevents it from accidentally showing up in search results.

Voice matters

A page that says "404 Error" in big red text feels like a system error. A page that says "That page isn't here" in your normal website voice feels like part of the experience. The second one keeps people on your website.

If your brand is playful, be playful. If your brand is professional, be professional. Match the tone of the rest of your website. Don't make jokes that feel out of character.

Why this helps SEO indirectly

A custom 404 doesn't directly affect your rankings. But it affects two things that do:

Bounce rate. Users who hit a 404 and leave count as a bounce. A custom page that offers other paths keeps them on the website longer.
Crawl budget. When Google hits a real 404 status, it understands the page doesn't exist and stops crawling it. With a proper 404 status code, your crawl budget gets spent on real pages.

Verify in Chrome DevTools (Network tab) that your 404 page is returning a 404 status, not a 200. When you assign the page through the Custom Error Page dropdown, static.app handles this correctly.

Optional extras

If you have a popular blog or product catalog, consider adding a small search box or a list of top pages to your 404. The goal is to get the user where they wanted to go, not just back to the homepage.

If you have analytics enabled, check the reports occasionally for 404 hits (the analytics overview article covers what to look for). Frequent 404s usually mean a broken external link somewhere. Find it and either fix the source or set up a redirect.

Twenty minutes, saves hundreds of visitors a year

Every time someone hits a 404, they decide whether to leave or keep looking. A custom page tilts that decision toward staying. It's one of the highest-value small jobs you can do, and the platform makes it a three-click setup.

Frequently Asked Questions

Does a custom 404 page improve SEO directly?

Not directly. But it reduces bounce rate (visitors who would have left now click to your homepage or a useful page) and helps Google's crawl budget land on real pages. Indirectly, both improve your overall SEO.

What HTTP status code should a 404 page return?

A real 404. When you assign a page through static.app's Custom Error Page dropdown, the platform handles this correctly. A 404 page that returns 200 (a "soft 404") confuses search engines and is one of the most common ranking issues on poorly configured websites.

Should I redirect 404s to my homepage instead?

No. Redirecting every 404 to the homepage is what's known as a soft 404 problem and gets penalized. Show a real 404 page with helpful links instead. Search engines need to know when a URL truly doesn't exist.

Can I have different 404 pages for different sections of my website?

On static.app, you set one custom error page per HTTP code per website. So one 404 across the whole website. If you want sectional differences, build that logic into the 404 page itself with conditional content based on the requested URL (using JavaScript or by varying your design).

How do I find broken links on my website?

Google Search Console reports 404s in the Pages report under "Not found." External tools like brokenlinkcheck.com crawl your website and flag broken internal and external links. Check these monthly.