القوائم المنسدلة القابلة للبحث: جعل القوائم الطويلة سهلة الاستخدام

قائمة منسدلة تضم 200 دولة. قائمة تضم 50 ولاية. مئات من خيارات المنتجات. إن تصفح قوائم منسدلة طويلة أمر محبط، ويؤدي إلى التخلي عن النموذج.

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

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

مشكلة القوائم المنسدلة الطويلة

تصبح القوائم المنسدلة القياسية غير قابلة للاستخدام مع زيادة الخيارات:

مشكلات تجربة المستخدم

• التمرير بلا نهاية – يتطلب العثور على "الولايات المتحدة" في قائمة الدول المرتبة أبجديًا التمرير عبر أكثر من 180 دولة
• كابوس الهاتف المحمول – مساحات تمرير صغيرة على الشاشات اللمسية
• استهلاك الوقت – يقضي المستخدمون أكثر من 10 ثوانٍ في البحث عن خيار واحد
• معرض للخطأ – من السهل اختيار العنصر الخاطئ عن طريق الخطأ
• محبط – يتم تكرار ذلك لحقول القوائم المنسدلة المتعددة

عندما تصبح القوائم المنسدلة مشكلة

كيفية عمل القوائم المنسدلة القابلة للبحث

تجمع القائمة المنسدلة القابلة للبحث بين حقل إدخال نصي وقائمة منسدلة:

1. ينقر المستخدم على حقل القائمة المنسدلة
2. يظهر مربع بحث (أو يصبح الحقل نفسه قابلاً للبحث)
3. يكتب المستخدم بضعة أحرف
4. يتم تصفية الخيارات في الوقت الفعلي لمطابقة المدخلات
5. يختار المستخدم من القائمة المختصرة المفلترة

مثال: اختيار البلد

بدون بحث: تصفح أكثر من 200 دولة للعثور على "ألمانيا"

مع خاصية البحث: اكتب "ger" ← شاهد ألمانيا، الجزائر، نيجيريا ← انقر على ألمانيا

الوقت الموفر: من 10 ثوانٍ فأكثر إلى ثانيتين

حالات الاستخدام الشائعة للقوائم المنسدلة القابلة للبحث

اختيار البلد

المثال الكلاسيكي. مع وجود أكثر من 195 دولة، يُعد البحث أمراً ضرورياً:

• اكتب "uni" → الولايات المتحدة، المملكة المتحدة، الإمارات العربية المتحدة
• اكتب "أوس" → أستراليا، النمسا
• اكتب "جديد" → نيوزيلندا، كاليدونيا الجديدة

اختيار الولاية/المقاطعة

50 ولاية أمريكية، 13 مقاطعة كندية، أو مناطق حول العالم:

• اكتب "cal" → كاليفورنيا
• اكتب "جديد" → نيويورك، نيوجيرسي، نيو هامبشاير، نيو مكسيكو

المنتجات

مواقع التجارة الإلكترونية التي تضم مئات الأنواع من المنتجات:

• اكتب "لابتوب" → أجهزة لابتوب، ملحقات لابتوب، حقائب لابتوب
• اكتب "هاتف" → هواتف، حافظات هواتف، شواحن هواتف

المسميات الوظيفية / القطاعات

استمارات التوظيف مع قوائم وظائف شاملة:

• اكتب "مهندس" → مهندس برمجيات، مهندس مدني، مهندس ميكانيكي
• اكتب "سوق" → مدير تسويق، محلل سوق، أخصائي سوق

اللغات

تفضيل اللغة مع أكثر من 100 خيار:

• اكتب "span" → الإسبانية
• اكتب "chin" → الصينية (المبسطة)، الصينية (التقليدية)

الجامعات/المدارس

قوائم المؤسسات التعليمية:

• اكتب "harvard" → جامعة هارفارد
• اكتب "MIT" → معهد ماساتشوستس للتكنولوجيا

المناطق الزمنية

أكثر من 400 خيار للمناطق الزمنية:

• اكتب "pacific" → Pacific/أوكلاند، Pacific/هونولولو، US/باسيفيك
• اكتب "نيويورك" → أمريكا/نيويورك

إعداد قوائم منسدلة قابلة للبحث

إليك كيفية إنشاء قوائم منسدلة قابلة للبحث باستخدام منشئ النماذج التلقائي:

الخطوة 1: تثبيت أداة إنشاء النماذج التلقائية

1. انتقل إلى البرنامج المساعد في التأليف الإضافات → إضافة جديد
2. البحث عن "AFB"(الاسم المختصر لـ Auto Form Builder)"
3. تجد "AFB – منشئ النماذج التلقائي – منشئ النماذج بالسحب والإفلات"
4. انقر تثبيت الآن، ثم التنشيط

الخطوة الثانية: إضافة حقل قائمة منسدلة

