30 ตัวอย่างหน้าข้อผิดพลาด HTTP 404 ที่โดดเด่นและสร้างสรรค์ 2021

เผยแพร่แล้ว: 2021-05-12

การค้นหาทางอินเทอร์เน็ตของคุณปรากฏขึ้นเป็นระยะๆ กับข้อความที่อ่านว่า “ข้อผิดพลาด HTTP 404” สิ่งนี้อาจเกิดขึ้นเมื่อหน้าที่คุณค้นหามีการเปลี่ยนแปลง ย้าย หรือไม่พบลิงก์บนเซิร์ฟเวอร์ หรืออาจถูกลบออกไปโดยสิ้นเชิง บางทีคุณอาจพิมพ์ URL ผิดด้วยซ้ำ ไม่ว่าจะด้วยเหตุผลใดก็ตาม คุณหลงทางบนอินเทอร์เน็ตไฮเวย์ และข้อความแสดงข้อผิดพลาด 404 คือวิธีการแจ้งให้คุณทราบ

ในกรณีที่คุณไม่เคยพบข้อความแบบนี้มาก่อน คุณสามารถลองทำสิ่งนี้: พิมพ์ URL ของเว็บไซต์ใด ๆ และทำตาม '/' ที่ท้ายด้วยข้อความที่ไม่มีความหมาย ข้อผิดพลาดดังกล่าวหลีกเลี่ยงไม่ได้ ลิงก์เสีย URL ที่ไม่เปลี่ยนแปลง และสาเหตุอื่นๆ มากมายอาจทำให้ไซต์ของคุณแสดงข้อผิดพลาด 404 การทำเช่นนี้อาจสร้างความรำคาญให้กับผู้เข้าชมได้อย่างแท้จริง และจะทำให้เขาต้องการย้ายออกจากไซต์ของคุณ อย่างไรก็ตาม มันไม่จำเป็นต้องเป็นอย่างนั้น คุณสามารถออกแบบหน้าแสดงข้อผิดพลาด 404 ได้ด้วยความเอาใจใส่เล็กน้อย เพื่อที่มันจะจุดประกายความสนใจหรือความสนุกสนานให้กับผู้เยี่ยมชม ซึ่งจะทำให้เมาส์ของพวกเขาค้างอยู่บนเว็บไซต์ของคุณอีกเล็กน้อย ความสนุกดังกล่าวสามารถทิ้งความทรงจำที่ดี และอาจทำให้พวกเขาอยากกลับมาอีกครั้งในภายหลัง

ดังนั้นจึงควรออกแบบหน้าแสดงข้อผิดพลาดด้วยความระมัดระวัง การเปลี่ยนเส้นทางผู้มาเยี่ยม ช่วยเขาดำเนินการค้นหาของเขาหรือเพียงแค่นำรอยยิ้มมาสู่ใบหน้าของเขาจะช่วยให้มั่นใจได้ว่าการมาเยี่ยมซ้ำ วิธีจินตนาการบางอย่างที่หน้าข้อผิดพลาด 404 ได้รับการออกแบบในบางเว็บไซต์จะเน้นในตัวอย่างที่ตามมา

Maxemail

emailcenteruk-404-not-found-error-example
Maxemail เดิมคือ Email Center UK ให้บริการการตลาดผ่านอีเมล บนเว็บไซต์ คุณจะเข้าใจว่าการตลาดผ่านอีเมลไม่ได้เป็นเพียงแบบฝึกหัดในการสร้างรายชื่อ หน้าแสดงข้อผิดพลาดของเว็บไซต์นี้มีสมาชิกในทีมพัฒนาชี้กันและกันว่าใครควรถูกไล่ออกจากงาน คุณจะได้เห็นทางกลับบ้านพร้อมลิงค์ไปยังหน้าแรก

โนวัค ยอโควิช

novakdjokovic-creative-404-error-page-example
อารมณ์ขันนอกสนามของนักเทนนิสอาชีพคนนี้มีให้เห็นในหน้า 404 ของเว็บไซต์ของเขา เขาถามผู้เยี่ยมชมว่าพวกเขากำลังมองหาลูกบอลที่หายไปหรือไม่ จากนั้นคุณจะถูกนำกลับไปที่เมนู

ปลากระพง

limpfish-minimal-error-404-page-example
นี่คือเว็บไซต์ของ David Barton ศิลปิน หน้า 404 มีไหวพริบและกำหนดไว้ในรูปแบบของโฆษณาย่อย โดยมีตำนาน 'ไม่พบไฟล์' ค้นหาสถานที่ในช่องซึ่งปกติจะสงวนไว้สำหรับหมายเลขโทรศัพท์ติดต่อ

