أفضل الممارسات المتعلّقة بنموذج الاشتراك

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

Sam Dutton

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

في ما يلي مثال على نموذج اشتراك بسيط جدًا يوضّح جميع أفضل الممارسات:

قائمة التحقق

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

تجنُّب تسجيل الدخول إذا أمكن ذلك

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

أفضل نموذج اشتراك هو عدم توفّر نموذج اشتراك.

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

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

توضيح عملية تسجيل الدخول

يجب أن يكون من الواضح كيفية إنشاء حساب على موقعك الإلكتروني، مثلاً من خلال زر تسجيل الدخول في أعلى يسار الصفحة. تجنَّب استخدام رمز غامض أو صياغة مبهمة ("انضم إلينا"، "انضم إلينا") وعدم إخفاء زر تسجيل الدخول في قائمة التنقّل. لخّص خبير سهولة الاستخدام، ستيف كروغ، هذا النهج المتعلّق بسهولة استخدام المواقع الإلكترونية بالجملة التالية: لا تجعلني أفكر! إذا كنت بحاجة إلى إقناع الآخرين في فريق الويب، استخدِم الإحصاءات لتوضيح تأثير الخيارات المختلفة.

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

// auth2 is initialized with gapi.auth2.init()
if (auth2.isSignedIn.get()) {
  var profile = auth2.currentUser.get().getBasicProfile();
  console.log(`Email: ${profile.getEmail()}`);
}

توضيح كيفية الوصول إلى تفاصيل الحساب

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

تقليل الفوضى في النماذج

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

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

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

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

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

مراعاة مدة الجلسة

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

ضَع في اعتبارك ما إذا كان المستخدمون يستعملون جهازًا جوّالاً أو كمبيوتر مكتبيًا، وما إذا كانوا يشاركون المحتوى على كمبيوتر مكتبي أو يشاركون الأجهزة.

مساعدة خدمات إدارة كلمات المرور في اقتراح كلمات مرور وتخزينها بأمان

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

لذلك، من المهم جدًا ترميز نماذج الاشتراك بشكل صحيح، ولا سيما استخدام قيم الإكمال التلقائي الصحيحة. بالنسبة إلى نماذج الاشتراك، استخدِم autocomplete="new-password" لكلمات المرور الجديدة، وأضِف قيم التعبئة التلقائية الصحيحة إلى حقول النموذج الأخرى حيثما أمكن، مثل autocomplete="email" وautocomplete="tel". يمكنك أيضًا مساعدة أدوات إدارة كلمات المرور من خلال استخدام قيم name وid مختلفة في نماذج الاشتراك وتسجيل الدخول، وذلك لعنصر form نفسه، بالإضافة إلى أي عناصر input وselect وtextarea.

عليك أيضًا استخدام سمة type المناسبة لتوفير لوحة المفاتيح المناسبة على الأجهزة الجوّالة وتفعيل عملية التحقّق الأساسية المضمّنة من خلال المتصفّح. يمكنك الاطّلاع على مزيد من المعلومات من أفضل الممارسات المتعلّقة بنموذج الدفع والعنوان.

ضمان إدخال المستخدمين كلمات مرور آمنة

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

ومع ذلك، يريد العديد من المستخدمين إدخال كلمات المرور الخاصة بهم، لذا عليك تنفيذ قواعد لقوة كلمة المرور. يوضّح المعهد الوطني للمعايير والتكنولوجيا في الولايات المتحدة كيفية تجنُّب كلمات المرور غير الآمنة.

عدم السماح بكلمات المرور المحتمَل تعرّضها للاختراق

مهما كانت القواعد التي تختارها لكلمات المرور، يجب ألا تسمح مطلقًا بكلمات المرور التي تم الكشف عنها في عمليات خرق أمني.

بعد أن يدخل المستخدم كلمة مرور، عليك التأكّد من أنّها ليست كلمة مرور تم اختراقها من قبل. يوفّر الموقع الإلكتروني Have I Been Pwned واجهة برمجة تطبيقات للتحقّق من كلمات المرور، أو يمكنك تشغيل هذه الواجهة كخدمة بنفسك.

