404 pages can really be a pain; broken links can hurt both user experience and SEO. However, if done right, a well-designed 404 page can turn a potential bounce into a memorable experience for your site’s visitors.
A 404 page is an HTTP status code response that appears when someone tries to access a URL that doesn’t exist on your server. This can happen for various reasons: the page was deleted, moved without a proper redirect, a user mistyped the URL, or an external link is outdated.
What makes a 404 page effective?
Despite our best efforts, a 404 page encounter is inevitable. So, you might as well make sure your page has all the necessary components to maintain a pleasant user experience.
A great 404 page should include several key components including:
- A clear error message
- Memorable visuals that highlight your brand identity
- A link to your homepage or one of your more popular pages
When handled incorrectly, 404 errors can negatively impact your SEO, users can become frustrated and leave, or you could lose valuable backlink equity.
When done well, they can serve as a creative way to engage your audience.
Here is a list of some of the more creative 404 pages we’ve seen.
Top 10 404 pages
1. Lego
Who doesn’t know and love Emmet from The Lego Movie? The brand does a great job of using its playful identity by featuring a recognizable character, while the family-friendly exclamation “Oh bricks!” is a clever play on words that also serves to acknowledge the error in a way that resonates with their core demographic.
2. Angry Birds
The iconic Red bird greets you with a surprisingly calm “Hello, is it me you’re looking for?”, a witty nod to Lionel Richie that subverts expectations for the notoriously temperamental character. The slightly awkward “Ehh… take me to homepage” button adds another humorous layer. It’s an unexpected juxtaposition that works beautifully, proving you can say a lot with very little text.
3. MailChimp
MailChimp’s 404 page stays true to their approachable, whimsical brand. A hand-illustrated donkey character looks puzzled as it searches for your missing page. The simple design and warm messaging make it clear they’ve got your back, with an easy path home.
4. Casetrentine
Sometimes, coming across a 404 can make you unreasonably angry. Admit it, we’ve all felt like the angry dinosaur below. At least Casetrentine recognizes it and uses the familiarity and humor to their advantage.
5. Blizzard
The gaming giant welcomes lost visitors with one of their beloved amphibious creatures, a Murloc. True to Blizzard’s playful style, this friendly character guides you back from the digital wilderness, making the detour feel like a mini Easter egg for fans.
6. Kualo
Getting a 404 error on Kualo’s site comes with a silver lining: a fully playable retro Space Invaders game. The hosting company gamifies the frustration, letting you blast away aliens while you decide where to go next. It’s nostalgia meets problem-solving.
7. Marvel
The Marvel universe is a vast one and the brand does a great job of capitalizing on it. They’ve chosen to rotate their 404 pages, so you never know which character you’ll see. It’s fun and engaging for fans and who knows, maybe you’re even hoping to land on a 404 to see which character you get.
8. Figma
Figma came up with a fun concept for their 404 page: interactive numbers you can manipulate. It fits perfectly with the concept of their online tool and serves as a fun distraction on your quest to find the right page.
9. Red Bull
Can’t find what you’re looking for? No worries, Red Bull has a video you can watch. You may be lost, but at least you have something entertaining to watch as compensation.
10. RCA Records
When you land on the RCA Records 404 page, you might not even realize it is one. It has a great interactive experience with music and all extremely engaging experiential content that ties directly to their industry and transforms the error into entertainment.
Creating your own 404 page
Now that we’ve explored some of the best 404 pages out there, you’re probably wondering how your own measures up. Well, lucky for you, creating an effective 404 page isn’t all that difficult.
[Case Study] Keep your redesign from penalizing your SEO
Method 1: Basic HTML setup
- Create the page
- Open your HTML editor
- Use an existing page template (like your About Us page) as a foundation
- View the source code, copy it, and paste it into your editor
- Customize the content to clearly communicate the error.
- Include navigation options: links to your homepage, search functionality, and popular content sections
- Save the file as
404.html
- Upload to your server
- Connect via FTP or your hosting control panel’s file manager
- Upload the
404.htmlfile to your web root directory - Test by navigating to
http://www.yourwebsite.com/404.html
- Configure your server For Apache servers (most common):
- Add this line to your
.htaccessfile:ErrorDocument 404 /404.html
For IIS servers:
- Open Internet Information Services (IIS) Manager
- Navigate to your website in the connections panel
- Double-click “Error Pages”
- Find the 404 error code and click “Edit”
- Point it to your custom 404.html file
- Apply changes and test
Note: If you’re on shared hosting without server access, contact your hosting provider with your custom 404 page file.
- Add this line to your
Method 2: Using a CMS
WordPress: Use the 404 page plugin, which is highly recommended for customizing 404 pages with great design templates and easy customization options.
Other platforms: Most modern CMS platforms have built-in 404 page customization options in their settings or theme editors.
There you go, now you have created a customized 404 page.
Monitor your 404 errors with Oncrawl
As mentioned earlier, it’s virtually impossible to escape all 404s. But, you should try to limit them when necessary.
To understand the scope of 404 errors on your site, run regular audits of your HTTP status codes using Oncrawl. You’ll get a clear overview of which pages return 404 errors, allowing you to:
- Identify broken internal links that need fixing
- Determine which pages should be redirected vs. left as 404s
- Decide whether high-traffic pages with backlinks should be redirected to similar content
- Track improvements over time
Built something creative? Share your 404 page with us and we may feature it.
