مساعدة المستخدمين على تجنب إعادة إدخال البيانات في النماذج

بعد التعرّف على عنصر النموذج وكيفية جعل النموذج تفاعليًا، لنرَ كيف يمكنك مساعدة المستخدمين في تجنُّب إعادة إدخال البيانات.

الاستفادة إلى أقصى حدّ من ميزة "الملء التلقائي"

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

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

هل انتقلت إلى مدينة أخرى؟ لا تقلق بشأن الحصول على العنوان القديم كخيار دائم. يمكنك تعديل بيانات العنوان التي حفظها المتصفّح من أجل إبقائها محدَّثة.

كيف تعمل ميزة الملء التلقائي في المتصفح؟

التوافق مع المتصفح

  • 14
  • ≤79
  • 4
  • 6

المصدر

يمكن أن يظهر حقل العنوان بشكل مختلف جدًا على مواقع إلكترونية مختلفة. كيف يعرف المتصفح أنه حقل عنوان؟

تستخدم المتصفحات استدلالية لتحديد حقل العنوان. ما هي قيم السمات name وtype وid؟ هل هناك السمة autocomplete في عنصر التحكّم في النموذج؟

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

مساعدة المتصفّحات في استخدام ميزة الملء التلقائي

لنرَ ما يمكنك فعله لمساعدة المتصفحات في تقديم خيارات الملء التلقائي الصحيحة.

استخدام قيم سمات معقولة

كما تعلمت، يمكن للمتصفحات تحديد نوع البيانات من خلال الاطلاع على سمات عنصر التحكم في النموذج.

<label for="email">Email</label>
<input type="email" name="email" id="email">

هل لديك حقل يجب أن يُدخل فيه المستخدمون عناوين بريدهم الإلكتروني؟ استخدِم email كقيمة للسمة name وid وtype. ثلاثة تلميحات للمتصفّح بأنّ هذا الحقل حقل بريد إلكتروني.

سمة الإكمال التلقائي

هناك أمثلة أخرى قد يصعب على المتصفّحات فيها تحديد نوع البيانات فقط من السمات name وid وtype. يمكنك المساعدة في ذلك باستخدام سمة autocomplete.

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

يمكنك معرفة المزيد من المعلومات حول استخدام الإكمال التلقائي والملء التلقائي في وحدة لاحقة.

التحقق من فهمك

اختبر معلوماتك عن الملء التلقائي

استنادًا إلى السمات التي يتم تقديم ميزة الملء التلقائي فيها؟

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

المراجِع