Menjalankan situs web yang sukses berarti tetap waspada terhadap kesalahan seperti halaman yang rusak atau kinerja yang lambat. Namun, terkadang ada masalah yang tidak dapat Anda hindari, dan kesalahan 404 adalah salah satunya.
404 terjadi ketika pengguna meminta halaman di situs web Anda yang tidak ada, sehingga memunculkan halaman kesalahan 404 yang mendorong pengguna untuk kembali ke tempat yang tepat. Tidak peduli berapa banyak sumber daya yang Anda masukkan untuk memastikan situs web Anda tidak pernah mati … selalu ada kemungkinan bahwa pengguna dapat berakhir di sini.
Ini tidak nyaman, tetapi fakta kehidupan. Dan reaksi pengunjung ketika mereka mendarat di halaman yang tidak ada dapat berkisar dari “menerimanya dengan tenang” hingga “benar-benar kehilangan akal.”
Meskipun tidak ada yang dapat Anda lakukan tentang yang terakhir, Anda dapat membuat hal-hal sedikit kurang sakit dengan memiliki pesan kesalahan 404 kreatif. Ini dapat melakukan keajaiban untuk membuat pengunjung situs web Anda tersenyum dalam situasi yang membuat frustrasi.
Untuk membuat jus desain situs web Anda mengalir, posting ini akan menampilkan beberapa halaman kesalahan situs web favorit kami. Mudah-mudahan, Anda dapat mengambil beberapa ide untuk membuat pesan 404 Anda sendiri.
Apa itu Kesalahan 404?
Kesalahan 404 adalah kode pesan kesalahan HTTP standar yang berarti situs web yang Anda coba jangkau tidak dapat ditemukan di server. Ini adalah kesalahan sisi klien, yang berarti halaman web telah dihapus atau dipindahkan dan URL tidak diubah sebagaimana mestinya, atau orang tersebut salah mengetikkan URL.
Untuk sebagian besar, Anda dapat mengonfigurasi server Anda untuk membuat halaman kesalahan 404 yang disesuaikan. (Jika Anda pelanggan HubSpot, klik di sini untuk mempelajari cara menyesuaikan halaman 404 Anda di HubSpot.)
Beberapa halaman kesalahan 404 yang disesuaikan mencakup gambar pahlawan, deskripsi cerdas, peta situs, formulir pencarian, atau informasi kontak dasar.
Contoh Halaman Web 404 Terbaik
Selama bertahun-tahun, situs web telah menemukan berbagai cara untuk memberi tahu pengunjung tentang kesalahan 404 dan menyalurkannya kembali ke tempat yang tepat, beberapa sederhana, beberapa kreatif, dan beberapa meriah. Mari kita mulai dengan melihat beberapa halaman 404 yang kreatif, lalu lihat beberapa contoh lucu yang pasti akan menyenangkan siapa saja yang menemukannya.
1. Pipcorn
Sementara halaman 404 dapat dengan mudah menonjol dari sebuah situs web, halaman kesalahan Pipcorn selaras sempurna dengan branding situs lainnya. Ada latar belakang animasi yang bagus, teks ramah yang mengarahkan pengunjung untuk mencari situs web (lengkap dengan permainan kata yang cerdas), dan sepotong popcorn yang digunakan sebagai “0” di “404.”
2. Spotify
Raksasa streaming musik Spotify telah menutupi basisnya dengan halaman 404 yang cerdas. Dengan permainan kata-kata lucu dari album Kanye West “808s and Heartbreak” dan animasi rekaman, situs web tersebut secara singkat menghibur dan kemudian mengirim pengunjung kembali ke halaman asal mereka.
3. Ramah
Salah satu cara sederhana untuk meredakan ketegangan pada halaman 404 Anda adalah dengan menambahkan “Ups!” pesan — ini membantu situs Anda terasa lebih menarik saat Anda memandu pengguna kembali ke tempat yang tepat. Dalam kasus situs Genially, halaman tersebut juga menyertakan ilustrasi bagus yang dipasangkan dengan beberapa salinan lucu.
4. Adobe
Seperti yang Anda harapkan, halaman kesalahan 404 Adobe berguna dan menyenangkan secara visual. Ini mencantumkan tautan populer yang mungkin diinginkan pengunjung di samping beberapa karya seni digital keren yang berfungsi sebagai metafora visual untuk halaman yang rusak atau hilang. Sejujurnya, situs web harus lebih sering menggunakan metafora visual.
5. Clorox
Halaman 404 untuk produk pembersih Clorox berputar di antara tiga foto ringan untuk memberi sinyal kepada pengunjung bahwa mereka telah salah langkah. Ini adalah penggunaan branding yang cerdas untuk menambahkan momen kesenangan singkat sambil membantu pengguna yang hilang.
6. Duma Kolektif
Di lain waktu, Anda mungkin tidak memerlukan uraian yang cerdas — cukup beri tahu pengunjung bahwa tidak ada halaman di alamat tersebut dan biarkan mereka melanjutkan. Agen konsultan hiburan Duma Collective melakukan hal ini dengan halaman kesalahannya, meskipun dilengkapi dengan gambar latar untuk beberapa bakat kecil.
7. RumahDingin
Berbicara tentang bakat, merek perawatan diri Chillhouse telah bekerja ekstra untuk mengubah rute pengunjungnya dengan penuh gaya. Halaman 404 diberi merek dengan tepat dan bahkan membawa pengunjung dalam perjalanan kecil melalui beberapa gambar diam sebelum mereka kembali ke beranda.
8. Sedikit
Jika Anda memasukkan tautan Bitly yang salah, Anda akan dibawa ke halaman 404 Bitly. Kami menganggap ini terjadi cukup banyak, itulah sebabnya halaman 404 langsung ke intinya. Ini menjelaskan apa yang mungkin salah dan meminta pengguna untuk mengunjungi beranda Bitly jika itu yang mereka cari.
9. Ikea
Halaman 404 Ikea juga minimalis tetapi masih berhasil menyelipkan beberapa branding cerdas di sana. Contoh ini menunjukkan bahwa halaman kesalahan Anda tidak perlu rumit untuk menyampaikan maksudnya, tetapi tidak ada salahnya juga menambahkan kesenangan.
10. Moxie Design Co.
Tentu, “meledakkan Internet” mungkin sedikit hiperbolik, tetapi ini memberi tahu pengunjung bahwa Moxie Design Co. tidak menganggap dirinya terlalu serius dengan kesalahan kecil seperti ini. Juga, bilah pencarian ditempatkan dengan nyaman di bagian bawah untuk mengirim Anda dalam perjalanan.
11. McKissack & McKissack
Ah, trik klasik “kami kehilangan halaman”. Sekali lagi, cara mudah untuk menyajikan 404 tanpa mengasingkan audiens Anda. Jika Anda adalah agensi seperti McKissack & McKissack yang mengelola banyak interaksi klien, salinan yang jelas dan ringkas sangat penting untuk semua halaman situs Anda, termasuk halaman kesalahan.
12. Trik CSS
Pernah merobek pembungkus situs web untuk melihat apa yang ada di bawahnya? Itulah konsep yang digunakan Trik CSS di halaman kesalahan 404 mereka. Ini cerdas dan mengingatkan tentang apa situs web itu: penggunaan penataan halaman yang cerdas.
13. Game Lama yang Bagus
Untuk situs web lain, Anda membuka bagian depan dan ada … hanya ruang kosong yang luas. Halaman ini adalah referensi cerdas untuk GOG Galaxy, yang merupakan klien video game asli Good Old Games. Untungnya, ada sedikit karakter video game yang memberi pengunjung tempat untuk melaporkan kesalahan jika mereka mau.
14. Kanvas
Untuk sesuatu yang sedikit berbeda, lihat halaman 404 Canva. Ini tidak hanya mencakup pesan kesalahan, tetapi juga teka-teki ubin yang bagus yang dapat dimainkan pengunjung untuk hiburan singkat. Tidak ada salahnya membiarkan pengunjung Anda mengendur selama beberapa menit, bukan?
15. Innotech
Mirip dengan pendekatan Canva, Innotech menampilkan permainan bergaya Pong di halaman 404 untuk memberikan hiburan singkat. Kemungkinan Anda akan mengingat situs web seperti ini. Plus, jalan memutar yang menyenangkan melengkapi situs web yang benar-benar mengesankan — serius, ketika Anda selesai bermain, pergilah ke halaman beranda dan ambil semuanya.
16. Banyak sekali
Agensi video Myriad telah memilih desain halaman 404 yang unik dan bermerek yang meniru bilah warna SMPTE klasik yang muncul di kaset dan TV lama. Ini adalah kemunduran yang lucu untuk teknologi yang lebih lama sambil mewakili masalah yang lebih modern dari halaman web yang tidak ada.
17. KonMari
Dikenal dengan metode pembersihan dan organisasi serta mereknya yang populer, Marie Kondo telah menghadirkan nuansa serupa ke halaman 404 situs webnya. Salinannya secara singkat dan lucu mengingatkan kembali pada filosofi merapikannya — detail kecil namun bermerek yang akan dikenali penggemar.
18. BrandCrowd
Tidak hanya ilustrasi pada halaman kesalahan ini yang terperinci dan menarik — salinannya juga cerdas. Kami menyukai referensi lagu Semisonic “Closing Time”: “Anda dapat mengklik di mana pun, tetapi Anda tidak dapat mengklik di sini.”
19. Produksi Hot Dot
Halaman kesalahan Hot Dot tetap setia pada tagline-nya, “persimpangan teknologi dan desain baru.” Halaman dianimasikan oleh ratusan titik kecil yang mengubah arah sebagai respons terhadap tempat Anda memindahkan kursor. Ini memesona dan memamerkan kemampuan desain agensi yang luar biasa.
20. Mantel Jeruk
Jika Anda akan memberikan pesan kesalahan, mengapa tidak menghibur pengguna selama beberapa detik saat Anda membantu mereka? Setelah salam ramah, OrangeCoat menawarkan diagram alur yang benar-benar membantu pengguna mencari tahu mengapa mereka mencapai halaman kesalahan di tempat pertama.
21. Ervin & Smith
Halaman 404 ini tidak lebih dari mengarahkan pengguna kembali ke halaman aktif. Sebaliknya, halaman 404 Ervin & Smith mengundang Anda untuk menggulir ke bawah dan mempelajari mengapa Anda memerlukan agen pemasaran digital, dan mengapa memilih Ervin & Smith khususnya, diakhiri dengan formulir kontak. Sesuai dengan misinya, agensi ini menunjukkan bahwa halaman mana pun dapat menjadi peluang konversi.
22. DayCloud Studios
404 Anda hanya dapat menjadi tempat untuk membuang waktu selama satu menit, seperti yang dapat dilihat di situs web untuk DayCloud Studios. Memindahkan kursor di sekitar layar menampilkan pesan 404 yang diterangi oleh laser yang ditembakkan dari mata kucing. Karena kenapa tidak?
23. Ruang Kepala
Contoh lain dari situs web yang dengan cerdas menggabungkan pesan mereknya ke dalam halaman 404 — aplikasi meditasi terpandu Headspace berusaha menenangkan pengguna, mendorong kita untuk mengambil napas dalam-dalam, lalu kembali ke situs utama.
24. Toko Roti Wildwood
Beberapa situs web sejauh ini telah mengintegrasikan salinan bermerek pintar di halaman mereka, sementara yang lain telah menyelenggarakan game online lengkap di situs mereka. Tapi, tidak ada yang salah dengan dorongan singkat kembali ke arah yang benar. Situs indah Wildwood Bakery membuat semuanya tetap singkat dan manis (secara harfiah).
25. Astuteo
Halaman 404 agensi desain Astuteo adalah keseimbangan sempurna antara visual elegan, humor, dan bantuan. Tata letak minimal memberi pengguna informasi yang mereka butuhkan di samping metafora visual lucu lainnya, kapal kargo yang tenggelam, dan sosok yang melarikan diri.
26. LEGO
Ada beberapa kata yang dibutuhkan di halaman kesalahan 404 LEGO — ekspresi karakter membuat semuanya jelas. Plus, penggemar waralaba film LEGO akan menikmati referensi menyenangkan dalam salinannya.
27. Besaran
Dalam pesan kesalahan lucu ini, Magnt mengolok-olok fakta bahwa, ya, mereka bisa saja merusak sesuatu — atau, Anda tidak bisa mengetik. Visual berfungsi sebagai cara cepat untuk menggambarkan maksud mereka dengan cepat.
28. Pencari Ikon
Halaman kesalahan IconFinder sederhana namun menyenangkan. Maskot perusahaan yang mengenakan jubah dan tampak lelah adalah anggukan yang cocok untuk pengunjung yang hilang. Namun jangan khawatir, karena situs tersebut mencantumkan beberapa tautannya untuk dikunjungi di bawah.
29. Mimpi Manis
Rupanya, tim di perusahaan bantuan tidur Sweet Dreams mengambil terlalu banyak produknya menurut halaman 404 situs web. Halaman ini tidak hanya lucu — halaman ini juga menyatu dengan baik dengan estetika dan pesan front-end situs lainnya untuk nuansa yang kohesif.
30. GitHub
Baris “Ini bukan droid yang Anda cari” mengacu pada trik pikiran Jedi Obi-Wan Kenobi di Stormtroopers di Star Wars Episode IV, dan itu menjadi frasa terkenal yang digunakan untuk memberi tahu seseorang bahwa mereka salah tindakan. GitHub memainkan baris terkenal ini dalam pesan kesalahan 404 mereka.
31. Patagonia
Halaman 404 kustom Patagonia menangkap getaran merek dengan sempurna, lengkap dengan video bumerang dari frisbee twirler, permainan kata-kata cerdas yang menggabungkan “404” dan “aloha,” dan tautan ke halaman produknya. Ini adalah cara yang ramah dan lucu untuk menyapa pengunjung yang berakhir di tempat yang salah.
32. Cloud Sigma
Lihat ini: Cloud Sigma memberi tahu kami beberapa aksi di balik layar. Halaman kesalahan 404 mereka berpura-pura menjadi “beranda pengembang junior” — pengembang junior itu, yah, kucing.
33. Teater AMC
Anda mungkin pernah ke bioskop AMC sebelumnya, tetapi semoga Anda belum pernah melihat halaman 404 situs web mereka. Situs web menggunakan one-liner yang cepat, lucu, dan relevan sebelum mengirim Anda kembali ke tempat yang tepat.
34. Bruno
Bukan kebetulan bahwa agensi kreatif hebat dalam menghasilkan 404 halaman yang keren. Ini satu lagi dari materi iklan di Bruno yang memainkan komedi klasik 2000 kultus Dude, Where’s My Car? Tidak, itu tidak ada hubungannya dengan perusahaan atau situs web, tetapi pasti akan membuat Anda tertawa.
35. NPR
Pada awalnya, halaman kesalahan NPR sepertinya tidak ada yang istimewa. Tapi teruslah membaca dan Anda akan melihat bagaimana mereka dengan cerdik menautkan ke beberapa kisah hebat mereka tentang orang, tempat, dan hal-hal yang hilang, seperti sepotong di Amelia Earhart dan satu di Waldo. Ini mungkin hanya membuat pengguna yang hilang merasa tidak sendirian.
36. Sedang
Medium mengambil pendekatan yang mirip dengan halaman 404 NPR, merekomendasikan artikel tentang tersesat dan kehilangan sesuatu. Lihat artikel ini jika Anda punya waktu — artikel ini cukup bagus untuk dibaca.
37. BerandaStarRunner
HomeStarRunner.com, rumah bagi serial kartun animasi Flash, telah memiliki serangkaian halaman kesalahan 404 yang lucu selama bertahun-tahun. Yang terbaru menampilkan karakter dari serial kartun dalam sebuah adegan yang bisa saja muncul langsung dari salah satu episode mereka. Jika Anda mengaktifkan suara saat memuat halaman, Anda akan mendengar karakter mereka Strong Bad — dikenal karena meneriakkan frasa dengan keras — mengatakan, “404’d!”
38. Hiburan Badai Salju
Berikut adalah ide sederhana yang akhirnya terlihat apik: Halaman 404 Blizzard Entertainment menampilkan karakter animasi yang hilang dalam badai salju yang sebenarnya dan beberapa humor yang akan dihargai oleh penggemar World of Warcraft.
39. Halo Ide Besar
Perjalanan singkat seputar pemasaran dan pakar media sosial, situs web Hello Big Idea akan memberi tahu Anda apa yang perlu Anda ketahui tentang gaya salinannya yang berani dan blak-blakan. Dan, tentu saja, halaman kesalahan 404 tidak terkecuali.
40. HubSpot
Itu juga terjadi pada kita! Ini adalah pesan yang kami buat untuk memberi tahu pengunjung situs kami bahwa ada beberapa masalah situs web. Tujuan kami adalah untuk tetap setia pada suara merek HubSpot dengan menjadi orang yang menyenangkan, berempati, dan membantu sebisa mungkin.
Ubah Halaman Kesalahan 404 Menjadi Momen Menyenangkan
Tidak ada yang ingin mendarat di halaman 404 — mereka menjengkelkan dan tidak terduga. Namun, Anda tidak dapat benar-benar menghindarinya, jadi sebaiknya Anda memiliki halaman 404 untuk digunakan kembali di situs web Anda.
Dan, dari sudut pandang pengalaman pengguna, halaman 404 Anda harus berupa tonjolan kecil, bukan dinding bata. Desain yang tepat dapat menjadi pembeda antara pantulan yang gagal dan kemungkinan konversi, jadi mengapa tidak membuatnya menyenangkan?
