7 طرق لتحسين التنقل في الموقع

نشرت: 2023-03-31

مدى سهولة أو صعوبة تنقل الزائرين حول موقع الويب الخاص بك يمكن أن يؤثر بشدة على انطباعهم عنك أو عن علامتك التجارية أو منتجك. يعد التنقل الجيد في الموقع أمرًا ضروريًا لتوفير تجربة مستخدم إيجابية لأنه يساعد الزوار في العثور على المعلومات التي يبحثون عنها دون قضاء الكثير من الوقت في النقر.

الآن ، دعنا نتعمق في خصوصيات وعموميات التنقل في موقع الويب واستكشف كيف يمكنك تحسين التنقل على موقعك.

ما هو نظام تصفح الموقع؟

يشتمل نظام التنقل في موقع الويب على القوائم المختلفة ، وفتات التنقل ، والروابط الداخلية التي تتيح للمستخدمين الوصول إلى أقسام وصفحات مختلفة من موقع الويب. يعتمد تعقيد نظام الملاحة على هيكل الموقع والمحتوى الذي يقدمه الموقع لزواره. يقلل نظام التنقل الجيد من معدل الارتداد ويحسن بنية الصفحة لكل من محركات البحث وتجربة المستخدم.

أمثلة على التنقل في موقع الويب

فيما يلي ثلاثة أنواع شائعة من التنقل في الموقع.

القائمة العلوية

القائمة العلوية هي شريط التنقل الأساسي لموقع الويب الموجود في الجزء العلوي من كل صفحة على موقع الويب. القائمة العلوية عبارة عن تنقل أفقي يتضمن عادةً شعار الموقع وخيارات التنقل الرئيسية. عادةً ما تستخدم مواقع الويب واسعة النطاق مثل Amazon القوائم العليا لتوفير تنقل شامل لموقعها.

قائمة التذييل

يُعد إضافة روابط التنقل إلى أهم صفحات موقع الويب في تذييل صفحة الويب ممارسة جيدة. يمكن لزوار موقع الويب الذين ينتقلون إلى أسفل الصفحة استخدام الروابط الموجودة في التذييل للتنقل. تعد قوائم التذييل جيدة أيضًا لتحسين محركات البحث (SEO) لأنها تنشئ روابط ذات صلة في الصفحات في جميع أنحاء موقعك.

الشريط الجانبي

الشريط الجانبي هو قائمة عمودية موضوعة على الجانب الأيسر أو الأيمن من الصفحة. هذا النوع من التنقل أقل استخدامًا من القائمة العلوية ولكن يمكن رؤيته في العديد من المواقع مثل New York Times ، حيث يتم استخدامه جنبًا إلى جنب مع نظام التنقل في القائمة العلوية.

أربعة مبادئ أساسية لنظام ملاحة فعال

قبل الغوص في قواعد محددة لجعل التنقل رائعًا ، من الضروري ذكر بعض المبادئ الأساسية التي تساهم في تجربة تنقل جيدة.

الرؤية

تأكد من أن التنقل مرئي ويمكن الوصول إليه بسهولة من كل صفحة من صفحات الموقع. من السهل نسبيًا جعل التنقل مرئيًا عندما يكون لديك عدد محدود من خيارات التنقل ، ولكن قد يكون الأمر صعبًا عند تصميم موقع ويب واسع النطاق به العديد من الفئات الفرعية. عند إنشاء نظام التنقل الخاص بك ، حدد أولويات جعل خيارات التنقل عالية المستوى بارزة على موقعك ويسهل العثور عليها.

القدرة على التنبؤ

بغض النظر عن مكان وصول الزائرين إلى موقع الويب الخاص بك ، سواء كان صفحة رئيسية أو صفحة متداخلة ، يجب أن يكون من السهل عليهم فهم مكان وجودهم ضمن التسلسل الهرمي للموقع وأين يمكنهم الانتقال من موقعهم الحالي. قم دائمًا بإبلاغ موقع الزائر الحالي بلمحة (على سبيل المثال ، باستخدام رأس الصفحة) ووضع القوائم في المناطق التي يتوقع الزوار العثور عليها (عادةً ، الأجزاء العلوية والسفلية من صفحة الويب).