1. أنشئ أو عدّل نموذجك
2. اسحب اسقاط أضف الحقل إلى نموذجك
3. انقر لفتح الإعدادات

الخطوة الثانية: أضف خياراتك

أدخل قائمة خياراتك. بالنسبة للقوائم الطويلة، يمكنك:

• اكتب يدويًا أدخل كل خيار على حدة
• إضافة بالجملة – ألصق قائمة بالخيارات (خيار واحد في كل سطر)

الخطوة الرابعة: تفعيل البحث

في إعدادات القائمة المنسدلة، ابحث عن بحث or تفعيل البحث خيار. قم بتشغيله.

ستتضمن القائمة المنسدلة الآن مربع بحث/تصفية يقوم بتصفية الخيارات أثناء كتابة المستخدمين.

الخطوة 5: ضبط سلوك البحث

بحسب أداة إنشاء النماذج التي تستخدمها، قد تتوفر لديك خيارات مثل:

• الحد الأدنى من الأحرف – ابدأ التصفية بعد كتابة X حرفًا
• وظيفة البحث – طابق من بداية الخيار أو في أي مكان
• نص العنصر النائب - "اكتب للبحث..." أو "ابحث عن البلدان..."

أفضل الممارسات في مجال القوائم المنسدلة

1. فعّل خاصية البحث دائمًا لأكثر من 20 خيارًا

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

2. استخدم نصًا توضيحيًا واضحًا

أخبر المستخدمين أنه بإمكانهم البحث:

• "اختر دولة (اكتب للبحث)"
• "اختر ولايتك..."
• "ابحث أو اختر..."

3. ترتيب الخيارات منطقياً

حتى مع البحث، فإن ترتيب الخيارات مهم:

• مرتب حسب الحروف الأبجدية – الأفضل للأسماء (الدول، الولايات)
• الأكثر شيوعاً أولاً – ضع الخيارات الشائعة في الأعلى (الولايات المتحدة، المملكة المتحدة، كندا)
• مجمعة – فئات مع فاصل

4. تضمين الاختلافات الشائعة

قد يبحث المستخدمون عن:

• "الولايات المتحدة الأمريكية" أو "الولايات المتحدة" أو "أمريكا"
• "المملكة المتحدة" أو "بريطانيا" أو "إنجلترا"

إذا أمكن، قم بتضمين الاختصارات الشائعة أو الاختلافات التي تشير إلى نفس الخيار.

5. الاختبار على الهاتف المحمول

ينبغي أن تعمل القوائم المنسدلة القابلة للبحث بسلاسة على الأجهزة التي تعمل باللمس:

• يمكن النقر بسهولة على حقل البحث
• تظهر لوحة المفاتيح للكتابة
• الخيارات كبيرة بما يكفي للنقر بدقة

متى لا تستخدم القوائم المنسدلة القابلة للبحث

لا تُعدّ القوائم المنسدلة القابلة للبحث هي الحل دائمًا:

القوائم المختصرة (أقل من 10 خيارات)

بالنسبة لـ 5 إلى 10 خيارات، فإن القائمة المنسدلة القياسية أسرع. لا حاجة للكتابة عندما يمكنك رؤية كل شيء دفعة واحدة.

عندما لا يعرف المستخدمون المصطلح الدقيق

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

نعم/لا أو خيارات ثنائية

استخدم أزرار الاختيار بدلاً من ذلك. خياران لا يحتاجان إلى قائمة منسدلة على الإطلاق.

النطاقات الرقمية

بالنسبة للفئات العمرية أو اختيار الكمية، يرجى مراعاة ما يلي:

• حقل إدخال الرقم
• المنزلق
• قائمة منسدلة قصيرة (1-10)

بدائل للقوائم المنسدلة القابلة للبحث

بناءً على بياناتك، ضع في اعتبارك هذه البدائل:

حقل النص المُكمل تلقائيًا

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

قوائم منسدلة متتالية

قسّم قائمة طويلة واحدة إلى قائمتين أقصر:

• القائمة المنسدلة الأولى: اختر القارة
• القائمة المنسدلة الثانية: اختر البلد (مصفى حسب القارة)

أزرار الراديو التي تحتوي على "أخرى"

اعرض أفضل 5-7 خيارات كأزرار اختيار مع خيار "أخرى" يكشف عن حقل نصي.

خيارات مجمعة/مصنفة

استخدم optgroups لتنظيم الخيارات حسب الفئة:

• أمريكا الشمالية
  • كندا
  • المكسيك
  • الولايات المتحدة
• أوروبا
  • فرنسا
  • ألمانيا
  • المملكة المتحدة

قوائم الخيارات الجاهزة

لا تعيد اختراع العجلة. إليك بعض القوائم الشائعة التي ستحتاجها:

دولة

