{"id":30686,"date":"2021-06-18T08:12:44","date_gmt":"2021-06-18T15:12:44","guid":{"rendered":"https:\/\/www.uxpin.com\/studio\/?p=30686"},"modified":"2023-03-20T08:02:03","modified_gmt":"2023-03-20T15:02:03","slug":"404-page-examples","status":"publish","type":"post","link":"https:\/\/www.uxpin.com\/studio\/blog\/404-page-examples\/","title":{"rendered":"10 Error 404 Page Examples for UX Design"},"content":{"rendered":"\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"512\" src=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/06\/10-error-404-page-examples-for-UX-design-1024x512.png\" alt=\"10 error 404 page examples for UX design\" class=\"wp-image-30687\" srcset=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/06\/10-error-404-page-examples-for-UX-design-1024x512.png 1024w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/06\/10-error-404-page-examples-for-UX-design-600x300.png 600w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/06\/10-error-404-page-examples-for-UX-design-768x384.png 768w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/06\/10-error-404-page-examples-for-UX-design.png 1200w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p>These 404 page examples show how designers can turn a simple computing error into a branded user experience (UX).<\/p>\n\n\n\n<p>The earliest models of personal computers had 64k RAM or less. Programmers needed to keep things simple. They developed a classification system for program functions. Input errors got assigned to class 400.<\/p>\n\n\n\n<p>There are four class 400 input errors.<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li><strong>400 Bad Request<\/strong>. The input is in the wrong syntax.<\/li>\n\n\n\n<li><strong>401 Unauthorized<\/strong>. The user cannot access without a username and password.<\/li>\n\n\n\n<li><strong>403 Forbidden<\/strong>. The user doesn\u2019t have permission to access the file.<\/li>\n\n\n\n<li><strong>404 Not Found<\/strong>. The user entered or linked to a URL that doesn\u2019t exist.<\/li>\n<\/ol>\n\n\n\n<p>In the old days, users had to type in the exact URL. For example, If you wanted to visit Yahoo Finance, you had to type in the full URL address: <a href=\"http:\/\/www.finance.yahoo.com\/\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">http:\/\/www.finance.yahoo.com<\/a><\/p>\n\n\n\n<p>If you \u201cfat-fingered\u201d the keyboard while entering the URL, you\u2019d get an error code 400 or 404.<\/p>\n\n\n\n<p>Nowadays, browsers let you enter an abbreviated address like <em>www.finance.yahoo.com<\/em> or even <em>finance.yahoo.com<\/em>. In fact, if you enter the full address in the search bar with the syntax in the example above, the browser will redirect you.<\/p>\n\n\n\n<p>Why? Because it\u2019s an old syntax using HTTP. The updated site is a more secure URL using HTTPS. The latest browsers automatically make the correction.<\/p>\n\n\n\n<p>The 404 error is now a landing page where you can encourage users to continue using your website. Your 404 page design should keep the user from leaving.<\/p>\n\n\n\n<p>Some elements you\u2019d use might be:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Hyperlinks to the home page and other useful pages.<\/li>\n\n\n\n<li>A search bar.<\/li>\n\n\n\n<li>Graphic elements that reflect the site\u2019s brand.<\/li>\n\n\n\n<li>A brief message to the user in the brand voice.<\/li>\n<\/ul>\n\n\n\n<p>In these 404 page examples, we\u2019ll look at how different brands use these UX elements.<\/p>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-404-page-examples-homepage-link\"><strong>404 page examples: homepage link<\/strong><\/h2>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-uxpin\"><strong>UXPin<\/strong><\/h3>\n\n\n\n<figure class=\"wp-block-image size-large is-resized\"><img decoding=\"async\" src=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2022\/08\/Zrzut-ekranu-2022-08-26-o-14.10.43-1024x589.png\" alt=\"404 page example\" class=\"wp-image-36390\" width=\"650\" srcset=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2022\/08\/Zrzut-ekranu-2022-08-26-o-14.10.43-1024x589.png 1024w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2022\/08\/Zrzut-ekranu-2022-08-26-o-14.10.43-522x300.png 522w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2022\/08\/Zrzut-ekranu-2022-08-26-o-14.10.43-768x442.png 768w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2022\/08\/Zrzut-ekranu-2022-08-26-o-14.10.43-1536x883.png 1536w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2022\/08\/Zrzut-ekranu-2022-08-26-o-14.10.43-2048x1177.png 2048w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>We\u2019ll look at our own 404 page first.<\/p>\n\n\n\n<p>As you can see, we like simplicity. We have lots of white space around outer-space-themed graphics. The message is simple, \u201cHey, Captain! Looks like you\u2019re heading to a wrong planet!\u201d<\/p>\n\n\n\n<p>We include a call-to-action (CTA) button that takes the user back to the home page.<\/p>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-google\"><strong>Google<\/strong><\/h3>\n\n\n\n<figure class=\"wp-block-image size-large is-resized\"><img decoding=\"async\" src=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2022\/08\/Zrzut-ekranu-2022-08-26-o-14.10.02-1024x453.png\" alt=\"Google error page\" class=\"wp-image-36388\" width=\"650\" srcset=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2022\/08\/Zrzut-ekranu-2022-08-26-o-14.10.02-1024x453.png 1024w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2022\/08\/Zrzut-ekranu-2022-08-26-o-14.10.02-678x300.png 678w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2022\/08\/Zrzut-ekranu-2022-08-26-o-14.10.02-768x340.png 768w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2022\/08\/Zrzut-ekranu-2022-08-26-o-14.10.02-1536x680.png 1536w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2022\/08\/Zrzut-ekranu-2022-08-26-o-14.10.02-2048x907.png 2048w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>Google\u2019s 404 page is also very simple and has lots of white space.<\/p>\n\n\n\n<p>\u201cThe requested URL was not found on this server. That\u2019s all we know.\u201d<\/p>\n\n\n\n<p>The broken-robot graphic reflects their high-tech brand. There\u2019s no CTA, and you only discover that the Google logo is a link back to the home page if you mouseover.<\/p>\n\n\n\n<p>A lot of UX writers will tell you that leaving out a CTA is a big no-no, and in most cases it is. Remember, you want visitors to keep using your site.<\/p>\n\n\n\n<p>Google is an exception because they know their visitors will always come back.<\/p>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-404-page-examples-useful-page-links\"><strong>404 page examples: useful page links<\/strong><\/h2>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-angi\"><strong>Angi<\/strong><\/h3>\n\n\n\n\n\n<p>Formerly HomeAdvisor, this home services contractor site has a lot of links to other useful pages.<\/p>\n\n\n\n<p>The message to the user is straightforward:<\/p>\n\n\n\n<p>\u201cYikes, this is awkward\u2026<\/p>\n\n\n\n<p>\u201cThe page you\u2019re looking for appears to have been moved, deleted, or doesn\u2019t exist. We apologize for the inconveniences.\u201d<\/p>\n\n\n\n<p>The CTA is a list of links to suggested pages.<\/p>\n\n\n\n<p>In the header, you also have links to home service types and blog posts.<\/p>\n\n\n\n<p>The footer has links to find services in major metropolitan areas like New York, Chicago, Los Angeles, and Dallas. Other useful links are in the footer as well.<\/p>\n\n\n\n<p>Angi keeps everything \u201cabove the fold.\u201d That is, you don\u2019t have to scroll to get to any of the links.<\/p>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-starbucks\"><strong>Starbucks<\/strong><\/h3>\n\n\n\n<p>In Starbuck&#8217;s 404 the image of a coffee ring where there used to be a cup stands as a metaphor for a page that\u2019s not there.&nbsp;<\/p>\n\n\n\n<p>It offers an explanation of what might have gone wrong and some suggestions about what to do next.<\/p>\n\n\n\n<p>It has a link where visitors can report broken links.<\/p>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-glassdoor-com\"><strong>Glassdoor.com<\/strong><\/h3>\n\n\n\n<p>Taking look at Glassdoor&#8217;s 404 page, the popular jobs board suggests several actions.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Search for jobs.<\/li>\n\n\n\n<li>Read employee reviews of companies.<\/li>\n\n\n\n<li>View employee salaries.<\/li>\n\n\n\n<li>See interview questions and answers.<\/li>\n\n\n\n<li>Look up rankings of best places to work.<\/li>\n<\/ul>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-404-page-examples-graphics-focused\"><strong>404 page examples: graphics focused<\/strong><\/h2>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-ebay\"><strong>eBay<\/strong><\/h3>\n\n\n\n<p>A photo of a child wearing a winter coat with the hood pulled over his eyes is the focal point of eBay\u2019s 404 page.&nbsp;<\/p>\n\n\n\n<p>\u201cWe looked everywhere.\u201d<\/p>\n\n\n\n<p>\u201cLooks like this page is missing. If you still need help, visit our help pages.\u201d<\/p>\n\n\n\n<p>Below is a CTA button taking the visitor to eBay\u2019s home page.<\/p>\n\n\n\n<p>The bottom of the page contains a scroll box with trending deals.<\/p>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-lego\"><strong>Lego<\/strong><\/h3>\n\n\n\n<p>When you land on this 404 page, you see Emmet from <em>The Lego Movie<\/em>. He\u2019s quoted as saying, \u201cEverything is still awesome.\u201d<\/p>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-404-page-examples-rotating-elements\"><strong>404 page examples: rotating elements<\/strong><\/h2>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-amazon-com\"><strong>Amazon.com<\/strong><\/h3>\n\n\n\n<p>Amazon\u2019s 404 page features the search bar at the top the message suggests a search or clicking the homepage link. It has a photo of one of the \u201cdogs of Amazon.\u201d It links to an Amazon news page about Amazon\u2019s dog-friendly workplace.&nbsp;<\/p>\n\n\n\n<p>If you refresh the page, an image of a different Amazon dog appears. Refresh several times and you\u2019ll see many random dog photos. We don\u2019t know how many they have for the 404 page, but more than 7,000 dogs \u201cwork\u201d for Amazon.<\/p>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-marvel-comics\"><strong>Marvel Comics<\/strong><\/h3>\n\n\n\n<p>Like Amazon, Marvel rotates multiple versions of its 404 page. They show images from the Marvel Comics universe with messages like:&nbsp;<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u201cProtocol missing\u2026 Exiting program\u2026\u201d<\/li>\n\n\n\n<li>\u201cHydra is currently attacking this page!\u201d<\/li>\n\n\n\n<li>\u201c$#&amp;%, you just broke something! Just kidding.\u201d<\/li>\n\n\n\n<li>\u201cNot even the eye of Nuatu sees your request.\u201d<\/li>\n\n\n\n<li>\u201cHydra has stolen this page from the S.H.I.E.L.D. database!\u201d<\/li>\n<\/ul>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-imdb\"><strong>IMDB<\/strong><\/h3>\n\n\n\n<p>Another rotating 404 page from the International Movie Database (IMDB). They stay on brand and offer familiarity to their fans by offering up movie quotes.&nbsp;<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u201cWebpages? Where we\u2019re going we don\u2019t need webpages.\u201d \u2013 Dr. Emmett Brown, <em>Back to the Future<\/em>.<\/li>\n\n\n\n<li>\u201cSomeday we\u2019ll find it\u2026 the website connection.\u201d \u2013 Kermit the Frog, <em>The Muppet Movie<\/em>.<\/li>\n\n\n\n<li>\u201cSurely, you can\u2019t be serious.\u201d \u201cI am serious. And don\u2019t call me Shirley.\u201d \u2013Ted Striker and Rummack, <em>Airplane<\/em>.<\/li>\n\n\n\n<li>\u201cWhat we\u2019ve got here&#8230; is a failure to communicate.\u201d \u2013 Captain, <em>Cool Hand Luke<\/em>.<\/li>\n\n\n\n<li>\u201cPage not found? INCONCEIVABLE!\u201d \u2013 Vizzini, <em>The Princess Bride<\/em>.<\/li>\n\n\n\n<li>\u201cI\u2019ve got a feeling we\u2019re not in Kansas anymore.\u201d \u2013 Dorothy, <em>The Wizard of Oz<\/em>.<\/li>\n<\/ul>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-prototype-your-404-page-in-uxpin\">Prototype Your 404 Page in UXPin<\/h2>\n\n\n\n<p>UXPin is a full-stack UX\/UI design program that gives you the tools to take any project from<a href=\"https:\/\/www.uxpin.com\/studio\/blog\/conceptual-model\/\" target=\"_blank\" rel=\"noreferrer noopener\"> concept<\/a> to product<a href=\"https:\/\/www.uxpin.com\/studio\/blog\/agile-ux-for-product-team-part-three-launching-your-product\/\" target=\"_blank\" rel=\"noreferrer noopener\"> launch<\/a> in a single app.<\/p>\n\n\n\n<p>When designing a 404 page, you can share with collaborators and stakeholders in real-time straight from the platform. They can add their comments to make iterations smoother, instead of lots of back-and-forth emails. Start your<a href=\"https:\/\/www.uxpin.com\/sign-up\" target=\"_blank\" rel=\"noreferrer noopener\"> free trial<\/a> today.<\/p>\n\n\n\n<div class=\"wp-block-button is-style-fill\"><center><a class=\"btn btn-flat btn-large btn-content-width\" href=\"https:\/\/www.uxpin.com\/sign-up\" target=\"_blank\" rel=\"noopener\">Try UXPin for free<\/a><\/center><\/div>\n","protected":false},"excerpt":{"rendered":"<p>These 404 page examples show how designers can turn a simple computing error into a branded user experience (UX). The earliest models of personal computers had 64k RAM or less. Programmers needed to keep things simple. They developed a classification system for program functions. Input errors got assigned to class 400. There are four class<\/p>\n","protected":false},"author":3,"featured_media":30687,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3],"tags":[425,424],"class_list":["post-30686","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog","tag-404-page-examples","tag-design-examples"],"yoast_title":"","yoast_metadesc":"These error 404 page examples show how they can function as a landing page to keep visitors engaged with your website.","acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v27.4 (Yoast SEO v27.4) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>10 Error 404 Page Examples for UX Design | UXPin<\/title>\n<meta name=\"description\" content=\"These error 404 page examples show how they can function as a landing page to keep visitors engaged with your website.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.uxpin.com\/studio\/blog\/404-page-examples\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"10 Error 404 Page Examples for UX Design\" \/>\n<meta property=\"og:description\" content=\"These error 404 page examples show how they can function as a landing page to keep visitors engaged with your website.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.uxpin.com\/studio\/blog\/404-page-examples\/\" \/>\n<meta property=\"og:site_name\" content=\"Studio by UXPin\" \/>\n<meta property=\"article:published_time\" content=\"2021-06-18T15:12:44+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-03-20T15:02:03+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/06\/10-error-404-page-examples-for-UX-design.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"600\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"UXPin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@uxpin\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"UXPin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/404-page-examples\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/404-page-examples\\\/\"},\"author\":{\"name\":\"UXPin\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#\\\/schema\\\/person\\\/e0326509b38ce2a3ce62e40ddde9cf8e\"},\"headline\":\"10 Error 404 Page Examples for UX Design\",\"datePublished\":\"2021-06-18T15:12:44+00:00\",\"dateModified\":\"2023-03-20T15:02:03+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/404-page-examples\\\/\"},\"wordCount\":1121,\"image\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/404-page-examples\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/wp-content\\\/uploads\\\/2021\\\/06\\\/10-error-404-page-examples-for-UX-design.png\",\"keywords\":[\"404 page examples\",\"design examples\"],\"articleSection\":[\"Blog\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/404-page-examples\\\/\",\"url\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/404-page-examples\\\/\",\"name\":\"10 Error 404 Page Examples for UX Design | UXPin\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/404-page-examples\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/404-page-examples\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/wp-content\\\/uploads\\\/2021\\\/06\\\/10-error-404-page-examples-for-UX-design.png\",\"datePublished\":\"2021-06-18T15:12:44+00:00\",\"dateModified\":\"2023-03-20T15:02:03+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#\\\/schema\\\/person\\\/e0326509b38ce2a3ce62e40ddde9cf8e\"},\"description\":\"These error 404 page examples show how they can function as a landing page to keep visitors engaged with your website.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/404-page-examples\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/404-page-examples\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/404-page-examples\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/wp-content\\\/uploads\\\/2021\\\/06\\\/10-error-404-page-examples-for-UX-design.png\",\"contentUrl\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/wp-content\\\/uploads\\\/2021\\\/06\\\/10-error-404-page-examples-for-UX-design.png\",\"width\":1200,\"height\":600,\"caption\":\"10 error 404 page examples for UX design\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/404-page-examples\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"10 Error 404 Page Examples for UX Design\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#website\",\"url\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/\",\"name\":\"Studio by UXPin\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#\\\/schema\\\/person\\\/e0326509b38ce2a3ce62e40ddde9cf8e\",\"name\":\"UXPin\",\"description\":\"UXPin is a web-based design collaboration tool. We\u2019re pleased to share our knowledge here.\",\"sameAs\":[\"http:\\\/\\\/www.uxpin.com\",\"https:\\\/\\\/x.com\\\/@uxpin\"],\"url\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/author\\\/hello\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"10 Error 404 Page Examples for UX Design | UXPin","description":"These error 404 page examples show how they can function as a landing page to keep visitors engaged with your website.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.uxpin.com\/studio\/blog\/404-page-examples\/","og_locale":"en_US","og_type":"article","og_title":"10 Error 404 Page Examples for UX Design","og_description":"These error 404 page examples show how they can function as a landing page to keep visitors engaged with your website.","og_url":"https:\/\/www.uxpin.com\/studio\/blog\/404-page-examples\/","og_site_name":"Studio by UXPin","article_published_time":"2021-06-18T15:12:44+00:00","article_modified_time":"2023-03-20T15:02:03+00:00","og_image":[{"width":1200,"height":600,"url":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/06\/10-error-404-page-examples-for-UX-design.png","type":"image\/png"}],"author":"UXPin","twitter_card":"summary_large_image","twitter_creator":"@uxpin","twitter_misc":{"Written by":"UXPin","Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.uxpin.com\/studio\/blog\/404-page-examples\/#article","isPartOf":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/404-page-examples\/"},"author":{"name":"UXPin","@id":"https:\/\/www.uxpin.com\/studio\/#\/schema\/person\/e0326509b38ce2a3ce62e40ddde9cf8e"},"headline":"10 Error 404 Page Examples for UX Design","datePublished":"2021-06-18T15:12:44+00:00","dateModified":"2023-03-20T15:02:03+00:00","mainEntityOfPage":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/404-page-examples\/"},"wordCount":1121,"image":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/404-page-examples\/#primaryimage"},"thumbnailUrl":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/06\/10-error-404-page-examples-for-UX-design.png","keywords":["404 page examples","design examples"],"articleSection":["Blog"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.uxpin.com\/studio\/blog\/404-page-examples\/","url":"https:\/\/www.uxpin.com\/studio\/blog\/404-page-examples\/","name":"10 Error 404 Page Examples for UX Design | UXPin","isPartOf":{"@id":"https:\/\/www.uxpin.com\/studio\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/404-page-examples\/#primaryimage"},"image":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/404-page-examples\/#primaryimage"},"thumbnailUrl":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/06\/10-error-404-page-examples-for-UX-design.png","datePublished":"2021-06-18T15:12:44+00:00","dateModified":"2023-03-20T15:02:03+00:00","author":{"@id":"https:\/\/www.uxpin.com\/studio\/#\/schema\/person\/e0326509b38ce2a3ce62e40ddde9cf8e"},"description":"These error 404 page examples show how they can function as a landing page to keep visitors engaged with your website.","breadcrumb":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/404-page-examples\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.uxpin.com\/studio\/blog\/404-page-examples\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.uxpin.com\/studio\/blog\/404-page-examples\/#primaryimage","url":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/06\/10-error-404-page-examples-for-UX-design.png","contentUrl":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/06\/10-error-404-page-examples-for-UX-design.png","width":1200,"height":600,"caption":"10 error 404 page examples for UX design"},{"@type":"BreadcrumbList","@id":"https:\/\/www.uxpin.com\/studio\/blog\/404-page-examples\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.uxpin.com\/studio\/"},{"@type":"ListItem","position":2,"name":"10 Error 404 Page Examples for UX Design"}]},{"@type":"WebSite","@id":"https:\/\/www.uxpin.com\/studio\/#website","url":"https:\/\/www.uxpin.com\/studio\/","name":"Studio by UXPin","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.uxpin.com\/studio\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/www.uxpin.com\/studio\/#\/schema\/person\/e0326509b38ce2a3ce62e40ddde9cf8e","name":"UXPin","description":"UXPin is a web-based design collaboration tool. We\u2019re pleased to share our knowledge here.","sameAs":["http:\/\/www.uxpin.com","https:\/\/x.com\/@uxpin"],"url":"https:\/\/www.uxpin.com\/studio\/author\/hello\/"}]}},"_links":{"self":[{"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/posts\/30686","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/comments?post=30686"}],"version-history":[{"count":7,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/posts\/30686\/revisions"}],"predecessor-version":[{"id":43825,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/posts\/30686\/revisions\/43825"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/media\/30687"}],"wp:attachment":[{"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/media?parent=30686"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/categories?post=30686"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/tags?post=30686"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}