فعال کردن ورود سریع به سیستم: الگوهای تجربه کاربری حالت واسط کاربر فوری

منتشرشده: ۳۰ سپتامبر ۲۰۲۶، آخرین به‌روزرسانی: ۷ اکتبر ۲۰۲۶

نمای کلی

حالت «میانای کاربری فوری» مشکل ازدست رفتن زمینه و افت کاربر ناشی از پیمایش به صفحه ورود به سیستم اختصاصی را حل می‌کند. این API امکان ورود سریع به سیستم را فراهم می‌کند و به کاربران اجازه می‌دهد ورود به سیستم را بااستفاده از گذرکلیدها یا گذرواژه‌های ذخیره‌شده در همان صفحه‌ای که درحال مشاهده یا کار کردن در آن هستند تکمیل کنند و از بافت خود خارج نشوند.

برخلاف واسط کاربر شرطی، که وقتی کاربر روی فیلد ورودی نوشتار تمرکز می‌کند پیشنهادهای تکمیل خودکار را نمایان می‌کند، حالت «واسط کاربر فوری» در پاسخ به کلیک روی دکمه یا پیوند، بلافاصله کادر گفتگوی اصالت‌سنجی مرورگر را فرا می‌خواند (درحال‌حاضر، uiMode فقط "immediate" را می‌پذیرد اما ممکن است در آینده تغییر کند).

سه ویژگی اصلی باعث می‌شود حالت «میانای کاربری فوری» برای ورود سریع به سیستم به‌طور منحصربه‌فردی مؤثر باشد:

  • رد کردن رمزینه‌های پاسخ‌سریع بین‌دستگاهی: اگر گذرکلیدهای بلافاصله دردسترس یا گذرواژه‌های ذخیره‌شده در دستگاه وجود داشته باشد، مرورگر بلافاصله چارگوش گفتگوی اصالت‌سنجی را نمایش می‌دهد. اگر هیچ‌کدام وجود نداشته باشد، بدون نمایش صفحه رمزینه پاسخ‌سریع بین‌دستگاهی برای تلفن‌های هوشمند، بلافاصله از برنامه خارج می‌شود. این کار به سایت شما امکان می‌دهد تا به‌طور طبیعی به ناوبری جایگزین عادی خود (مانند رفتن به صفحه ورود به سیستم) منتقل شود.
  • میانای کاربری انتخاب حساب شهودی: به‌جای فهرست کردن انواع مختلف اطلاعات اعتباری به‌صورت جداگانه، تفاوت‌های زیربنایی بین گذرکلیدها و گذرواژه‌ها را پنهان می‌کند تا گزینشگر حساب شهودی‌ای ارائه دهد که بر حسابی که کاربر می‌خواهد با آن به سیستم وارد شود تمرکز دارد.
  • بهبود تدریجی ایمن: اگرچه فقط در مرورگرهای Google Chrome و Chromium پشتیبانی می‌شود، استفاده از تشخیص ویژگی به شما امکان می‌دهد بدون مختل کردن جریان‌های ورود به سیستم موجود برای کاربران مرورگرهای پشتیبانی‌نشده (مانند Safari یا Firefox) یا در «حالت ناشناس»، ورود به سیستم سریع را به کاربران در محیط‌های پشتیبانی‌شده ارائه دهید.

برای جزئیات مربوط به نحوه عملکرد API در پشت صحنه و نحوه پیاده‌سازی تشخیص ویژگی، به حالت «میانای کاربر فوری» برای ورود به سیستم مراجعه کنید. در این سند، الگوهای تجربه کاربری توصیه‌شده‌ای را که با حالت «واسط کاربری فوری» تبدیل را افزایش می‌دهند بررسی می‌کنیم، و همچنین الگوهای طراحی ضدالگو را که باید از آن‌ها اجتناب کنید معرفی می‌کنیم.

مؤثرترین مکان برای استفاده از حالت «واسط کاربر فوری» درست قبل‌از پیمایش صفحه است. هرگاه کاربر غیرتأییدشده (یا کاربری که جلسه او منقضی شده است) روی پیوند یا دکمه کنشی کلیک کند که معمولاً او را به صفحه ورود به سیستم هدایت می‌کند، فراخوانی حالت «میانای کاربر فوری» در همان لحظه دقیقاً تجربه کاربری یکپارچه‌ای ایجاد می‌کند که هرگز جریان کار کاربر را قطع نمی‌کند.

