跳到主要内容

404页:查看周围最好的错误页。

+$Creating 404 pages might not be the first thing you'll think about when making a website, but they are essential. While a 404 page is something that you ideally don't want visitors to see, the best ones turn the situation to the designer or brand's advantage.

+$More and more, we're seeing bespoke 404 pages that use wit, clever UX or beautiful design to sweeten the pill of finding yourself in the wrong place. Whether its some thoughtfulCSS动画+$, A Cool视差滚动+$effect, or just some smarter-than-your-average copy, there are plenty of ways to liven up your 404 error pages – as these examples prove.

+$The best 404 pages can become a mini-ambassador for the website itself. They might even be shared on Twitter or relevant blogs as an example of the site's commitment to customer service or unique design style. The 404 error pages we present here have achieved all this and more, so take a look and be inspired to think outside the box with your own.

+$01. Ready to go survival

404 pages: ready to go survival

+$(Image credit: Ready to go survival)

+$We all love a good movie reference within a 404 page (and there are several of them included in our list). This survival site refers to The Matrix in+$its 404 Page+$and gives you two options: clicking the red or the blue pill. Naturally, both keep you on the site.

+$02. Carwow

404 page: carwow

+$(Image Credit: Carwow)

+$This car buying comparison site helps you find the perfect car, but when you go off course, its 404 page provides a clever on-theme way to keep you on site. Visitors are presented with an 8-bit game style screen. All you need to do is hit the Start text to enjoy the simple horizontal scrolling game, where all you need to do is avoid obstacles and other cars.+$Give to a try

+$03. Color of the Year

404 page: Pantone

+$(Image Credit: Pantone)

+$This site is dedicated to everything to do with PANTONE's Color of the Year. Everything about it has been beautifully designed, including its 404 page. The site goes into an impressive amount of depth, with sections on relevant colour systems, suggested palettes, and examples of the shade in use. Meanwhile, the 404 page takes a smart-but-simple approach. There's a short explanatory message and a swatch of PANTONE shade 404, which is a delightfully appropriate grey-brown, to match the user's mood when finding themselves there.

04.上野

+$Image: Ueno

+$Ueno is a full-service agency with a standout 404 page. What you're seeing above doesn't capture the full effort that's gone into it: the hotdog is animated so it runs in an infinite loop through a surreal landscape, and there are several hilarious explanatory messages to explore. It's bonkers and totally unique –+$visit the error page here.

+$05. Gymbox

+$Gym Box is a gym company that aims to offer "the most unique and diverse classes in London". The limits of that claim might be the kind of magnificent '80s fitness spectacle that appears on its 404 page. Short shorts, crop tops and pelvic thrusting – what more could you want from an error page?

+$06. Slack

404 page: Slack

+$Image: Slack

+$It's only a slight exaggeration to say that Slack's+$2019 Logo Update+$was met with widespread horror, and its super-saccharine 404 page is sure to have its fair share of haters too. Go wrong in Slack, and you're directed to a magical landscape of lush foliage, mountains and rainbows, where butterflies, chickens and tiny little pigs roam free. The scene scrolls horizontally with your mouse movement, too (+$try It Here)。

+$07. Purée Maison

+$Purée Maison is a creative agency specialising in communication strategy, and its characterful website is full of delightful animations (we'd recommend+$taking a look around+$). We're particular fans of this surreal 404 page, which somehow manages to perfectly capture the pain of hitting a digital wall.

+$08. Pixar

404 page: Pixar

+$Image: Pixar

有些人可能会把事情放在心上太多。皮克斯的404页面,以2015年极受欢迎的Inside Out为特色的Sadness,简单明了,完成了工作。如果它代表你对404错误的反应,那么也许你需要重新审视一下你的生活。

+$09. Matteo Vandelli

+$You don't need to be a major brand to put a bit of effort into your 404 page. We love+$this Interactive Example+$from graphic designer Matteo Vandelli. He's used the error page from his设计组合作为展示他的创造力和设计精明的另一个机会。当访客将鼠标移到404文本上时,它会像水一样涟漪和变化。效果奇怪地令人着迷。

+$10. 20th Century Fox

404 page: 20th Century Fox

+$Can't find the film you want? Fox Movies' site has a great way to inspire you for when you get a URL wrong; its 404 page pops up with a still from a cult movie, with a pithy caption and a selection of other films you might like to watch. We've spotted snippets from Edward Scissorhands, Revenge of the Nerds and Napoleon Dynamite, amongst others (瞧一瞧+$to see which one you get).

+$11. Cloud Sigma

404 page: cloud sigma

Cloud Sigma是一个云服务器和云托管服务于美国,欧洲和亚太地区。虽然灵活的云服务器非常有用,但它们并不是很有趣,我们猜测这就是为什么该公司已经做了一些额外的努力,将一些幽默注入其诙谐的404错误页面。我们想知道这个看起来很有帮助的初级开发者在竞争中被挖走之前会有多长时间。

+$12. BluePath

bluepath 404 page

另一个在404错误页面上使用幽默的网站是位于亚特兰大的数据战略咨询公司BluePath。该页面显示了亚特兰大的地图,在页面的另一侧有一个点,表示访客是“Wayyyy off the map”。在一个非常脆弱的环节中,该地图还包括数据驱动的信息,显示该地区报告的犯罪情况。 “为什么?因为这是一种犯罪,你还没有雇用我们!”啊,这些笨拙的数据分析师。

+$13. Marvel

Marvel基于宇宙观察者的404错误页面,将事物牢牢地保持在品牌上。也许是因为Uatu并不是一个观察者(对不起),Marvel决定迎合比我们更浅的游客,并且只在Black Widow的背景下加入他的眼睛。让眼睛跟随访客的光标围绕屏幕的额外酷点。

+$14. Kualo

虚拟主机Kualo公司已有超过15年的经营历史 - 在互联网时代永恒 - 其404页的历史可以追溯到过去以Kualo为主题的太空入侵者游戏。这不完美。对于初学者来说,挑选舰队外缘以减缓入侵者下降的关键策略是行不通的。但它很有趣,如果你得分超过1000分,它可以为你的托管交易折扣。+$Play It Here

它包含在这篇文章中也激发了美国害虫控制公司Pointe Pest Control将自己的Pest Invaders游戏纳入其中它的404错误页面,配有不同的飞行和爬行虫来喷雾。

正如Pointe的Chloe Zollinger所说:“对于网站用户来说,达到404错误页面通常是令人沮丧的。我们了解网页用户体验的重要性。为了更好地吸引访问者的体验,我们的团队致力于创建一个互动游戏。我们的404页面。“

+$15. Waaark

404 page: waark

+$French studio Waaark's 404 page is nice enough to look at, but it's better to listen to – although maybe not at work. Inspired by Stephen Hawking, the Hitchhiker's Guide to the Galaxy and Portal, it uses a JavaScript text-to-speech tool called meSpeak to subject you to a sweary robotic tirade. Plug your headphones in and瞧一瞧

+$16. Steve Lambert

+$New York-based artist Steve Lambert describes this as "the most awkward 404 not found page on the internet", and you know, he may well be right. It features an excruciating+$piece To Camera+$that just goes on and on. We defy you to get to the end of his video without any part of your body clenching.

+$Next page: More inspiring 404 pages to explore



翻译字数超限