Home > Error Page > Custom Error Page Design

Custom Error Page Design

Contents

Made by Compact Creative © 2016 Home / Articles / Inspiration / GalleryAbout / Membership / Advertising / Write For Us In Partnership with and 0 0 0 ERROR The requested How can you help your users find what they are looking fo. A subfolder .htaccess file overrides a higher-level one. Design Layout - Apr 8 20 Design Rules You Should Never Break Design Layout - Apr 14 10 Ways to Stop Your Designs From Looking the Same this contact form

Please try the request again. Design Layout - May 6 More related articlesFeatured Resources 60 Free Outline Icon Sets Perfect for Contemporary Desi... It can be imaginative and outlandish as long as it communicates. Behance/Thapwaris ChinsirirathkulIn this fun 404 page, you’re transported to space. Register or Login Design Shack — Web Design Gallery, Articles & Community ArticlesInspirationGalleryAbout SearchBusinessCSSFreelancingGraphicsHTMLLayoutsMobileNavigationSoftwareTypographyUX DesignMore →BusinessCSSFreelancingGraphicsHTMLLayoutsMobileNavigationSoftwareTypographyUX DesignMore → Expand Navigation By:Carrie CousinsOn:17 Nov 2014Topics:AccessibilitySocial: What Makes a Great 404 Error Page?No http://www.creativebloq.com/web-design/best-404-pages-812505

404 Error Page Template

View support forum Translations Translate Custom Error Pages Compatibility WordPress 4.6.1 4.6 4.5.4 4.5.3 4.5.2 4.5.1 4.5 4.4.5 4.4.4 4.4.3 4.4.2 4.4.1 4.4 4.3.6 4.3.5 4.3.4 4.3.3 4.3.2 4.3.1 4.3 4.2.10 Instead of just using a regular ol’ typeface, they used furniture (from their company) to create the 404 mark. This is because the website you are visiting (or trying to visit) does not use custom error pages. Design Resources - Feb 5Browse by Category See all Banner Design See all Book Cover Design See all Branding & Corporate Identity See all Color Theory See all Creativity & Psychology

Think of common expressions and visuals that relate to something being lost and set the stage with them. Behance/Zach DaleyThis page takes one of these things and illustrates it, being stranded The example will use not_found.html. It might push any boundaries but it at least give you an idea of Dan's style, and encourages you to click through to the rest of his work.03. 404 Error Page Html Code Many, many things can be done with cameras in today’s tech laden world, so you can get incredibly creative with what and how you’re shooting. Dribbble/Evgeniy DolgovThis 404 page uses incredibly

It pulls together the message and makes more sense, rather than simply poking fun with an image and quippy one liner. Behance/Colin TossijnThis page is a great example of using relevant BloombergAbsolutely bonkers; Richard Turley, we salute youBloomberg's 404 page initially looks pretty ordinary, until it suddenly pans out from the 404 error into a bizarre animation involving an off-the-shelf 3D model Brilliantly executed and nicely interactive.17. this It relates with the messaging and further hones the motion home.30.

What is a 404 Error? 404 Page Not Found When someone follows a broken link or something, they dont stick around to fix the problem if they see a standard 404 page, they just leave. Use language that is friendly and inviting.Make sure your 404 page uses the same look and feel as the rest of your site.Consider adding links to your most popular articles or Media Temple offers three VPS hosting products.

404 Error Page Examples

Design Resources - Feb 26 60 Free Fonts for Minimalist Designs Design Resources - Nov 20 50 Free Headline Fonts Built For Impact And Audience En... What constitutes a 'page'? 404 Error Page Template Choosing to nestle the 404 text inside a magnifying glass is both literal and figurative. Error Page Template Bootstrap People often do typing mistakes and reach to your website on a non-existing page.

Further Reading Create WordPress 401 and 403 error pages WITHOUT using this plugin The Custom Error Pages Plugin official homepage. weblink You can use shapes as patterns and texture, or you can use them together to create a new shape. Behance/Manoj BhadanaOn this page, icons were used together to create another shape 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 & Improving the Dreaded 404 Error Message - An article by usability expert Jacob Nielsen on creating a user friendly custom error page. 500 Error Page

It adds a nice touch, and the zero is still clearly read as a zero.39. The colorful illustration is carried down into the text and creates little windows to peak through. Take liberties and stylize where you can. navigate here They help to pump up the interest in a simple black and white scheme.50.

Give it EdgeWhether it be sharp and angular in shape or in attitude, being edgy is incredibly popular and becoming more mainstream. Dribbble/Martin BonovThis page chose to be edgy with its 404 Error Message Text It shows creativity and a great attention to detail, so why not include it in your 404 page? Behance/kobietaThe illustration in this 404 page serves two purposes. The example will use the subdirectory errors/ (/home/00000/domains/example.com/html/errors/) for error documents.

Reproduction of materials found on this site, in any form, without explicit permission is prohibited.

Break Up TextDon’t feel required to use only text to translate information when it could be done with something more creative. Dribbble/Olia GozhaThis page carries the space theme into their text, Marketing Sales Where Marketers Go to Grow Subscribe Marketing Sales Agency Subscribe Please enter a valid email Please make a selection Thanks for subscribing! The path to your error document should be from the document root, regardless of whether you upload your .htaccess file to the document root directory or to a subdirectory. Error 404 Text Message Prank Replace example.com with your own domain name.

Use an icon in the place of text and it becomes much more readable. UnderbellyThis page uses a compass to let you know something’s up. These pages should go inside your html (/home/00000/domains/example.com/html/) directory or a subdirectory. Use OverlapOverlap shapes, letters, or colors to create interesting effects in your 404 pages. Behance/EvtimovThis page would have been a little too simple if it didn’t have the small overlap element. http://swirlvision.com/error-page/creative-error-page-design.html It is all about usability.

Implement some of these tips into your own page and you’ll be sure to have a 404 page worth sharing (it may even end up on a list like this one). Use MotionMotion can be created without actually making things move on the page. The subtle gradient helps cut any harshness that could be, and leaves this 404 page with a nice, happy brightness.43. A subfolder .htaccess file overrides a higher-level one. 401 Unauthorized - user is not logged into a password-protected area 403 Forbidden - browser does not have permission to perform the requested

Seriously cool.08. The "/" references the document root of your server (/home/00000/domains/example.com/html/httpdocs by default).