کمک به کاربران برای ثبت نام
فرم ثبت نام اغلب اولین تعامل با یک فرم در وب سایت شماست. طراحی خوب فرم ثبت نام بسیار مهم است و یک فرم امن ضروری است.
برای یادگیری نحوه کمک به کاربران در ثبت نام در وبسایت خود، به فرم ثبت نام نگاه کنید.
فرم ثبت نام را ساده نگه دارید و فقط کنترلهای فرم مورد نیاز برای ایجاد حساب کاربری را نمایش دهید. برای کمک به کاربران در دریافت صحیح جزئیات حساب کاربری، کنترلهای فرم خود را دو برابر نکنید. در عوض، یک ایمیل تأیید ارسال کنید.
جزئیات حساب
شما میتوانید با استفاده از ویژگی autocomplete مناسب، به کاربران در پر کردن جزئیات حساب کاربریشان کمک کنید. برای فیلد ایمیل autocomplete="email" و برای فیلد new-password autocomplete="new-password" استفاده کنید.
درباره پر کردن خودکار کنترلهای ورودی بیشتر بدانید.
همچنین میتوانید با ارائه یک <button> با عنوان «developer-password» به کاربران در وارد کردن رمز عبور ایمن کمک کنید. درباره الگوی «developer-password» بیشتر بدانید.
فرم ثبت نام خود را ایمن کنید
هرگز رمزهای عبور را به صورت متن ساده ذخیره یا ارسال نکنید. حتماً رمزهای عبور را salt و hash کنید —و سعی نکنید الگوریتم هشینگ خودتان را اختراع کنید .
ارائه احراز هویت چند عاملی ، به خصوص اگر دادههای شخصی یا حساس را ذخیره میکنید. بهترین شیوههای SMS OTP و فعالسازی احراز هویت قوی با WebAuthn نحوه پیادهسازی احراز هویت چند عاملی را توضیح میدهند.
مطمئن شوید که کاربران از رمزهای عبور لو رفته استفاده نمیکنند. برای مثال، از API سایت Have I Been Pwned برای شناسایی رمزهای عبور لو رفته استفاده کنید و به کاربران خود پیشنهاد دهید که رمز عبور جدید دیگری را وارد کنند، یا در صورت لو رفتن رمز عبورشان به آنها هشدار دهید.
کمک به کاربران برای ورود
ببینید چگونه یک فرم ورود به سیستم بسازید تا مطمئن شوید کاربران میتوانند وارد وبسایت شما شوند.
محل دکمههای ثبت نام و ورود را مشخص کنید. مطمئن شوید که فرم شما در دستگاههای لمسی قابل استفاده است:
- اندازه هدف ضربه (tap target ) دکمهها حداقل ۴۸ پیکسل است.
-
font-sizeعناصر فرم شما به اندازه کافی بزرگ است (20pxتقریباً برای موبایل مناسب است). - بین کنترلهای فرم فضای کافی (
margin) وجود دارد و ورودیها به اندازه کافی بزرگ هستند (حداقلpadding: 15pxدر موبایل استفاده کنید).
به کاربران کمک کنید تا ایمیل و رمز عبور خود را وارد کنند
به مرورگرها و مدیران رمز عبور کمک کنید تا جزئیات حساب را به صورت خودکار تکمیل کنند. برای فیلد ایمیل autocomplete="email" و برای فیلد رمز عبور فعلی autocomplete="current-password" استفاده کنید.
برای کمک به کاربران در پر کردن دستی جزئیات حساب کاربری خود، type="email" برای فیلد ایمیل استفاده کنید تا صفحهکلید روی صفحه نمایش مناسب در دستگاههای تلفن همراه نمایش داده شود.
از ویژگی required برای فیلد ایمیل و رمز عبور خود استفاده کنید تا بتوانید هنگام ارسال فرم توسط کاربر، مقادیر نامعتبر را به او هشدار دهید. به جای انتظار برای ارسال فرم، از اعتبارسنجی بلادرنگ استفاده کنید تا به کاربران کمک کنید دادههای نامعتبر را به محض ورود اصلاح کنند.
اطمینان حاصل کنید که کاربران میتوانند رمز عبوری را که وارد کردهاند ببینند
متنی که برای <input type="password"> وارد میکنید، به طور پیشفرض مبهم است تا به حریم خصوصی کاربران احترام گذاشته شود. با نمایش یک <button> برای تغییر وضعیت نمایش متن وارد شده، به کاربران در وارد کردن رمز عبورشان کمک کنید.
درباره پیادهسازی <button> برای نمایش رمز عبور بیشتر بدانید.
مطمئن شوید که فرمهای ورود و ثبتنام شما قابل استفاده هستند
فرمهای ورود و ثبتنام خود را مرتباً با افراد واقعی آزمایش کنید تا مطمئن شوید که احراز هویت طبق انتظار کار میکند. از تجزیه و تحلیل و اندازهگیری کاربر واقعی (RUM) برای جمعآوری دادههای میدانی و از ابزارهایی مانند Lighthouse و PageSpeed Insights برای اجرای آزمایشها توسط خودتان استفاده کنید. درباره آزمایش قابلیت استفاده و جمعآوری دادههای تحلیلی بیشتر بدانید.
مطمئن شوید که فرمهای شما در مرورگرهای مختلف و پلتفرمهای مختلف کار میکنند. فرم خود را در اندازههای مختلف صفحه نمایش، فقط با استفاده از صفحه کلید یا با استفاده از یک صفحهخوان مانند VoiceOver در مک یا NVDA در ویندوز آزمایش کنید.
به کاربران کمک کنید تنظیمات حساب خود را تغییر دهند
مطمئن شوید که کاربران میتوانند تمام تنظیمات حساب کاربری، از جمله آدرسهای ایمیل، رمزهای عبور و نامهای کاربری را تغییر دهند.
شفافسازی کنید که چه دادههایی را ذخیره میکنید و به کاربران کمک کنید تا تمام اطلاعات شخصی خود را در هر زمانی دانلود کنند. اطمینان حاصل کنید که کاربران در صورت تمایل میتوانند حساب خود را حذف کنند. ویژگیهای مدیریت حساب مانند این موارد ممکن است در برخی مناطق یک الزام قانونی باشد.
اطمینان حاصل کنید که کاربران میتوانند رمزهای عبور خود را بهروزرسانی کنند
بهروزرسانی رمز عبور را برای کاربران آسانتر کنید.
قبل از تغییر رمز عبور، از کاربران رمز عبور فعلی را بپرسید و ایمیلی در مورد تغییر رمز عبور با امکان بازگرداندن و قفل کردن حساب کاربری ارسال کنید.
گزینه درخواست رمز عبور جدید را اضافه کنید و برای درخواست رمز عبور جدید، یک URL با پسوند .well-known ارائه دهید.