وضوح

عندما يتعلق الأمر بتصميم المنتج ، فإن الكلمات التي نستخدمها في واجهة المستخدم مهمة. يجب أن يكون لكل خيار تنقل تسمية واضحة تصف بدقة محتوى كل صفحة. يجب أن يفهم المستخدم ما سيحدث عند النقر فوق خيار التنقل قبل القيام بذلك.

تناسق

التصميم الجيد هو تصميم متسق. تحتاج إلى الحفاظ على قائمة التنقل متسقة عبر جميع صفحات موقع الويب الخاص بك. كلما كان ذلك ممكنًا ، اعرض نفس خيارات التنقل عالية المستوى في كل جزء من موقع الويب لأنها ستمنح المستخدمين إحساسًا بالاستقرار.

عشر توصيات عملية لتصميم ملاحة ممتازة

1. الاستثمار في تصميم هندسة المعلومات

تصميم هندسة المعلومات (IA) هو عملية تنظيم المحتوى في مجموعات منطقية تكون منطقية بالنسبة للزوار. سيساعدك تصميم IA المناسب في تجميع الصفحات والأقسام ذات الصلة معًا وترتيبها بترتيب منطقي يكون منطقيًا لكل من جمهورك المستهدف ومحركات البحث. يجب الانتهاء من تصميم IA قبل أن يبدأ فريق المنتج في تصميم نظام الملاحة.

IA متجذر في بحث المستخدم. يجب أن تأخذ في الاعتبار احتياجات وتفضيلات جمهورك المستهدف وفهم كيفية تفاعلهم مع موقع ويب لتصميم نظام يلبي احتياجاتهم.

2. تصميم خريطة الموقع

خريطة الموقع هي هيكل هيكلي لهيكل تصفح موقع الويب الخاص بك. عادةً ما يتم إنشاء خريطة الموقع كجزء من تصميم هندسة المعلومات ، وهي تعرض التسلسل الهرمي لصفحات الويب التي سيحتوي عليها موقع الويب. تصميم خريطة الموقع هو عملية تكرارية. بمجرد قيام الفريق بإنشاء الإصدار الأولي من خريطة الموقع ، فإنهم بحاجة إلى التركيز على تقليل عدد المستويات في التسلسل الهرمي. كلما أصبح التسلسل الهرمي أعمق ، زاد احتمال أن يصاب الزوار بالارتباك. في معظم الأوقات ، من الممكن تصميم موقع ويب معقد إلى حد ما بثلاثة أو أربعة مستويات من التسلسل الهرمي. يجب أن يكون زوار الموقع قادرين على الوصول إلى أعمق صفحة متداخلة في الموقع في غضون ثلاث نقرات.

3. ضع القوائم حيث يتوقع الزوار رؤيتها

ينص قانون Jakob ، الذي سمي على اسم خبير UX Jakob Nielsen ، على أن المستخدمين يقضون معظم وقتهم على مواقع أخرى ويفضلون أن يعمل موقعك بنفس طريقة عمل المواقع التي يعرفونها بالفعل. عندما يتعلق الأمر بتصميم الملاحة ، فهذا يعني أنه يجب تصميم نظام الملاحة ليلائم توقعات الجمهور. عندما يصل الزوار إلى موقع ويب جديد ، فإنهم يتوقعون رؤية التنقل في الجزء العلوي من الصفحة.

حاول تجنب استخدام قوائم الهامبرغر على سطح المكتب لأن التنقل المخفي يضر بقابلية الاكتشاف.

4. حافظ على نظام الملاحة بسيطًا