يتيح لك "مدير كلمات المرور في Google" أيضًا التحقّق مما إذا تم اختراق أي من كلمات المرور الحالية.

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

عدم حظر لصق كلمات المرور

لا تسمح بعض المواقع الإلكترونية بلصق النص في حقول كلمات المرور.

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

عدم تخزين كلمات المرور أو نقلها كنص عادي مطلقًا

احرص على تضمين قيمة عشوائية في كلمات المرور وتجزئتها، ولا تحاول ابتكار خوارزمية تجزئة خاصة بك.

عدم فرض تعديلات على كلمة المرور

لا تجبر المستخدمين على تعديل كلمات المرور بشكل عشوائي.

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

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

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

تسهيل تغيير كلمات المرور أو إعادة ضبطها

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

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

للحفاظ على أمان نشاطك التجاري والمستخدمين، من المهم بشكل خاص مساعدة المستخدمين على تغيير كلمات المرور إذا تبيّن لهم أنّه تم اختراقها. لتسهيل ذلك، عليك إضافة عنوان URL /.well-known/change-password إلى موقعك الإلكتروني يعيد التوجيه إلى صفحة إدارة كلمات المرور. يتيح ذلك لخدمات إدارة كلمات المرور توجيه المستخدمين مباشرةً إلى الصفحة التي يمكنهم فيها تغيير كلمة المرور الخاصة بموقعك الإلكتروني. تتوفّر هذه الميزة الآن في Safari وChrome، وستتوفّر قريبًا في متصفّحات أخرى. توضّح مقالة مساعدة المستخدمين في تغيير كلمات المرور بسهولة من خلال إضافة عنوان URL معروف لتغيير كلمات المرور كيفية تنفيذ ذلك.

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

توفير إمكانية تسجيل الدخول باستخدام موفِّري الهوية التابعين لجهات خارجية

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

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

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

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

تبسيط عملية تبديل الحسابات

يشارك العديد من المستخدمين الأجهزة ويتبادلون الحسابات باستخدام المتصفّح نفسه. سواء كان المستخدمون يستخدمون ميزة تسجيل الدخول الموحّد أو لا، عليك تسهيل عملية تبديل الحسابات.

ننصحك بتوفير المصادقة المتعدّدة العوامل

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

ننصحك بالتأكيد بتوفير (أو فرض) المصادقة المتعددة العوامل إذا كان موقعك الإلكتروني يتعامل مع معلومات شخصية أو حساسة.

التعامل بحذر مع أسماء المستخدمين

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

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

احرص أيضًا على استخدام autocomplete="username" لأسماء المستخدمين.

الاختبار على مجموعة من الأجهزة والأنظمة الأساسية والمتصفّحات والإصدارات

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

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

تحتاج إلى بيانات ميدانية بالإضافة إلى بيانات مختبرية لفهم تجربة المستخدمين مع نماذج الاشتراك. توفّر "إحصاءات Google" ومراقبة تجربة المستخدم الحقيقي بيانات عن التجربة الفعلية للمستخدمين، مثل المدة التي تستغرقها صفحات الاشتراك في التحميل، ومكوّنات واجهة المستخدم التي يتفاعل معها المستخدمون (أو لا يتفاعلون معها)، والمدة التي يستغرقها المستخدمون لإكمال عملية الاشتراك.

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

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

مواصلة التعلّم

• أفضل الممارسات المتعلّقة بنماذج تسجيل الدخول
• أفضل الممارسات المتعلّقة بنموذج الدفع والعنوان
• إنشاء نماذج مذهلة
• أفضل الممارسات لتصميم النماذج على الأجهزة الجوّالة
• عناصر تحكّم في النماذج أكثر فعالية
• إنشاء نماذج سهلة الاستخدام
• تبسيط عملية الاشتراك باستخدام Credential Management API
• تأكيد أرقام الهواتف على الويب باستخدام WebOTP API

صورة من @ecowarriorprincess على Unsplash