When you visit a website, a web server somewhere is sending documents across the network back to your web browser. Along with the documents comes a variety of metadata, one of which is a status code. Say everything went just perfectly... that code is 200 (OK). But there are many more, and that will be this months theme!
September's Challenge Sponsor: Jamf
This month we have Jamf as a sponsor. Jamf Now allows you to manage all the Apple devices in your company. For example, remotely configuring all the settings on all of your iPad, iPhone and Mac devices quickly and consistently.
Week One: 404 Not Found
Of course, we had to start most famous of all the HTTP status codes! A 404 code means that you've gone to a URL on a website that doesn't exist. We have one right here on CodePen, as do most websites. People might end up on a 404 page for any number of reasons, like a mistyped URL, a followed link that has changed, or incorrectly configured redirection rule.
Your challenge: build out an idea for a 404 page.
To participate: Create a Pen → and tag it codepenchallenge and the weekly tag cpc-404. We'll be watching and sharing the best stuff on our blog, Twitter, and Instagram (Use the #CodePenChallenge tag on Twitter and Instagram as well).
- Landing on a 404 pages isn't a wonderful experience. A user's expectations are immediately shattered - whatever they were thinking they were going to find isn't there. Perhaps you can soften the blow with some UX thinking. How can you help them move on from here?
- 404 pages are a bit like an easter egg in a video game. They aren't part of the main site. There is no 404 page in the main navigation. So landing there could feel like you've found a secret part of a site. Can you get clever there? Be funny? Be exciting?
- The code 404 officially means 'Not Found'. Can you play that up? Perhaps a magic eye game? Where's Waldo? Scavenger hunt? Sherlock Holmes?
- Marie has a big collection of 404 page examples right here on CodePen already. Perhaps you can find some inspriation there. UX Planet has also collected some clever ones.
- Jane Reyes says 'turn error into UX opportunity' and Stephanie Hamilton has a variety of advice on what to do and how to do it.
- Perhaps this is a good opportunity to learn something new and then incorporate whatever that is into the challenge. Have you seen The Odin Project? It has loads of courses on web stuff, all free.