195 دولة عضواً في الأمم المتحدة بالإضافة إلى الأقاليم. يُنصح بوضع الدول المشتركة (الولايات المتحدة، المملكة المتحدة، كندا، أستراليا) في الأعلى، ثم الترتيب الأبجدي.

الولايات المتحدة

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

المقاطعات الكندية

13 مقاطعة وإقليم. قصيرة بما يكفي بحيث يكون البحث اختيارياً.

المناطق الزمنية

استخدم معرّفات المناطق الزمنية القياسية (أمريكا/نيويورك، أوروبا/لندن). قم بالتجميع حسب المنطقة.

اللغات

رموز لغات ISO مع أسماء العرض. ضع اللغات الشائعة أولاً.

القطاعات

قوائم التصنيف الصناعي القياسية (NAICS، SIC) أو قوائم مخصصة لجمهورك.

اعتبارات الأداء

قوائم كبيرة جدًا (أكثر من 1000 خيار)

للقوائم الكبيرة للغاية:

• خيارات التحميل عند الطلب - جلب البيانات من الخادم أثناء كتابة المستخدم
• حدد الحد الأدنى من الأحرف - يتطلب الأمر كتابة حرفين أو ثلاثة قبل البحث
• عرض نتائج محدودة – عرض أفضل 20 مباراة، وليس جميع المباريات الـ 500

تأثير تحميل الصفحة

تؤدي قوائم الخيارات الطويلة إلى زيادة حجم الصفحة. بالنسبة للقوائم التي تحتوي على أكثر من 500 خيار، يُرجى مراعاة ما يلي:

• خيارات التحميل عبر AJAX
• التقسيم إلى قوائم منسدلة متتالية
• استخدام البحث من جانب الخادم

سهولة الوصول والشمولية

تأكد من إمكانية الوصول إلى القوائم المنسدلة القابلة للبحث:

التنقل باستخدام لوحة المفاتيح

• اضغط على زر Tab لتركيز المجال
• اكتب للبحث
• استخدم مفاتيح الأسهم للتنقل بين الخيارات
• أدخل للاختيار
• الهروب للإغلاق

قارئات الشاشة

• ملصقات ARIA المناسبة
• أعلن عدد النتائج
• أعلن عن الخيار المحدد

المؤشرات البصرية

• حالات التركيز الواضح
• الخيار الحالي المميز
• مؤشر التحميل أثناء البحث

الأسئلة الشائعة

كم عدد الخيارات التي أحتاجها قبل أن أحتاج إلى البحث؟

فعّل خاصية البحث لأي قائمة منسدلة تحتوي على أكثر من 20 خيارًا. أما بالنسبة للقوائم التي تحتوي على أكثر من 50 خيارًا، فالبحث ضروري. بل إن بعض المستخدمين يفضلون البحث حتى لو كانت القائمة تحتوي على 10 أو 15 خيارًا فقط.

هل يجب أن تتطابق نتائج البحث من البداية أم من أي مكان آخر؟

تُعدّ خاصية البحث "في أي مكان" أكثر تسامحًا. فعند البحث عن كلمة "york" يتم العثور على "نيويورك". أما البحث عن الكلمات التي تبدأ بكلمة واحدة فقط فهو أسرع بالنسبة للمصطلحات المعروفة.

هل لا يزال بإمكان المستخدمين تصفح جميع الخيارات؟

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

ماذا لو أخطأ المستخدمون في كتابة كلمات البحث؟

لا يتعامل البحث الأساسي مع الأخطاء الإملائية. بالنسبة للحقول المهمة (مثل البلد)، تأكد من تغطية الأخطاء الإملائية الشائعة أو استخدم المطابقة التقريبية إن وجدت.

هل تعمل القوائم المنسدلة القابلة للبحث على الهواتف المحمولة؟

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

ملخص

اجعل القوائم المنسدلة الطويلة سهلة الاستخدام:

1. تحديد القوائم الطويلة – أي قائمة منسدلة تحتوي على 20 خيارًا أو أكثر
2. تمكين البحث – اسمح للمستخدمين بالكتابة للتصفية
3. استخدم عناصر نائبة واضحة - "اكتب للبحث..."
4. رتب بشكل منطقي – العناصر الأكثر شيوعاً أولاً، ثم أبجدياً
5. اختبار على الهاتف المحمول – ضمان تجربة لمس سلسة
6. ضع في اعتبارك البدائل – قوائم منسدلة متتالية، خيارات مجمعة

خاتمة

تؤدي القوائم المنسدلة الطويلة إلى انخفاض معدلات إكمال النماذج. قوائم منسدلة قابلة للبحث تغيير التجربة - يجد المستخدمون خيارهم في ثوانٍ بدلاً من التمرير بلا نهاية.

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

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

هل أنت مستعد لتحسين نماذجك؟ قم بتنزيل أداة إنشاء النماذج التلقائية واجعل قوائمك المنسدلة سهلة الاستخدام اليوم.