Bize göre, bir WordPress web sitesinin en az önemsenen unsurlarından biri 404 hata sayfasıdır.
Ziyaretçiler 404 sayfasına geldiklerinde bir yol ayrımına gelmiş olurlar. Hayal kırıklığına uğramış, kafaları karışmış veya sitenizden ayrılmaya hazır olabilirler. Ancak, doğru tasarım ve içerikle ziyaretçileri sitenizde daha uzun süre tutabilir, onları daha fazla keşfetmeye teşvik edebilir ve hatta dönüşümlere yol açabilirsiniz.
Bu makalede, karşılaştığımız en iyi 404 hata sayfası tasarımlarından bazılarını paylaşacağız. Bu örnekler yaratıcılığı, işlevselliği ve etkili kullanıcı rehberliğini gözler önüne seriyor.
Neden 404 Tasarımınızı Optimize Etmeniz Gerekiyor?
404 hatası, sunucu birinin ziyaret etmeye çalıştığı sayfaya ulaşamadığında ortaya çıkar. Sunucu boş bir ekran göstermek yerine bir 404 sayfası görüntüler.
Çoğu WordPress teması temel bir 404 şablonuyla birlikte gelir, ancak bu tasarımlar genellikle basit ve sadedir.
Ayrıca, ziyaretçinin okumak isteyebileceği popüler gönderiler veya sitenizin gezinme menüsü gibi web sitenizdeki hiçbir içeriği göstermezler.
Ziyaretçilere sıkıcı, yardımcı olmayan bir 404 sayfası gösterirseniz, web sitenizi terk etme olasılıkları artar, bu da hemen çıkma oranınızı artırır ve WordPress SEO‘nuza zarar verir.
İdeal olarak, kullanıcıları benzer içeriğe yönlendirerek web sitenizdeki 404 hatalarının sayısını azaltmak istersiniz.
Ancak bunu her zaman yapmak mümkün değildir. Bazen yanlış yazılmış bir URL veya bağlantı nedeniyle 404 hatası oluşabilir.
Bunu göz önünde bulundurarak, kendi markanıza ve içeriğinize sahip özel bir 404 sayfası oluşturmak akıllıca olacaktır. Ayrıca arama çubukları, menüler, bağlantılar ve diğer faydalı içerikler ekleyerek ziyaretçilerin aradıklarını bulmalarına yardımcı olabilirsiniz.
Özel bir 404 tasarımı oluşturmanın en kolay yolu SeedProd eklentisini kullanmaktır. En popüler sürükle ve bırak açılış sayfası oluşturucusudur, böylece herhangi bir kod yazmadan özel bir 404 sayfası oluşturabilirsiniz.
SeedProd ayrıca hızlı bir şekilde güzel bir hata sayfası oluşturmanıza yardımcı olacak çok sayıda profesyonelce tasarlanmış 404 şablonuna sahiptir.
SeedProd’u kurduktan sonra, ilham almak için rakiplerinize yönelmek iyi bir fikirdir. Bunu göz önünde bulundurarak, bakmanız için en iyi 404 hata sayfası tasarımlarını bir araya getirdik.
1. DFY
Birçok web sitesi aciliyet hissi yaratmak ve FOMO‘yu kullanarak daha fazla dönüşüm elde etmek için zamanlayıcılar kullanır. Ancak DFY, 404 sayfasına bir geri sayım sayacı eklemek gibi sıra dışı bir karar aldı.
Bu zamanlayıcı, ziyaretçi otomatik olarak ana sayfaya yönlendirilene kadar saniyeleri geri sayar.
DFY, bir zaman sınırı oluşturarak 404 sayfasını hemen daha ilgi çekici hale getiriyor ve ziyaretçileri zaman dolmadan bir karar vermeye zorluyor. Ayrıca alışılmadık bir tasarım tercihi olduğundan ziyaretçinin dikkatini çekmesi garantidir.
404 sayfasının mesajı da bu aciliyet hissine katkıda bulunarak sayfayı oldukça dramatik ve ilgi çekici bir tasarım haline getiriyor.
2. OptinMonster
OptinMonster, 1,2 milyondan fazla web sitesi tarafından kullanılan WordPress için en iyi e-posta yakalama eklentilerinden biridir. Ziyaretçileri abonelere ve müşterilere dönüştürmek için ihtiyacınız olan her şeye sahiptir.
Şaşırtıcı olmayan bir şekilde, OptinMonster 404 sayfasını göz alıcı bir animasyon ve net bir harekete geçirici mesaj ile bir potansiyel müşteri yaratma aracı olarak kullanıyor.
Daha da iyisi, sunumları ziyaretçinin durumuyla ilgilidir.
Birisi 404 sayfasına ulaştığında, aradığını bulamadığı için web sitenizden vazgeçme ve terk etme ihtimali çok yüksektir.
OptinMonster’ın sunumu, “Web sitenizi terk eden ziyaretçilerin %70’inden fazlasının bir daha asla geri dönmeyeceğini biliyor muydunuz?” sorusuyla bu konuya oynuyor.
Ziyaretçi zaten web sitesini terk etmeyi düşündüğünden, bu istatistiğe göre hareket etme olasılığı daha yüksektir. Eylem çağrısı daha sonra ziyaretçilere, web sitesini terk eden ziyaretçileri abonelere dönüştürmeyi vaat eden ücretsiz bir e-kitap sunar.
‘Şimdi İndir’ düğmesine tıklandığında, kişinin e-posta adresini yazabileceği ve ücretsiz indirmesini alabileceği bir açılır pencere açılır.
Gördüğümüz gibi OptinMonster, 404 hatasını kendi avantajına kullanarak çok alakalı ve zamanında hissettiren bir satış konuşması oluşturuyor.
Potansiyel müşteri oluşturmak için kendi 404 sayfanızı kullanmak istiyorsanız, SeedProd’un Giveaway, Contact Form veya Optin Form bloklarını kullanarak e-posta adreslerini toplayabilirsiniz.
3. Kualo
Birçok web sitesi, müşteri sadakati oluşturmak ve insanların geri gelmesini sağlamak için oyunlaştırmayı kullanır.
Kualo bunu bir adım öteye taşıdı ve 404 sayfasını oyunlaştırdı.
Ziyaretçilerin ana Kualo web sitesine geri dönmelerine yardımcı olmak yerine, 404 sayfası onları bir Space Invaders oyununa davet ediyor.
Bu, sinir bozucu bir hata mesajını eğlenceli bir sürprize dönüştürür. Daha da iyisi, canınız bittiğinde, Kualo size oynamaya devam etmeniz için bir teşvik veriyor.
Açılır pencere, oyunculara 1000 puanın üzerinde puan almaları halinde web sitesi barındırma hizmetinde indirim sunuyor. Bu, ziyaretçileri web sitenizde daha uzun süre tutan ve kullanıcı deneyimine değer katan mükemmel bir 404 sayfası örneğidir.
4. TripAdvisor
TripAdvisor’ın 404 sayfası eğlenceli ve işlevseldir ve seyahat sektörüne özgü bir şaka ile açılır.
Birisi 404 sayfanıza geldiğinde, yaşadığı deneyimden dolayı hayal kırıklığına uğramış olabilir. Mizah, bu kişilerle yeniden etkileşim kurmanın harika bir yolu olabilir.
Daha da iyisi, şakalar her zaman TripAdvisor markasıyla bağlantılı.
Markalaşma, standart WordPress 404 sayfasını özel bir tasarımla değiştirmenin en önemli avantajlarından biridir ve TripAdvisor’ın sayfası, markalaşmanın yalnızca özel logolar ve resimlerden ibaret olmadığını göstermektedir. 404 sayfanızdaki kelimeler de en az grafikler kadar önemlidir.
404 sayfası ayrıca TripAdvisor web sitesinin tüm önemli alanlarını vurgulayarak ziyaretçilerin aradıklarını bulmalarına yardımcı olur.
Navigasyon çok önemli olduğu için SeedProd’un Nav Menu bloğuna bakmanızı öneririz. Doğrudan sayfa editörünün içinde her türlü menüyü oluşturmanıza olanak tanır. Bu, WordPress web sitenize yararlı menüler eklemeyi kolaylaştırır.
5. Brett Terpstra
Brett Terpstra’nın 404 sayfası ilk bakışta basit görünebilir, ancak asıl gücü önerilen gönderiler listesinde yatıyor.
Brett Terpstra’nın 404 sayfası, ziyaretçinin 404 hatasını aldığında erişmeye çalıştığı bağlantıyla ilgili anahtar kelimeleri içeren gönderilerin bir listesini gösterir.
Bu, ziyaretçi deneyimine çok şey katan basit bir numaradır.
Dinamik içerik sitenizi daha kullanışlı, ilgi çekici ve cazip hale getirebilir, bu nedenle bunu 404 sayfanıza genişletmek mantıklıdır.
6. Sürekli İletişim
Constant Contact, hayal kırıklığına uğramış ziyaretçileri kazanmak için mizahı kullanan bir başka 404 sayfasıdır. E-posta hizmeti sağlayıcısı, hedef kitlesine hitap etmek için resmi olmayan bir dil kullanırken, ziyaretçilere ana sayfaya geri dönmek için kolay bir yol sunuyor.
Sayfayı aşağı kaydırırsanız, Constant Contact web sitesinin diğer bazı önemli alanlarına bağlantılar bulacaksınız.
Ancak bizim asıl hoşumuza giden, fareyi mavi bloklardan birinin üzerine her getirdiğinizde oynayan kısa hover animasyonu.
Animasyon bir sayfayı daha ilgi çekici hale getirebilir ve çoklu fareyle üzerine gelme efektleri ve animasyonlar, ziyaretçi 404 sayfasında gezinirken bir hikaye anlatma unsuru oluşturur.
SeedProd Animasyonlu Başlık bloğunu kullanarak metninizi vurgulamak ve döndürmek de dahil olmak üzere 404 sayfanızı canlandırmanın birkaç farklı yolu vardır.
SeedProd ayrıca resimler, metinler, düğmeler, videolar ve daha fazlası dahil olmak üzere herhangi bir bloğa ekleyebileceğiniz 40’tan fazla giriş animasyonu ile birlikte gelir.
Daha fazla bilgi için lütfen WordPress’te CSS animasyonlarının nasıl ekleneceğine ilişkin kılavuzumuza bakın.
7. IMDb
Çoğu kişi 404 sayfanızla tamamen başka bir şey ararken karşılaşacaktır. 404 hatası beklenmedik bir durum olduğundan, marka aşinalığını koruyarak ziyaretçilere hala sitenizde olduklarına dair güvence vermek önemlidir.
IMDb bunu, bir filmden veya TV şovundan ünlü bir alıntıyı göstererek çok ince ve hafif yürekli bir şekilde yapar.
Ayrıca, alıntı yaptıkları dizi veya film hakkında daha fazla bilgi edinmek için bir bağlantı da içerirler.
Bu şekilde IMDb’nin 404 sayfası markalarını güçlendirirken ziyaretçilere içeriklerini keşfetmeleri için eğlenceli bir yol sunuyor.
404 sayfanızdarastgele alıntılar göstermek eğlenceli ve ilgi çekici olabilir. Ancak, ziyaretçinin rastgele seçtiğiniz bağlantıyla ilgilenmemesi ihtimaline karşı, sitenizin en önemli içeriğine bağlantılar sağlamak yine de iyi bir fikirdir.
IMDb’nin ana sayfasına bir bağlantı ekleyerek yaptığı da tam olarak budur.
8. SteveMadden
Steve Madden, 404 sayfasında en çok satan ürünlerini göstererek bir hata mesajını satışa dönüştürmeye çalışıyor.
Daha da iyisi, müşteriler doğrudan 404 sayfasından farklı ürünlere göz atabilsin diye filtreler eklediler.
Bir online mağaza işletiyorsanız, 404 sayfanıza En Çok Satan Ürünler bloğunu ekleyerek en popüler ürünlerinizi kolayca görüntüleyebilirsiniz.
SeedProd ayrıca indirimde olan ürünleri, en çok beğenilen ürünleri, son ürünleri ve daha fazlasını göstermek için kullanabileceğiniz WooCommerce bloklarına sahiptir.
Kendi 404 sayfanızı tasarlarken, web sitenizin geri kalanıyla aynı üstbilgi ve altbilgiyi kullanmak iyi bir fikirdir. Bu, markanızı güçlendirecek ve ziyaretçilerin doğru yerde olup olmadıklarını merak etmelerini önleyecektir.
Steve Madden’ın 404 sayfasında da tam olarak bunu görüyoruz, ancak özellikle bu iki küçük alana ne kadar çok içerik sığdırdıklarını seviyoruz.
Üstbilgi ve altbilgi, ziyaretçilerin doğrudan Steve Madden mağazasının herhangi bir bölümüne ve hatta şirketin Twitter ve Facebook sayfaları gibi üçüncü taraf sitelerine atlamasına yardımcı oluyor.
Hatta akıllı bir ürün arama çubuğu da dahil olmak üzere interaktif alanlara erişim sağlarlar.
9. Apartman Terapisi
Apartment Therapy’nin bu 404 tasarımı, büyük bir kahraman görseliyle ziyaretçinin dikkatini hemen çekiyor.
Apartment Therapy de bu alanı marka kimliğini pekiştirmek için kullanıyor ve şık bir mutfak fotoğrafının yanı sıra washi bantla ilgili bir şaka gösteriyor.
Tasarımınıza bir kahraman görseli eklemek istiyorsanız, SeedProd’da çok sayıda hazır kahraman bölümü vardır. Bunlar, tek bir düğmeye tıklayarak 404 tasarımınıza ekleyebileceğiniz görsel koleksiyonları, harekete geçirici mesajlar ve hatta basit potansiyel müşteri toplama formlarıdır.
Hatta Apartment Therapy web sitesinde evde gibi görünecek bir bölüm bile var.
10. Çığlık Atan Kurbağa
Bu listedeki diğer 404 sayfalarından bazılarına benzer şekilde, Screaming Frog da ziyaretçilerle etkileşim kurmaya çalışmak için mizahı kullanıyor.
Ancak bu listedeki diğer işletmelerden farklı olarak Screaming Frog, web sitesi sahiplerinin kırık bağlantıları bulmasına ve düzeltmesine yardımcı olan bir araç oluşturuyor. 404 sayfaları, Screaming Frog web sitesinin bozuk bir URL’ye sahip olmasının ironisine işaret etmek için zaman kaybetmiyor.
Screaming Frog, kendisiyle dalga geçerek, kendini fazla ciddiye almayan unutulmaz bir 404 sayfası sunuyor.
Animasyonlu arka plan da bu 404 tasarımının kalabalığın arasından sıyrılmasına yardımcı oluyor.
Videolar ve animasyonlar 404 sayfanızı daha ilgi çekici hale getirmenin harika bir yoludur. Ancak 404 sayfasının yüklenme süresini uzatabilirler.
Bunu göz önünde bulundurarak, özellikle 404 tasarımınızda çok sayıda büyük veya yüksek çözünürlüklü video kullanıyorsanız WordPress performansını hızlandırmak için ipuçlarımızı takip etmenizi öneririz.
Ayrıca videoları asla doğrudan WordPress’e yüklememelisiniz, çünkü bu sitenizin performansı üzerinde büyük bir etkiye sahip olabilir.
Bunun yerine, dosyayı bir video barındırma sites ine yüklemenizi ve ardından dosyayı sitenize yerleştirmenizi öneririz.
Ayrıntılı talimatlar için lütfen WordPress’e kolayca video yerleştirme kılavuzumuza bakın.
11. MonsterInsights
MonsterInsights, Google Analytics için en iyi WordPress eklentisidir. Google Analytics ‘i WordPress’e kolayca yüklemenizi sağlar ve WordPress kontrol panelinde yararlı raporlar gösterir.
MonsterInsights, markalı sayfalara iyi bir örnektir. Ziyaretçiler 404 sayfasına ulaşır ulaşmaz MonsterInsights logosunu temel alan benzersiz bir grafik görecekler.
Bu, ziyaretçilere kırık bir bağlantıyı takip etmiş olsalar bile hala MonsterInsights web sitesinde olduklarını bildirmenin eğlenceli bir yoludur.
Bu sayfa ayrıca 404 hatasının ne olduğunu açıklar ve ziyaretçinin hatayı düzeltmek için yapabileceği bazı şeyler önerir. İnsanların 404 hatasını kendilerinin çözmesine yardımcı olmak ziyaretçi deneyimini iyileştirebilir, bu nedenle bu bilgileri kendi 404 sayfanıza eklemek iyi bir fikirdir.
Ziyaretçileri sorunu kendilerinin çözmesi için teşvik etseniz bile, sitenizin en önemli içeriğine bağlantılar eklemeniz yine de önemlidir.
MonsterInsights 404 sayfası, destek sayfasına, MonsterInsights bilgi tabanına, fiyatlandırma sayfasına ve daha fazlasına bağlantılar ekleyerek insanlara birkaç seçenek sunar.
12. DELİ
MAD, 404 hata mesajı oluşturmak için geçiş düğmelerini kullanarak basit ama oldukça etkileşimli bir sayfa oluşturdu. Tüm geçişleri kapatarak bu mesajı kaldırabilir, hatta geçişleri etkinleştirerek kendi mesajınızı oluşturabilirsiniz.
Ziyaretçilerden çok fazla etkileşim almak için tasarlanmış çok basit ama keyifli bir deneyim. Ayrıca ziyaretçilerin hatırlayacağı ve hatta belki de sosyal medyada diğer insanlarla paylaşacağı çok benzersiz bir 404 sayfasıdır.
Bu çarpıcı tasarım, basit bir fikirden akılda kalıcı ve eğlenceli bir 404 sayfası oluşturabileceğinizi kanıtlıyor.
13. Güneybatı
Southwest’in 404 sayfası, 404’ün ne olduğunu ve neden bu hatayı görüyor olabileceklerini açıklayarak ziyaretçilerin yollarına devam etmelerine yardımcı olmaya çalışır. Hatta hedef kitleniz 404 hatalarına pek aşina değilse yardımcı olabilecek bazı olası düzeltmeler de öneriyorlar.
Bu tasarımın gerçekten öne çıktığı nokta, ne kadar çok bağlantıyı düzgün ve organize bir şekilde göstermeyi başardığıdır.
Ekranın alt kısmına doğru ilerlerseniz, sosyal medya bağlantıları, iletişim bilgileri, e-posta listelerine katılma bağlantısı ve diğer birçok URL’nin açık ve kullanıcı dostu kategoriler halinde düzenlendiğini göreceksiniz.
Güneybatı 404 sayfası, ziyaretçiyi bunaltmadan bir sayfaya ne kadar çok bilgi sığdırabileceğinizi gösteren harika bir örnektir.
Burada doğru düzen çok önemli ve Southwest, bilgi dolu ancak yine de okunması kolay bir 404 sayfası oluşturmak için kategoriler, listeler ve farklı bölümler kullanarak harika bir iş çıkarıyor.
Southwest’in düzenini kopyalamak istiyorsanız, WordPress widget’larını sütunlarda görüntülemek kolaydır. Hatta bazı WordPress temaları varsayılan olarak altbilgide birden fazla widget’a hazır alanla birlikte gelir.
14. Polo Garcia
404 sayfası tasarımınızı benzersiz hale getirmenin bir başka yolu da tam ekran animasyonlu bir GIF veya video arka planı kullanmaktır.
Tasarımcı Polo Garcia’nın web sitesi bunun harika bir örneği. Su üzerindeki bir sincabın tam ekran GIF’ini kullanıyor. Bu, bir hata sayfası için bile görsel olarak ilgi çekici ve sürükleyici bir deneyim yaratıyor.
Bu taktik, ziyaretçinin dikkatini çekebilir ve var olmayan bir sayfaya indiği için daha az hayal kırıklığına uğramasını sağlayabilir.
15. Dribbble
Kullanıcıları web sitenizde tutmak için 404 sayfanızı iyileştirmeye yönelik en iyi uygulamalardan biri kaynak önermek veya sayfaya bir arama formu eklemektir. Bu iyi bir şey, ancak gerçekten benzersiz bir deneyim için sınırları zorlamakta fayda var.
Örneğin Dribbble’ın 404 sayfasını ele alalım. Statik bir liste yerine, 404 hata mesajının kendisinin belirli bir renk şemasına uyan görüntülerle doldurulduğu etkileşimli bir öğe oluşturmuşlar.
Kullanıcılar daha sonra daha fazlasını keşfetmek için bu etkileşimli görsellere tıklayabilirler. Bu, yalnızca kullanıcıların ilgisini çekmekle kalmayan, aynı zamanda Dribbble’ın görsel içeriğe odaklanmasını pekiştiren bir etkileşim katmanı ekler.
404 Hata Sayfası Tasarımı Hakkında Sıkça Sorulan Sorular
En iyi 404 sayfası tasarım örneklerini incelediğimize göre, şimdi bu hata sayfası hakkında sıkça sorulan bazı sorulara bakalım.
404 sayfaları SEO’yu etkiler mi?
404 hatalarının kendisi SEO’nuza doğrudan zarar vermese de, kullanıcıları hayal kırıklığına uğratarak ve sitenizden hızla ayrılmalarına neden olarak dolaylı olarak SEO’nuzu etkileyebilir. İyi tasarlanmış bir 404 sayfası, yararlı kaynaklar sunarak ve ziyaretçilerin ilgisini canlı tutarak SEO’nuza yardımcı olabilir.
Bir 404 sayfası nasıl görünmelidir?
404 sayfasının anahtarı açık ve yardımcı olmaktır. Sayfanın bulunamadığını açıklayan dostça bir mesajın yanı sıra tekrar yola koyulmak için öneriler ekleyin. Bu, ana sayfanıza, popüler içeriğe veya site arama çubuğuna bağlantılar olabilir.
Havalı bir 404 sayfası nasıl yapılır?
İyi görünümlü bir 404 sayfasını kolayca oluşturmak için SeedProd gibi bir sayfa oluşturucu kullanabilirsiniz. Zaten kullanabileceğiniz tonlarca 404 sayfa şablonu var, böylece sıfırdan başlamak zorunda kalmayacaksınız.
Deneyebileceğiniz bir başka sayfa oluşturucu da 404 sayfası tasarlamak için kullanımı kolay olan Thrive Theme Builder‘dır.
404 sayfalarının altbilgileri var mı?
Altbilgiler 404 sayfaları için zorunlu değildir. Bununla birlikte, iletişim bilgileriniz veya site haritanız gibi temel bağlantıları içeren temel bir altbilgi eklemek, tutarlılık duygusunu koruyabilir ve kullanıcıların sitenizde gezinmesi için ek yollar sunabilir.
Umarız bu makale en iyi 404 hata sayfası tasarım örneklerini bulmanıza yardımcı olmuştur. WordPress’te viral bir bekleme listesi açılış sayfasının nasıl oluşturulacağına ilişkin kılavuzumuza ve WordPress için en iyi açılış sayfası şablonlarına ilişkin uzman seçimlerimize de göz atmak isteyebilirsiniz.
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
Syed Balkhi
Hey WPBeginner readers,
Did you know you can win exciting prizes by commenting on WPBeginner?
Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
You can get more details about the contest from here.
Start sharing your thoughts below to stand a chance to win!
Moinuddin Waheed
404 error is a very common error and having an optimized and beautiful 404 is a must for keeping the visitors interest continued.
Seeing some the most interesting 404 error page, it feels like having those creativity and out of the box approach at my own 404 page.
utilising seedprod to make awesome 404 error page for my websites.
Jiří Vaněk
People’s creativity is amazing. I was particularly captivated by Pixar’s 404 page, and I let myself be a bit inspired by it for my website too. I believe it’s very important to make the 404 page somewhat humorous to lighten the frustration for a user who encounters content they weren’t looking for. It brings a smile, eases emotions, and might even draw them towards exploring more content on the website.
Damian
Instead of configuring a 404 error page, I prefered set up a full sitemap page, better for our visitors.
Nure
Just awesome i like it
thanks to share
PatREllery
Here’s a cool one: http://www.bookofzeus.com/404/
Bhavesh
@PatREllery Its really cool one…..
Bruce
Thanks for this informative information. I like:
9. Catswhocode
17. Retard Zone
Dennis
Nice one!
My favourite is #6 CSS
Thanks for sharing.
penthius
After reading this I too decided to give it a go.
It’s my first 404 , it will get better with practice I am sure ;
http://ghostwhisperer.me/404
Zach Hornsby
After reading this article, I created one.
http://netjelly.com/404
Editorial Staff
It looks great
Yönetici
Viidar
How about this one? (in Norwegian, but you´ll get the picture):
http://www.powertech.no/404
Text: “Ups, Mari, has been down in the server-room again…” (mari works in the finance-department )
Michelle
these are really great, thanks for sharing
Dave
This page also pretty good, and very funny…
[Link Removed because the site did not use WordPress]
Editorial Staff
Except your site is not using WordPress for that 404 page.
Yönetici
Niche Website Builder
Very creative indeed! Of course, my favorite has to be the 404 error pages featuring Homer Simpson and his infamous “D’Oh!”
Phaoloo
Nice examples, they inspire me for the next project.
Rent Apartment in Kuala Lumpur
Excellent collection of 404 page design!
Andrew Yates
Nice collection, how about this one… http://www.383project.com/404 ?
Editorial Staff
Very nice We will surely include it in our next collection.
Yönetici
arfandhia
wow, nice colection,thanks for this list
Johnson Koh
Interesting collection. Thanks for the effort
abrcity
very nice article,very helpful
Arif
really nice designs, thanks for sharing
Klim
Some pages are really cool! Thanks for collecting them!
Dave Sparks
love the cats who code one, brilliant.
Website Design UK
Excellent showcase, my friend!! Well worthy of a Digg.
Jeffro
I like the catswhocode one. Works well with the site name! hah
G.Han
Beautiful post, very inspiring!
Hans
I really like the illustration on Catalyst Studios’. That on Carsonified is also very nice (all of them are)
I like this one to
http://jayj.dk/404
Editorial Staff
Very nice find there. That one is good.
Yönetici
Honour Chick
lol, very funny 404 pages.
Shahriar Hyder
Very nice post. Please do check out the following article as well which is a compilation of:
Custom 404 error pages that are cool, funny yet creative
http://technosiastic.wordpress.com/2009/09/01/custom-404-error-pages-that-are-cool-funny-yet-creative/
Asif Iqbal
Very neat and clean options.. I am going to choone one of the best for my website.
Michigan Fur Coats
Very clever and unique.
vq
I wanted to throw two of mine in there:
http://weare.clickpopmedia.com/404
http://www.clickpopmedia.com/404
Both Wordpress. Let me know what you think.
Editorial Staff
Love your weare page. The second one can still use some work.
Yönetici
Tobbi
Great collection. My favorites a #2 and #6
GailGrannum
Wow, you have really expanded my concept of the 404 page alternatives. Thank you for sharing very creative examples that will assist me in reducing my bounce rate. BTW – I have tweeted this article to my peeps.
Gail
Editorial Staff
We appreciate all the support on twitter If you ever have any questions or need help with WordPress feel free to ask us either via twitter or email.
Yönetici
Teddy
Thanks for the showcase! I always find a lot of inspiration in 404 pages – basically, a good 404 page will have to appease the possibly frustrated user as well as make a good impression so that the visitor will continue probing the site instead of navigating away almost immediately.
Oh, and thanks for the tutorial too! I find it very useful and detailed for those who are still new to WordPress and PHP awesome job!
p/s: Some shameless self-promotion here: http://www.teddy-o-ted.com/wp-admins (to trigger a 404 page) and http://www.teddy-o-ted.com/demo/ (not strictly a 404 page but I’m thinking).
Editorial Staff
Love your Hot Dog idea. Also Oh God Dammit is pretty good too. Tough choice eh.
Yönetici
Teddy
Kind of a tough choice. I think I’ll most probably be porting the hot dog idea over to my main site’s 404 template, heh.
Speaking of which, what inspired you to make the 202 + 202 = 404 title? That’s an interesting one
Editorial Staff
The idea of WPBeginner <<< Beginner and the whole number idea because I like numbers. Simple addition.
werthers
B3ta once ran a competition a long time ago for 404 images and they blew all these out of the water. One featured a map of the internet and an arrow and you are here to 404, it also had porn and the rantings of nerds among other areas.
It’s going a long time back so I don’t know if many of the images are still hosted
subcorpus
awesome …
need to think of kewl way to do that on my blog … hehe …
j2brown
I’m biased, since it’s my own site, but I think it’s rather creative:
http://www.sterlingfire.org/?error=404
Michel
Another excellent resource for 404s:
http://simplebits.com/notebook/2007/11/03/404.html
See all comments in this blog post by Dan! (not WP blogs) (but still the collection is impressive)
Oleg
Yeah! Nice Ideas! I have my custom 404 Error page too: http://www.xtraboy.com/some-error
Take a look at it. It’s funny Thanx
Editorial Staff
That is surely a memorable one. Had we known about it before, we would’ve added it. Will consider for our next showcase
Yönetici
Oleg
Thank You! I’m glad to hear your words
Simran
Awesome collection. Thanks for sharing
Robert
Some of these are great!
I run a coffee blog in Vancouver and I used a split coffee cup as a my 404 page.
http://coffeevancouver.ca/error
Editorial Staff
Very nice use of the image. Love your other posts.
Yönetici
Mike
techkultura from Polish:
404 The Way of the Samurai Codex
“If the searched page doesn’t exist,
Immediately fulfill Seppuku.”
ilmu komputer
they all very creative design.
Good.
TalkVietnam
Nice collection. Thanks.
Chris Berry
Here’s a good WordPress example.
http://roanoketweetup.com/404
lipelip
Nice collection, here is mine
http://www.lipelip.be/micou
I’m a fan of chuck norris
Editorial Staff
Your page is funny and good looking. Keep up the great work, and we love Chuck Norris as well.
Yönetici
lipelip
héhé thanks, chuck rocks !
joyoge bookmark
nice 404 designs, thanks for the tut
Michel
Mmm, and how about this one? >
http://www.optimiced.com/en/404
100% WP powered, 100% custom designed;-)
Thomas
I’m pretty sure putting Adsense on a 404 error page is against Google’s terms of service, don’t you think?
Michel
My WordPress theme uses standard templates, so the 404 page simply has a small adsense block at the top, as most of the pages of my blog have it, too. I wouldn’t worry about it, nor do I care much if this page shows (or not) adsense at all. I was showing the design of the page, not the adsense block — looks like you were looking elsewhere;-)
Michel
Plus, if there’s content on the 404 page, Google allows to show ads on it — this is not against their TOS (this info could be useful to others, too)
Dave Bowker
How about this one? Can’t go wrong with Oompa Loompas!
http://quoterelish.com/err
Editorial Staff
It’s good, but we only listed sites that were powered by WordPress.
Yönetici
Vidimonkey
missed out on http://freetubetv.net/404
it’s a tv blog/app so the 404 page is pretty brilliant considering the execution.
Editorial Staff
Once again, it is not powered by WP.
Daniel
http://www.gowatv.com/error-404.php also