يؤكد مبدأ KISS على أن البساطة هي الأفضل ، وهذا ينطبق على جميع أجزاء تصميم المنتج ، بما في ذلك نظام الملاحة. التنقل البسيط يسهل على المستخدمين فهمه واستخدامه.

  • تجنب ازدحام التنقل بالعديد من الخيارات. على سبيل المثال ، عند تصميم قائمة تنقل عالية المستوى ، حاول قصر عدد عناصر القائمة على سبعة. استخدم القائمة المنسدلة للكشف عن الفئات الفرعية.
  • قدم فتات الخبز. فتات الخبز هي أداة مساعدة على التنقل تُستخدم لتوجيه زوار الموقع. إذا كان موقع الويب الخاص بك يحتوي على تسلسل هرمي متعدد المستويات (أكثر من 4) ، فإن مسارات التنقل هي طريقة رائعة لإظهار الزائرين مكان وجودهم على موقع الويب الخاص بك.
  • تجنب التنقل بالأيقونات فقط. يمكن أن توفر الرموز مساحة الشاشة ولكن يمكنها أيضًا أن تجعل تجربة التنقل أكثر صعوبة للزائرين. يوجد عدد محدود من الرموز المفهومة عالميًا (مثل الصفحة الرئيسية والبحث والطباعة). بصرف النظر عن هؤلاء ، قد تكون الرموز الأخرى غير مألوفة لكثير من الناس. لهذا السبب ، إذا كنت تريد استخدام الرموز ، فمن الأفضل دائمًا إرفاقها بالتسميات. عندما تقوم بتضمين تسمية مع رمز ، فإنك تقلل الغموض.

5. عرض وظيفة البحث

إذا كان موقع الويب الخاص بك يحتوي على مئات الصفحات ، فيجب عليك تقديم شريط بحث إلى جانب قوائم التنقل. البحث ليس بديلاً عن التنقل بل هو اختصار يتيح للزوار الذين يعرفون ما يبحثون عنه. البحث مفيد بشكل خاص لمواقع التجارة الإلكترونية لأنه سيمكن المستخدمين من الانتقال مباشرة إلى صفحة منتج معين أو فئة من المنتجات.

6. تحسين التنقل لأجهزة مختلفة

يمكن للأشخاص الوصول إلى موقع الويب الخاص بك من أنواع مختلفة من الأجهزة ، ومن الضروري التأكد من أن نظام التنقل الذي صممته يعمل بشكل جيد على قدم المساواة مع الأجهزة المحمولة الصغيرة وشاشات سطح المكتب الكبيرة.

  • استخدم المساحة الفارغة لديك. بشكل عام ، كلما زادت المسافة البيضاء لديك ، زادت خيارات التنقل التي يمكنك عرضها للزوار. يعتبر Priority + أحد أكثر الأنماط فائدة لقوائم المستوى الأعلى.
  • حجم خيارات التنقل بشكل مناسب. يؤثر حجم خيارات التنقل بشكل مباشر على راحة التفاعل. تزيد خيارات التنقل الصغيرة مثل CTAs التي تقع بالقرب من بعضها البعض من فرصة أن يختار المستخدمون الخيار الخطأ عن طريق الخطأ. إذا قمت بتحسين تصميمك للجوال ، فتأكد من أن خيارات التنقل لها حجم لا يقل عن 44 × 44 بكسل CSS.

7. التحقق من صحة التنقل

بغض النظر عن مقدار الوقت الذي تستثمره في تصميمك ، يجب عليك دائمًا التحقق من صحته مع مستخدمين حقيقيين. اختبر التنقل مع زوار حقيقيين وصقله بناءً على ملاحظاتهم. قم بإجراء جلسات اختبار قابلية الاستخدام مع المستخدمين الذين يمثلون جمهورك المستهدف لتحديد المناطق التي يواجه فيها المستخدمون الاحتكاك ، مثل عدم القدرة على العثور على خيار التنقل. يجب أن تتطابق المهام التي ستستخدمها لاختبار قابلية الاستخدام مع سيناريوهات التفاعل الحقيقي على موقع الويب الخاص بك. على سبيل المثال ، عند تصميم موقع ويب للتجارة الإلكترونية ، سيكون العثور على منتج من أكثر المهام شيوعًا للزائرين.

أظهر لنا ما تقوم بإنشائه

أيًا كان التنقل الذي تختاره لمشروعك التالي - يسعدنا رؤيته! تحقق مما يقوم مجتمع Webflow بإنشائه وقم بإرسال مشاريعك إلى Made in Webflow اليوم!