404 Error Page Messages
Contents |
All Topics Web design 30 brilliantly designed 404 error pages 30 brilliantly designed 404 error pages By Creative Bloq Staff Web design Clicking on a broken link is a pain, but a witty and well-designed error page at least sweetens the pill. Here are some designs to inspire 404 error page template you. Shares Page 1 of 2: Page 1 Page 1 Page 2 If you're working on how google 404 error page to start a blog or website, don't forget the all-important 404 page – a standard response code in HTTP telling the user, in effect, that 404 error page not found they've clicked on a broken link.It's traditionally been an immense source of frustration, but in recent years, creatives have taken up the challenge of designing bespoke 404 pages that at least sweeten the pill of finding you're in the wrong place.When done funny 404 error page really well, they become mini-ambassadors for the website itself, being shared on Twitter and blogs as an example of the site or service's keenness for customer service and unique approach to design. The 30 we present here have achieved all this and more, so take a look and be inspired to create your own bespoke 404 pages!01. Bluegg This noisy chap provides a hilarious notification that you're in the wrong placeThe 404 page of creative and digital design agency is simple, but so
404 Error Page Design
effective. Upon loading, you're greeted by a goat, who lets out the most almighty high-pitched scream, alerting you that the page doesn't exist. The inner child in us emerged and we must admit to playing this repeatedly, while crying a little with laughter. Bravo, guys.02. Hot Dot Production Hot Dog's 404 page is seriously addictiveHot Dot Productions has applied it's 'where design meets technology' tagline to its impressive 404 page, which features the three numbers made up of hundreds of tiny dots that change direction in response to mouse movements. Seriously cool.03. Airbnb If you drop ice cream on the floor, clean it up, right?This 404 page from couch-surfing behemoth Airbnb features a delightful animation that holds lessons for us all about ice cream and the inadvisability of dropping your ice cream. It also brings to mind press stories about people who rented out their homes on Airbnb, only to come back to a disaster area. Look, if you drop ice cream on the floor, clean it up, right?04. Lego Lego can do no wrong in our eyes – we love this cute little tableau for its website's 404 pageIn general, Lego can do no wrong in our eyes, and we love this cute little tableau for its website's 404 page, which proves that you don't need a lot of technical-sounding text to get your error message across.05. Magnt Magnt's clever 404 page demonstrates both a keen sense of wit, and a clear call to actionMagnt enables you t
asks for a page that’s simply not available on your site. The reason for this is that there may be a link on your site that was wrong or the page might have been recently removed from the
404 Error Page Examples
site. As there is no web page to display, the web server sends a page that 404 error page html simply says "404 Page not found". The 404 error message is an HTTP (Hypertext Transfer Protocol) standard status code. This "Not Found" response 404 error page game code indicates that although the client could communicate to the server, the server could not find what was requested or it was configured not to fulfill the request. The 404 "Not Found" error is not the same as http://www.creativebloq.com/web-design/best-404-pages-812505 the "Server Not Found" error which you see whenever a connection to the destination server could not be established at all. The default 404 error page as shown on Internet Explorer is given below. HTTP Status Code Whenever you visit a web page, your computer will request data from a server through HTTP. Even before the requested page is displayed in your browser, the web server will send the HTTP header that has the status code. The http://www.404errorpages.com/ status code provides information about the status of the request. A normal web page gets the status code as 200. But we do not see this as the server proceeds to send the contents of the page. It’s only when there is an error, we see the status code 404 Not Found. Origin of Status Codes As a part of the HTTP 0.9 specifications, the World Wide Web Consortium (W3C) established HTTP status codes in 1992. Tim Berners-Lee, who invented the web and the first web browser in 1990, defined the status codes. List of Status Codes A brief overview of HTTP status codes is given below. Code Meaning Description 100 Continue Confirms the client about the arrival of the first part of the request and informs to continue with the rest of the request or ignore if the request has been fulfilled 101 Switching Protocols Informs the client about the server switching the protocols to that specified in the Upgrade message header field during the current connection. 200 OK Standard response for successful requests 201 Created Request fulfilled and new resource created 202 Accepted Request accepted, but not yet processed 203 Non-Authoritative Information Returned meta information was not the definitive set from the origin server. 204 No Content Request succeeded without requiring the return of an entity-body 205 Reset Content Request succeeded but require resetting of the document
Deconstrukt Resources 30 Fresh & Creative 404 http://www.cssdesignawards.com/articles/30-fresh-creative-404-error-page-designs/45/ Error Page Designs By CSSDA crew in inspiration ~ http://www.uxbooth.com/articles/5-tips-to-make-your-404-page-more-usable/ 23 Dec 2013 ~~~ Plasm (*interactive) RSQ Good Dog Design Parallax Aldeia Coworking Hatched (*interactive) CoolApps(e) Focus Lab Magnt Michael Schmid Attack Pattern Harbr Co. 1 Minus 1 Distilled Saus (*animated) Mint Hot Dot (*animated) 404 error Blizzard Lockerz Knormal Howlt Convoy Subsign Nulab Hash Rocket Brand Crowd Bluegg (*video) We Can't Stop Thinking (*animated) Herrlich Media Rodolfo ------------ Found is our way of sharing the best articles, resources and tutorials that find their way to the eyeballs of the CSSDA crew. 404 error page Tweet Proudly Sponsored By Design Jobs Senior UX Designer American Express London, United Kingdom UX / UI Designer TED New York, NY, United States Related Articles New UI & Color Inspiration For 2016 30 Best WebGL Sites For 2015 33 Best One Page Websites of 2015 40 Best Ecommerce Sites To 'Check Out’ Back to top Please enable JavaScript to view the comments powered by Disqus. comments powered by Disqus ‹ PrevAllNext › Awards Winners Special Kudos Nominees Leaderboard Submit Features The Dex Jobs Events Design & Dev Feed Articles Logo Wall About CSSDA Judges Awards & Prizes Sponsors Contact Terms Credits CSS Design Awards Facebook CSS Design Awards Twitter CSS Design Awards Google plus CSS Design Awards Pinterest CSS Design Awards RSS Copyright © 2010 - 2016 CSS Design Awards
Articles 5 Tips to Make Your 404 Page More Usable March 17th, 2009 Written by Matthew Kammerer Chief Executive Officer, Cofounder Published on March 17th, 2009 In this post I will outline 5 ways to make your 404 error page more usable. In some cases, a 404 page may be the first impression a visitor has of your site. Why not make it a good one? These steps can easily lead to a better user experience if implemented and should be a part of every web site you develop. 1. Ditch the Default Customization of your 404 page is the first step when improving your error page. The default error message is not helpful. In most cases, landing on a page that results in a standard 404 Error means that your viewers will only have the option to return to the previous loaded page. If your user lands on a 404 page from an outside link, then you have no chance of retaining the visitor unless they visit your domain directly. Do not expect users to put forth this much effort if you have not put forth the effort to make your page more user friendly. Customization is easy and can make a world of difference. There are guides on creating your own custom 404 page for services such as WordPress and Apache. 2. Keep it familiar Yahoo! keeps it's 404 Message short and simple, but it is evident that the page is a part of Yahoo. Sometimes, it just makes the most sense to start back from square one. When designing your 404 page you want to keep the same basic structure as the rest of your site. When a user lands on a 404 page that looks completely different from the site they may wonder if they have left your site completely. At the very least, keep a recognizable banner or logo that a viewer can instantly connect with in your 404 Error Message. Simply seeing a familiar graphic will be reassuring enough for most. 3. Keep it Basic Your 404 page should be kept basic so that you do not intimidate your user; the fact that your user has stumbled onto an error will be overwhelming enough for them. The main goal of your 404 page is to direct your user to the page they were looking for as quickly as possible. Digital Photography School Blog is quick to connect users that land on a 404 page with the most recent content posted at the site. This goal needs to be met in a way that will benefit a broad audience, but again, too many options will quickly make the page ineffective. Offering links to the most used pages on a site is one way to ensure you'll help a wide number of users: For some sites this may simply mean including the primary navigation, while on blogs and larger sites it may mean including links to the most popular posts/child pages. Since it's usuall