Custom 404 Pages



404.design

404.design




Website visitors land on a 404 error page when they try to visit a page that does not exist. This can be because the page has been moved or removed, the server or internet connection is down, users have clicked a broken link, or users typed the wrong URL. Typically 404 error pages result in one of the following messages:

  • 404 Not Found
  • HTTP 404 Not Found
  • 404 Error
  • The page cannot be found

When it comes to the overall design of 404 pages there are two options — a generic 404 page or a custom 404 page. Generic pages spit out messages with no regard to the design. Custom are pages are not only prettier, they can be useful too.

I like to keep my 404 pages simple, with included links to direct visitors to better, more interesting places. Here are a few examples.


Image
Image
Image
  Animated 404   

Motion helps make UIs expressive and easy to use. Despite having so much potential, motion is perhaps the least understood of all the design disciplines.

Image
Image
Image
  More or Less   

404 pages provide excellent templates to practice HTML/CSS, JavaScript, and minimal web design. There are a ton of awesome 404s in the wild. I suggest checking out airbnb's page, which inspired my "Oops 404" (bunny by Pablo Cuello). Flippy spaceman by Mung. Robot was stock, and the pages were created in Dreamweaver.

Use the 404 tag to see more!