ซุปเปอร์เลิฟเวอร์

superlovers-server-404-error-page-example
นี่คือเว็บไซต์ของครีเอทีฟสตูดิโอในฝรั่งเศสที่ออกแบบทั้งในรูปแบบสิ่งพิมพ์และดิจิทัล หน้าข้อผิดพลาดแจ้งให้คุณทราบว่าเทวดามีตู้โทรศัพท์ แม้ว่าคุณจะสามารถเข้าถึงเมนูจากหน้านี้และหาทางกลับบ้านได้

อินคอร์

incore-minimal-404-not-found-error-example
Incore เป็นหน่วยงานด้านการตลาดดิจิทัล หน้า 404 ของพวกเขาเป็นการล้อเลียนที่มีภาพของแร้งที่เป็นลางไม่ดีสองตัวและขอให้ผู้เยี่ยมชมที่หลงทางว่าพวกเขากำลังมองหาพวกเขาจริงๆหรือว่าพวกเขาต้องการกลับบ้านหรือไม่

AndroidDev101

androiddev101-not-found-error-example
ในเว็บไซต์นี้ เราสามารถติดตามเหตุการณ์ต่างๆ ในโลกของแอนดรอยด์ได้ หน้า 404 ในเว็บไซต์นี้เตือนคุณเกี่ยวกับการขาดทักษะการนำทางที่นำคุณไปยังหน้าข้อผิดพลาดตั้งแต่แรก

Foxrate

foxrate-not-found-error-example
Foxrate เสนอแอปพลิเคชันบนเบราว์เซอร์ฟรีสำหรับรวบรวมบทวิจารณ์ของลูกค้าจากช่องทางการขายต่างๆ สุนัขตัวเล็ก ๆ แอบดู '0' ใน 404 เพื่อบอกคุณว่าไม่พบสุนัขจิ้งจอกในหน้าข้อผิดพลาด

ตัวแทน

ตัวแทนหายไปหน้าข้อผิดพลาดตัวอย่าง
เอเจนส์อยู่ในธุรกิจที่มีแนวคิดดิจิทัลที่สดใสและเปลี่ยนให้เป็นผลิตภัณฑ์ที่ใช้งานได้ พวกเขามีนักบินอวกาศหลงทางในอวกาศ เดินไปมาและถือธง 404 คำอธิบายภาพแนะนำให้คุณดูโครงการล่าสุด

เบื่อแพนด้า

เบื่อpanda-404-error-page-example
Bored Panda เป็นชุมชนสำหรับคนที่มีความคิดสร้างสรรค์ มีส่วนเกี่ยวกับศิลปะ การถ่ายภาพ และการออกแบบ แพนด้าสาบานในหน้า 404 ว่าเขาไม่ได้กินหน้าที่คุณกำลังหาจนหมด โฆษณาจะอยู่ทางด้านขวา และเมนูยังคงอยู่ที่ด้านบนของหน้า

การแพร่ภาพขยาย

Expansionbroadcast-error-page-example
พอดคาสต์ออกจากเว็บไซต์นี้และแสดงรายการเพลงที่นี่ หน้า 404 นี้ใช้เวลาขุดและเรียกคุณว่าถุงใส่ยาและภูมิใจที่ได้นำเสนอในนิตยสาร Smashing

กัปตันแดช

Captaindash-dark-404-error-example-page
Captain Dash เป็นเว็บไซต์ที่ให้บริการจัดการข้อมูล แอพช่วยแปลงข้อมูลที่น่าเบื่อทั้งหมดให้เป็นข้อมูลที่มีความหมาย หน้าแสดงข้อผิดพลาดนั้นค่อนข้างเรียบง่าย และจะถามคุณว่ากำลังมองหา Captain Dash อยู่หลังเวทีหรือไม่ คุณสามารถส่งอีเมลจากหน้านี้หรือกลับไปที่หน้าแรกได้

ลูกแพร์แปลก

oddpears-funny-404-error-page-example
Odd Pears จำหน่ายถุงเท้าคุณภาพที่ออกแบบอย่างสร้างสรรค์ พูดง่ายๆ ก็คือถุงเท้าที่ไม่เข้าคู่กันอย่างสวยงามซึ่งแสดงถึงความเป็นตัวของตัวเอง หน้าข้อผิดพลาด 404 แสดงการสาบานถุงเท้าหลังจากเจาะรูที่หัวแม่ตีนและทำให้คุณกลัวว่าคุณเชื่อว่าคุณทำลายเว็บไซต์ของพวกเขา

เอสปรี

