هل تبحث عن أمثلة تصميم صفحة 404 ملحمية تلهمك؟
يمكن لصفحة 404 المناسبة أن تساعدك بالفعل في زيادة العملاء المحتملين والمبيعات التي كنت ستخسرها بالتأكيد. ولكن ما الذي يجعل صفحة 404 جيدة حقًا؟ هل يمكنك إنشاء صفحة 404 مميزة دون الحاجة إلى توظيف مطور؟ هل يهم مدى تطور مظهر صفحة 404 الخاصة بك؟
سنجيب على هذه الأسئلة مرة واحدة وإلى الأبد.
في هذا المنشور، سنغطي 10 من أفضل أمثلة تصميم صفحات 404 التي رأيناها. بعد ذلك، سنشرح لماذا تعمل.
دعنا نتعمق.
ما هي صفحة 404 ولماذا يجب أن تهتم؟
صفحة 404 هي صفحة مخصصة تنشئها على موقعك وتظهر كلما حاول شخص ما الوصول إلى عنوان URL على موقعك لم يعد موجودًا. الغرض من صفحة 404 هو منع هؤلاء الزوار من مغادرة موقعك فورًا.
لذلك، بالطبع، إذا لم يكن لديك صفحة 404، فستفقد هؤلاء الزوار. وأخطاء 404 أكثر شيوعًا مما قد تعتقد. أي موقع يعمل منذ فترة سيكون قد حذف صفحات ومنشورات.
يمكن أن يساعدك تصميم صفحة 404 جيد في الاحتفاظ بالزوار الذين يصادفون خطأ 404 ويمكنه بعد ذلك تحويل هؤلاء الزوار عن طريق إعادة توجيههم إلى صفحة أخرى.
أفضل أمثلة تصميم صفحات 404
الآن بعد أن عرفت ما يمكن أن يفعله تصميم صفحة 404 لك، فقد حان الوقت لإلقاء نظرة على قائمتنا لأفضل التصميمات التي رأيناها. إذا كنت تتطلع إلى إنشاء صفحة 404 الخاصة بك، فنحن نوصي باستخدام SeedProd للقيام بذلك. يتيح لك SeedProd إنشاء صفحات هبوط مخصصة في ووردبريس (بما في ذلك صفحات 404) دون أي ترميز.
اذهب واطلع على مراجعتنا الكاملة لـ SeedProd وأنشئ صفحة 404 الخاصة بك. أو، تعمق مباشرة في قائمتنا للحصول على بعض الإلهام أولاً.
رقم 1. PushEngage
تصميم صفحة 404 الخاصة بـ PushEngage هو المثال المثالي لكل ما تحتاجه من صفحة خطأ. هناك رسالة اعتذار واضحة وشريط بحث يشجعك على البقاء على الموقع والبحث عن المورد الذي تحتاجه.
كما أنه يمنحك خيار الانتقال إلى الصفحة الرئيسية أو الاتصال بالفريق.
بهذه الطريقة، لدى الزوار خيار البقاء على الموقع ومواصلة تصفح المزيد من المحتوى. ولكن الأهم من ذلك هو استخدام قائمة التنقل. تجعل قائمة التنقل من السهل على المستخدم الانتقال إلى أي مكان على الموقع فورًا. ووجود قائمة تنقل في تصميم صفحة 404 الخاصة بك يجعل الصفحة تبدو وكأنها جزء من نفس الموقع بدلاً من رسالة خطأ عشوائية.
مع تصميم صفحة 404 هذه، الهدف بسيط: إبقاء الأشخاص على موقع PushEngage.
يمكنك استخدام صفحة 404 هذه مباشرة كقالب. إنها بسيطة للغاية وفعالة للغاية. لذلك، يمكنك إعادة إنشاء الصفحة في غضون دقائق.
#2. 9gag
لدى 9gag أحد أكثر تصميمات صفحات 404 مباشرة وواضحة رأيناها على الإطلاق. لا يوجد شيء على الإطلاق ليفكر فيه الزائر. تحصل على دعوة واضحة لاتخاذ إجراء لتنزيل تطبيقهم.
إنه يركز بشكل كبير على تحويل زوار الويب إلى مستخدمي تطبيقات وهذا كل ما يقدمه. الصفحة بسيطة للغاية وصورة GIF لجون ترافولتا يبدو ضائعًا هي لمسة رائعة.
نعم، لقد تحدثنا للتو عن تقديم طرق مختلفة للاحتفاظ بالزائر. ولكن لا يمكنك إرباكهم بالكثير من الخيارات أيضًا. بالنسبة لمطوري التطبيقات، هذا القالب هو ذهب خالص. يمكنك بسهولة إنشاء صفحة هبوط للتطبيق والربط بها من صفحة 404 الخاصة بك.
#3. بيكسار
بيكسار دائمًا ما تفوز بالإبداع. لديهم واحدة من أكثر صفحات 404 تصميمًا متعة وإبداعًا وجاذبية.
مع إحدى الشخصيات من فيلمهم Inside Out، يلعبون على مدى الإحباط الذي يمكن أن يحدث عند الوصول إلى الصفحة الخطأ. ثم يمكن للأشخاص استخدام القائمة الرئيسية في أعلى الصفحة للعودة عبر الموقع.
الانتقاد الوحيد الذي لدينا هو عدم وجود شريط بحث لمساعدة المستخدمين في العثور على مورد ذي صلة. إذا كنت تدير موقعًا على ووردبريس، يمكنك إعداد محرك بحث مخصص للموقع بأكمله بسرعة كبيرة باستخدام SearchWP.
اطلع على مراجعتنا لـ SearchWP لمعرفة المزيد.
#4. ديزني
تصميم صفحة 404 الخاصة بديزني رائع جدًا أيضًا. تحصل على شريط بحث للعثور على موارد ذات صلة.
ولكن الأهم من ذلك، أن كل شيء في الصفحة يتناسب مع علامة ديزني التجارية. التأثير المتحرك مع شخصيتهم الشهيرة Wreck It Ralph من فيلمهم الناجح Ralph Breaks the Internet لطيف للغاية.
تحصل أيضًا على قائمة تنقل في الأعلى للوصول بسهولة إلى أي صفحة تريد العثور عليها. هذا تحسين على تصميم صفحة 404 الخاصة ببيكسار. إذا ألقيت نظرة فاحصة على قائمة التنقل، سترى أنها تشير إلى صفحات المتجر، الحدائق والسفر، والأفلام. هذه كلها مصادر لجني الأموال، وفي كل مرة يحولون فيها شخصًا ما من صفحة 404، فهذه أموال كانوا سيخسرونها بخلاف ذلك.
#5. نتفليكس
نتفليكس هي منصة اكتشاف أكثر من كونها محرك بحث. لذلك، لمرة واحدة، سنتغاضى عن حقيقة عدم وجود شريط بحث في صفحة 404 الخاصة بهم. وبجانب ذلك، كيف يمكنك أن تكون غاضبًا من هذا التصميم؟ الخلفية هي مشهد من مسلسل Lost in Space.
من المناسب جدًا أنهم تمكنوا من تحقيق ذلك.
الشيء الرئيسي الذي يجب ملاحظته هنا هو زر CTA الكبير في المنتصف: الصفحة الرئيسية لنتفليكس. إنه بسيط وفعال وجذاب للغاية. رؤية صفحة 404 هي تجربة سيئة جدًا للمستخدم. ولكن في بعض الأحيان، كل ما تحتاج إلى تقديمه لتجربة مستخدم جيدة هو زر مُسمى بوضوح.
#6. تريب أدفايزر
تريب أدفايزر لديها مثال ممتع ومتحرك لصفحة 404. إنه مناسب لعلامتهم التجارية وتشعر الصفحة بأنها مرحة ومسلية. تشبه تقريبًا... القيام برحلة مع صديق مضحك.
اطلع على النكتة الرئيسية حول فقدان الصفحة ولكن ليس أمتعتك. هذا هو النوع المثالي من الفكاهة لموقع سفر، ويدعو المستخدم للتنقل إلى 4 أقسام رئيسية من موقعهم:
- فنادق
- مطاعم
- أشياء للقيام بها
- شقق للإيجار لقضاء العطلات
طريقة ممتازة لإعادة إشراك المستخدم ومساعدته في التخطيط لعطلته القادمة دون أن تكون لحوحًا.
#7. كونستانت كونتاكت
كونستانت كونتاكت تخدم بشكل أساسي أصحاب الأعمال والمسوقين الشباب. لذلك، بينما قد تبدو لغتهم غير رسمية قليلاً، فهذه هي الطريقة المصممة للشعور بها.
تصميم صفحة الخطأ 404 هذه بسيط وأنيق ويتفهم عقلية المستخدم. لاحظ كيف أن النص، حتى مع لغته غير الرسمية، يبدو اعتذاريًا ومفيدًا.
إذا كانت لدينا شكوى واحدة، فهي تتعلق بالجزء الأخير من النص. يقول أنه يمكنك "تجربة أحد الروابط أدناه" ويقدم رابطًا واحدًا فقط للنقر عليه. نوصي إما بتغيير الصياغة حول الزر أو توفير المزيد من الروابط للاستكشاف.
#8. سلاك
أنشأ سلاك خلفية متحركة كاملة لصفحة خطأ 404 الخاصة بهم. لذلك، فهي جذابة للغاية ومصممة لإبقاء الأشخاص على الموقع لفترة أطول.
بالطبع، لديهم رابط يأخذ المستخدمين مرة أخرى إلى مركز المساعدة مع مجموعة من الروابط الأخرى إلى صفحات مختلفة.
لا يوجد رابط إلى الصفحة الرئيسية وهذا هو الشيء الوحيد الذي يبدو مفقودًا. هنا، لا يحتاج تصميم صفحة 404 إلى تضمين شريط بحث لأنه يربط بمركز المساعدة حيث تحصل على بحث الموقع.
#9. ستيف مادن
يقدم تصميم صفحة 404 الخاصة بستيف مادن خيارات متعددة للزوار الضائعين. يمكنك استخدام شريط البحث الخاص بهم للعثور على المنتجات على الموقع. ولكن هناك أيضًا قائمة تنقل للعثور على صفحات الفئات.
ثم، تحصل أيضًا على دعوتين لاتخاذ إجراء (CTAs) تعيد توجيهك إلى المنتجات الشائعة.
تم تحسين كل شبر من تصميم صفحة 404 هذه للنقرات لزيادة متوسط الوقت المستغرق في الموقع. من السهل جدًا إنشاء صفحة مثل هذه أيضًا. كل ما عليك فعله هو استخدام كتل التجارة الإلكترونية من SeedProd.
#10. أمازون
إذا كانت أمازون تستمتع بتصميم صفحة 404 الخاصة بها، فهذا مؤشر واضح على أنه يجب عليك أيضًا!
تبدأ الصفحة باعتذار بأحرف كبيرة وواضحة. ثم تعيد توجيه المستخدمين إلى الصفحة الرئيسية لأمازون أو تسمح للمستخدمين بمقابلة "كلاب أمازون". هذا التوجيه المرح هو طريقة رائعة لإبقاء الأشخاص على موقعهم لفترة أطول.
في النهاية، من لا يحب الكلاب؟
ماذا تفعل بعد الانتهاء من تصميم صفحة 404؟
هذا كل شيء لهذا اليوم أيها الأصدقاء!
إن إنشاء تصميم صفحة 404 هو في الواقع الجزء الأسهل من بناء عمل تجاري عبر الإنترنت. الجزء الصعب هو جذب حركة المرور إلى موقعك وجعل الناس يشترون منك باستمرار.
توصيتنا هي البدء بإشعارات الدفع. إشعارات الدفع هي أدوات رائعة لزيادة تفاعلك وتحويلاتك أيضًا. غير مقتنع؟ تحقق من هذه الموارد المذهلة حول حملات إشعارات الدفع:
- كيفية تحويل المشتركين إلى مشترين باستخدام إشعارات الدفع عبر الويب
- كيفية إخطار المشتركين بمنشورات ووردبريس الجديدة
- كيفية إرسال إشعارات العودة إلى المخزون للحصول على المزيد من المبيعات
نوصي باستخدام PushEngage لإرسال إشعارات الدفع الخاصة بك.
PushEngage هو البرنامج رقم 1 للإشعارات في العالم. لذا، إذا لم تكن قد فعلت ذلك بالفعل، ابدأ مع PushEngage اليوم!