اکثر وب‌سایت‌ها پیوند «ورود به سیستم» را در سرصفحه جهانی در بالای صفحه قرار می‌دهند که به صفحه ورود به سیستم اختصاصی هدایت می‌کند. وقتی کاربر روی این پیوند در صفحه‌ای که درحال مرور آن است کلیک می‌کند، توقف موقت پیمایش و فراخوانی حالت «میانای کاربری فوری» به مرورگر امکان می‌دهد تا درصورت وجود اطلاعات اعتباری در دستگاه، یک چارگوش گفتگوی انتخاب حساب درست روی صفحه فعلی نمایش دهد.

پس‌از اینکه کاربر حساب خود را انتخاب کرد و اصالت‌سنجی را تکمیل کرد، سرایند بدون پیمایش صفحه به حالت ورود به سیستم به‌روزرسانی می‌شود و به کاربر اجازه می‌دهد بدون اینکه از صفحه‌ای که درحال مشاهده آن بود دور شود به مرور ادامه دهد. برعکس، اگر اطلاعات اعتباری در دستگاه وجود نداشته باشد، رابط کاربری مرورگر نمایش داده نمی‌شود و کاربر دقیقاً همان‌طور که در ابتدا قصد داشته است به‌راحتی به صفحه ورود به سیستم هدایت می‌شود.

ورود به سیستم پویا در زمان تسویه‌حساب (تجارت الکترونیک)

در سایت‌های تجارت الکترونیک، انتقال از سبد خرید به تسویه‌حساب یکی از رایج‌ترین نقاطی است که به‌دلیل اصطکاک پیمایش صفحه باعث رها کردن سبد خرید می‌شود. با فراخواندن حالت «میانای کاربری فوری» در لحظه‌ای که خریدار اصالت‌سنجی‌نشده روی دکمه «رفتن به تسویه‌حساب» در صفحه سبد خرید کلیک می‌کند، گفتگوی انتخاب حساب درست در همان جایی که دکمه کلیک شده است ظاهر می‌شود و اصالت‌سنجی با یک ضربه تکمیل می‌شود.

وقتی اصالت‌سنجی موفقیت‌آمیز باشد، خریدار به‌طور کامل از صفحه ورود به سیستم عبور می‌کند و مستقیماً به صفحه نهایی تأیید ارسال و پرداخت (صفحه تسویه‌حساب) هدایت می‌شود، که به‌طور چشمگیری مراحل لازم برای تکمیل خرید را کاهش می‌دهد. اگر هیچ اطلاعات اعتباری وجود نداشته باشد، خریدار به‌طور معمول به صفحه انتخاب ورود به سیستم یا تسویه‌حساب مهمان منتقل می‌شود. می‌توانید سایتتان را طوری طراحی کنید که براساس الزامات کسب‌وکارتان، امکان تسویه‌حساب مهمان را فراهم کند یا ورود به سیستم را الزامی کند. حالت رابط کاربری فوری برای ازبین بردن اصطکاک تسویه‌حساب برای مشتریان بازگشتی ارائه می‌شود.

ورود به سیستم به‌خط برای کنش‌های کوچک (پسندیدن، نشانک‌گذاری، ذخیره کردن)

وقتی بازدیدکنندگان در فیدهای اجتماعی، سایت‌های انجمن، یا کاتالوگ‌های محصول تجارت الکترونیک مرور می‌کنند، مجبور کردن آن‌ها به هدایت تمام‌صفحه‌ای به صفحه ورود به سیستم هر بار که سعی می‌کنند پستی را «بپسندند» یا موردی را «نشانک‌گذاری» کنند ممکن است باعث شود برخی‌از کاربران از انجام این کار صرف‌نظر کنند.

وقتی بازدیدکننده‌ای که وارد سیستم نشده است روی دکمه کنشی مثل «پسندیدن»، «نشانک‌گذاری»، یا «ذخیره کردن» کلیک می‌کند، ارائه کادر گفتگوی حالت «واسط کاربر فوری» در همان مکان به تکمیل درستی‌سنجی هویت و راه‌اندازی فوری گزارش کنش و پویانمایی واسط کاربر (مثل قرمز شدن نماد قلب) کمک می‌کند. موقعیت پیمایش به اندازه یک پیکسل حرکت نمی‌کند و غوطه‌وری در مرور کاملاً حفظ می‌شود. اگر اطلاعات اعتباری وجود ندارد، به‌جای اینکه بلافاصله کاربر را به صفحه دیگری هدایت کنید، می‌توانید یک مدال ورود به سیستم درون‌خطی سبک روی صفحه فعلی نمایش دهید یا کاربر را به صفحه ورود به سیستم هدایت کنید به‌طوری‌که پس‌از ورود به سیستم به مکان اصلی خود بازگردد.