wearespy-not-found-404-error-page-example
Espri อธิบายตนเองว่าเป็นศิลปิน ผู้สร้าง และผู้มีวิสัยทัศน์ของโลกดิจิทัล หน้า 404 ของพวกเขามีสุนัขน่ารักที่ดูสับสนและแสดงสีหน้านิ่ง โดยมีปุ่มเรียกร้องให้ดำเนินการเพื่อแนะนำให้ผู้มาเยี่ยมกลับบ้าน

Petfinder

petfinder-creative-not-found-error-page-example
Petfinder เป็นเว็บไซต์ที่ช่วยให้สัตว์หายหาบ้านที่จะรับพวกมัน คุณสามารถใช้เกณฑ์การค้นหาและหาสัตว์เลี้ยงที่จะนำมาใช้ในหน้าแรกได้ หากคุณหลงทางในการทำเช่นนี้ คุณจะเห็นแมวตัวหนึ่งติดอยู่กับผ้าขนสัตว์ถักทอหรือเพื่อนจงอยปากกรีดร้องใส่คุณ และคุณจะถูกนำกลับไปที่หน้าแรก เมนู โพสต์ และปุ่มคำกระตุ้นการตัดสินใจในแถบด้านข้างจะแสดงในหน้าข้อผิดพลาดด้วย

CloudSigma

cloudsigma-404-funny-error-page-example
CloudSigma เป็นที่เก็บข้อมูลบนคลาวด์ หากคุณหลงทางในเว็บไซต์นี้ คุณจะได้พบกับนักพัฒนารุ่นเยาว์ของพวกเขา อันที่จริงเขาเป็นแมวที่นอนบนโซฟาเป็นส่วนใหญ่ แต่ก็ยังหาเวลาเขียนโค้ดอยู่บ้าง

Bitly

bitly-404-error-page-example
Bitly เป็นตัวย่อ URL และแพลตฟอร์มการจัดการลิงก์ ปลาที่ลอยกลับหัวในหน้าข้อผิดพลาดจะแสดงให้คุณเห็นว่ามีบางอย่างผิดปกติที่นี่ ข้อมูลที่เป็นประโยชน์เกี่ยวกับ URL จะได้รับในหน้านี้ด้วย

FlixelPix

flixelpix-nothing-found-error-example
อย่างที่คุณอาจเดาได้ FlixelPix เป็นเว็บไซต์สำหรับการถ่ายภาพโดยเฉพาะ หน้าเว็บจะแสดงข้อความแสดงข้อผิดพลาดโดยสมบูรณ์ พร้อมคำแนะนำในการค้นหา ในขณะเดียวกัน ช่องค้นหาที่เป็นประโยชน์ก็อยู่ใกล้แค่เอื้อม

Swissmiss

swiss-miss-simple-404-error-page-example
Swissmiss เป็นสตูดิโอออกแบบของ Tina Roth ในหน้าแสดงข้อผิดพลาด เธอถูกมองเห็นผ่านรูบนผืนผ้าใบเพื่อบอกให้ผู้เยี่ยมชมเริ่มการค้นหาจากที่นั่นหรือให้กลับไปที่หน้าแรก

Woothemes

woothemes-error-404-page-example
Woothemes เป็นที่สำหรับซื้อธีมและปลั๊กอินของ WordPress พวกเขาเป็นผู้เขียนปลั๊กอิน WooCommerce ยอดนิยม นินจาที่มีดาบหักช่วยให้คุณรู้ว่าคุณได้ลงจอดบนหน้าข้อผิดพลาดของพวกเขา และช่องค้นหาที่โดดเด่นจะช่วยให้คุณค้นหาต่อไปได้

Studio7 Designs

studio7designs-error-page-example
Studio7 ออกแบบแอปพลิเคชั่นมือถือและส่วนต่อประสานผู้ใช้ที่ตอบสนอง ภาพเงาของหมีทำให้คุณรู้ว่าคุณมาผิดที่

ช้อนกราฟิก

spoongraphics-404-not-found-error-page-example
Spoon Graphics เป็นบล็อกของ Chris Spooner ที่ช่วยผู้อื่นสร้างงานออกแบบสุดเจ๋ง ความคิดสร้างสรรค์นั้นปรากฏชัดในหน้าแสดงข้อผิดพลาด ซึ่งดูเหมือนว่าคุณได้เปิดทีวีผิดความถี่และแจ้งให้คุณโทรหาวิศวกรเพื่อแก้ไข หรือคุณสามารถเลือกที่จะย้ายกลับไปที่หน้าแรกหรือที่เก็บถาวรได้

นอกเขตสบาย