باز کردن دیوار پرداخت سایت ناشر

رسانه‌های خبری و پلاتفرم‌های محتوا به‌طور گسترده از مدلی استفاده می‌کنند که در آن پاراگراف‌های ابتدایی مقاله به‌صورت رایگان دردسترس است، درحالی‌که دیوار پرداخت نرم یا محو کردن فقط برای اعضا در نیمه مقاله و با پیمایش خواننده ارائه می‌شود.

وقتی خواننده‌ای در مقاله‌ای به‌پایین پیمایش می‌کند، به دیوار پرداخت می‌رسد، و روی دکمه ادامه خواندن با حساب کلیک می‌کند، با فراخواندن حالت «میانای کاربری فوری»، کادر گفتگوی اصالت‌سنجی درست در همان موقعیت پیمایش که خواننده توقف کرده است نمایش داده می‌شود. به‌محض اینکه اصالت‌سنجی تکمیل شود، محو شدن مقاله به‌آرامی و بدون بازآوری صفحه انجام می‌شود و به خواننده امکان می‌دهد بدون ازدست دادن خط نوشتاری که به آن نگاه می‌کرد به خواندن ادامه دهد. اگر هیچ اعتبارنامه‌ای وجود ندارد، فرم ثبت‌نام یا ورود به سیستم به‌خط را در بخش دیوار پرداخت ازهم باز کنید.

الگوهای ضد که باید از آن‌ها اجتناب کرد

درحالی‌که حالت «میانای کاربری فوری» هنگام استفاده قبل‌از پیمایش صفحه ارزش بسیار زیادی دارد، قرار دادن آن در مکان اشتباه یا اعمال آن بر روی جریان‌های غیرپشتیبانی‌شده به‌طور فعال به تجربه ورود به سیستم کاربر آسیب می‌رساند.

در دکمه‌های ورود به سیستم در صفحه‌های ورود به سیستم اختصاصی، از حالت «واسط کاربر فوری» اجتناب کنید

ازآنجایی‌که حالت «میانای کاربری فوری» هم گذرکلیدها و هم گذرواژه‌ها را در یک گفتگوی صیقلی مدیریت می‌کند، ممکن است وسوسه شوید از آن در دکمه «ورود به سیستم» که در صفحه ورود به سیستم اختصاصی شما قرار دارد استفاده کنید. بااین‌حال، باید از استفاده از آن در اینجا خودداری کنید. اولاً، حالت «میانای کاربر فوری» به‌شدت به فعال‌سازی کاربر (مثل کلیک یا ضربه) نیاز دارد، که این امر در صفحه ورود به سیستم که کاربران ممکن است انتظار داشته باشند گزینه‌های ورود به سیستم در زمان بار شدن صفحه به‌راحتی دردسترس باشد، ناخوشایند است. دوم، صفحه ورود به سیستم مقصد نهایی است که کاربران وقتی اطلاعات اعتباری محلی در دستگاهشان ندارند به آن می‌رسند، یا جایی است که کاربران قصد دارند با گذرکلید در دستگاه همراهشان (اصالت‌سنجی بین‌دستگاهی) یا با کلید امنیتی سخت‌افزاری با کلیک کردن روی «ورود به سیستم با گذرکلید» به سیستم وارد شوند. اگر در اینجا از حالت «میانای کاربر فوری» استفاده کنید، مرورگر رمزینه پاسخ‌سریع بین‌دستگاهی و پشتیبان‌های کلید امنیتی را سرکوب می‌کند و به‌محض اینکه اعتبارنامه‌های محلی را در دستگاه پیدا نکند، بلافاصله بسته می‌شود—کاربر در یک بن‌بست گیر می‌کند که در آن کلیک کردن روی دکمه در صفحه‌ای که مقصد دیگری ندارد هیچ کاری انجام نمی‌دهد.

در صفحه ورود به سیستمی که همه روش‌های اصالت‌سنجی باید به‌طور قابل‌اعتمادی کار کنند، روال مطلوب این است که واسط کاربر شرطی (ادغام تکمیل خودکار) را در فیلدهای ورودی پیکربندی کنید تا راحتی استفاده از گذرکلیدهای محلی تضمین شود، و درعین‌حال دکمه‌های صریح «ورود به سیستم با گذرکلید» را با روش‌های فراخوانی استاندارد جفت کنید تا گزینه‌های رمزینه پاسخ‌سریع و کلید امنیتی بین‌دستگاهی به‌طور قابل‌اعتمادی نمایش داده شوند.