outofcomfortzone-creative-404-error-page
Out of Comfort Zone เป็นบล็อกของ Frederic Harper นักเทคโนโลยีและผู้ประกอบการต่อเนื่อง เขาสวมหมวกหลายใบและกระตือรือร้นที่จะเผยแพร่เทคโนโลยี หน้าแสดงข้อผิดพลาดของเขามีการออกแบบที่ชาญฉลาด โดยแสดงให้เห็นปลาที่โผล่พ้นน้ำออกจากเขตปลอดภัย คุณสามารถกดปุ่มใดก็ได้เพื่อย้ายออกจากหน้า

Jess Marks Photography

jessmarksphotography-page-not-found-error-404
Jess and Marks เป็นช่างภาพงานแต่งงาน พวกเขาทำให้หน้าแสดงข้อผิดพลาดเรียบง่าย โดยใช้พื้นหลังสีเทาเฉดสีและตัวอักษรที่โดดเด่นเพื่อแจ้งให้คุณทราบว่าคุณอยู่ในหน้าที่ไม่ถูกต้อง ดังนั้น คุณจะได้รับแจ้งให้กลับไปที่เมนูหรือไปยังบล็อกของพวกเขา

อาดัม แดนนาเวย์

adhamdannaway-not-found-error-page-example
Adham Dannaway เป็นนักออกแบบและนักพัฒนาส่วนหน้า หน้าข้อผิดพลาดของเขาไม่ใช่การทำงานปกติของโรงสี มันมี Yoda โผล่ออกมาจากหน้าจอเดสก์ท็อปและข้อความนั้นเขียนราวกับว่าอาจารย์เจไดกำลังพูดอยู่

ช่วยชีวิต

lifesupport-error-page-example
Life Support เป็นชื่อของเครื่องดื่มที่จัดการกับอาการเมาค้าง หน้าข้อผิดพลาดของพวกเขากล่าวโทษผู้เยี่ยมชมว่าทำอินเทอร์เน็ตล่ม

Avioa

avioa-page-not-found-404-error-page
Avioa คือการตั้งค่าการให้คำปรึกษาที่ช่วยในเรื่องกลยุทธ์ทางธุรกิจ พวกเขาทิ้งคำเชิญให้คุณในหน้าข้อผิดพลาดเพื่อติดต่อกับพวกเขา

นักออกแบบเว็บไซต์ที่ 1

1stwebdesigner-404-error-page-example
นี่คือบริษัทออกแบบเว็บไซต์หลักที่เปลี่ยนโฟกัสไปที่ระบบจัดการเนื้อหาของ WordPress พวกเขาบอกคุณว่าคุณอยู่ผิดหน้าด้วยความจริง ไม่ใช่ทุกคนที่หลงทางจะหลงทาง จากหน้านี้ คุณสามารถไปยังที่เก็บถาวร เริ่มการค้นหา หรือกลับไปที่หน้าแรก

มาร์กาเร็ต โช

margaretcho-simple-404-error-page
Margaret Cho เป็นนักแสดงตลกและบุคลิกทางทีวีที่แสดงสดเช่นกัน หน้าแสดงข้อผิดพลาดบนเว็บไซต์ของเธอบอกคุณว่าสามารถหายได้ และมาร์กาเร็ตก็หลงทางในบางครั้งเช่นกัน

ซิลเวสเตอร์ สตอลโลน

sylvesterstallone-404-error-page-example
ซิลเวสเตอร์ สตอลโลนเป็นนักแสดงที่ก้าวไปสู่บทบาทอื่นๆ ในการสร้างภาพยนตร์ เขาสุภาพในหน้าข้อผิดพลาดและเสนอที่จะพาคุณกลับ หรือคุณสามารถเรียกดูเมนูจากหน้าข้อผิดพลาดได้เช่นกัน

เปิดเผยความลับของเว็บโฮสติ้ง

webhostingsecretrevealed-error-page-example
เว็บไซต์นี้กล่าวถึงตัวเลือกการโฮสต์สำหรับเว็บไซต์และบทวิจารณ์ด้วยเช่นกัน หน้าแสดงข้อผิดพลาดมี Grumpy Cat ที่อ้างว่ากินหน้าเป็นภาษาอังกฤษที่ไม่ถูกต้องตามหลักไวยากรณ์

หน้าแสดงข้อผิดพลาดที่แสดงตัวอย่างบางส่วนด้านบนต้องดึงดูดความสนใจของคุณไม่ทางใดก็ทางหนึ่ง บางทีคุณอาจให้เราดูหน้าข้อผิดพลาดของคุณด้วยก็ได้