برای اصالت‌سنجی مجدد گام‌به‌گام، از حالت «واسط کاربر فوری» اجتناب کنید

وقتی کاربری که به سیستم وارد شده است عملیات حساسی انجام می‌دهد—مثل تغییر گذرواژه، به‌روزرسانی نشانی ارسال کالا، ویرایش روش‌های پرداخت ذخیره‌شده، یا افزودن گذرکلید جدید—سایت‌ها اغلب برای درستی‌سنجی هویت کاربر، نیاز به اصالت‌سنجی مجدد گام‌به‌گام دارند. ازآنجایی‌که کاربر ازقبل به سیستم وارد شده است، جریان‌های اصالت‌سنجی مجدد معمولاً فهرست allowCredentials غیرخالی را برای محدود کردن اصالت‌سنجی به اطلاعات اعتباری متعلق به آن کاربر خاص ارسال می‌کنند.

بااین‌حال، از حالت «واسط کاربر فوری» برای اصالت‌سنجی مجدد استفاده نکنید. حالت «رابط کاربری فوری» منحصراً برای جریان‌های ورود به سیستم غیرتأییدشده طراحی شده است که در آن‌ها هویت کاربر هنوز مشخص نیست. اگر طرف متکی بتواند فهرست خاصی از شناسه‌های اطلاعات اعتباری را در حالت «واسط کاربر فوری» پُرسمان کند و مشاهده کند که آیا اطلاعات اعتباری وجود دارد یا نه، می‌تواند استنباط کند که آیا کاربر قبلاً با سایت تعامل داشته است یا نه و کاربر را در جلسات ردیابی کند. برای جلوگیری از این خطر ردیابی بین جلسه‌ای، مرورگرها فوراً هرگونه درخواست حالت «میانای کاربری فوری» را که شامل فهرست غیرخالی allowCredentials باشد با پرتاب کردن NotAllowedError رد می‌کنند. برعکس، حذف کردن allowCredentials درطول اصالت‌سنجی مجدد نیز مشکل‌ساز است، زیرا مرورگر همه اطلاعات اعتباری ذخیره‌شده در دستگاه را برای سایتتان ارائه می‌کند—به کاربر اجازه می‌دهد حسابی متفاوت از حسابی که درحال‌حاضر به آن وارد شده است را به‌طور ناخواسته انتخاب کند.

برای اصالت‌سنجی مجدد گام‌به‌گام که در آن هویت کاربر ازقبل مشخص است، از درخواست WebAuthn استاندارد مُدال (navigator.credentials.get() بدون uiMode: 'immediate') با allowCredentials که با اعتبارنامه‌های ثبت‌شده کاربر واردشده به سیستم پر شده است استفاده کنید، یا کاربر را به صفحه چالش اصالت‌سنجی مجدد استاندارد خود هدایت کنید.

نتیجه‌گیری

حالت «میانای کاربر فوری» ابزار قدرتمند تجربه کاربری برای حذف انحراف‌های غیرضروری به صفحه‌های ورود به سیستم و دستیابی به ورودهای سریع به سیستم است که ورود به سیستم را ضمن حفظ بافت تکمیل می‌کند. با رهگیری لحظات هدف کاربر واضح—مثل پیوندهای ورود به سیستم سرصفحه، دکمه‌های تسویه‌حساب، کنش‌های کوچک، و دیوار پرداخت مقاله— درست قبل‌از اینکه پیمایش صفحه انجام شود، می‌توانید از افت کاربر جلوگیری کنید و تجربه کاربری یکپارچه‌ای ارائه دهید.

درعین‌حال، به‌یاد داشته باشید که حالت «واسط کاربر فوری» صرفاً یک بهبود تدریجی برای کاربران اصالت‌سنجی‌نشده قبل‌از پیمایش صفحه است. از اعمال کردن آن روی دکمه‌های صفحه ورود به سیستم مقصد نهایی خود اجتناب کنید تا طراحی شما برای کاربران بین‌دستگاهی (رمزینه پاسخ‌سریع) باز و دردسترس باقی بماند و از استفاده از آن برای جریان‌های اصالت‌سنجی مجدد که به allowCredentials نیاز دارند اجتناب کنید.

برای جزئیات بیشتر درباره پیاده‌سازی گذرکلیدها و جدیدترین ویژگی‌های «هویت وب»، منابع زیر را کاوش کنید: