একটি ভাল সাইন-আউট অভিজ্ঞতার জন্য কী তৈরি করে?,কী একটি ভাল সাইন-আউট অভিজ্ঞতার জন্য তৈরি করে?

Kenji Baheux

যখন একজন ব্যবহারকারী কোনও ওয়েবসাইট থেকে সাইন আউট করেন, তখন তিনি ব্যক্তিগতকৃত ব্যবহারকারীর অভিজ্ঞতা থেকে সম্পূর্ণরূপে বেরিয়ে আসার প্রয়োজনীয়তা প্রকাশ করেন। তাই ব্যবহারকারীর মানসিক মডেল যতটা সম্ভব ঘনিষ্ঠভাবে মেনে চলা গুরুত্বপূর্ণ। উদাহরণস্বরূপ, একটি সঠিক সাইন-আউট অভিজ্ঞতার ক্ষেত্রে ব্যবহারকারী সাইন আউট করার সিদ্ধান্ত নেওয়ার আগে যে কোনও ট্যাব খুলে থাকতে পারে তাও বিবেচনা করা উচিত।

একটি দুর্দান্ত সাইন-আউট অভিজ্ঞতার মূল চাবিকাঠি হল ব্যবহারকারীর অভিজ্ঞতার দৃশ্যমান এবং রাষ্ট্রীয় দিকগুলির মধ্যে সামঞ্জস্যপূর্ণ থাকা। এই নির্দেশিকাটি কী মনোযোগ দিতে হবে এবং কীভাবে একটি ভাল সাইন-আউট অভিজ্ঞতা অর্জন করা যায় সে সম্পর্কে সুনির্দিষ্ট পরামর্শ প্রদান করে।

মূল বিবেচ্য বিষয়গুলি

আপনার ওয়েবসাইটে সাইন-আউট কার্যকারিতা বাস্তবায়নের সময়, একটি মসৃণ, নিরাপদ এবং স্বজ্ঞাত সাইন-আউট প্রক্রিয়া নিশ্চিত করতে নিম্নলিখিত দিকগুলিতে মনোযোগ দিন:

স্পষ্ট এবং সুসংগত সাইন-আউট UX : একটি স্পষ্ট এবং সুসংগত দৃশ্যমান সাইন-আউট বোতাম বা লিঙ্ক প্রদান করুন যা ওয়েবসাইট জুড়ে সহজেই সনাক্তযোগ্য এবং অ্যাক্সেসযোগ্য। অস্পষ্ট মেনু, উপ-পৃষ্ঠা বা অন্যান্য অজ্ঞাত স্থানে অস্পষ্ট লেবেল ব্যবহার করা বা সাইন-আউট কার্যকারিতা লুকানো এড়িয়ে চলুন।
নিশ্চিতকরণ প্রম্পট: সাইন-আউট প্রক্রিয়া চূড়ান্ত করার আগে একটি নিশ্চিতকরণ প্রম্পট বাস্তবায়ন করুন । এটি ব্যবহারকারীদের দুর্ঘটনাক্রমে সাইন আউট করা থেকে বিরত রাখতে সাহায্য করতে পারে এবং ব্যবহারকারীদের তাদের সত্যিই সাইন আউট করার প্রয়োজন কিনা তা পুনর্বিবেচনা করার সুযোগ দেয়—উদাহরণস্বরূপ, যদি তারা একটি শক্তিশালী পাসওয়ার্ড বা অন্যান্য প্রমাণীকরণ ব্যবস্থা দিয়ে তাদের ডিভাইসটি কঠোরভাবে লক করে।
একাধিক ট্যাব পরিচালনা করুন : যদি কোনও ব্যবহারকারী একই ওয়েবসাইট থেকে বিভিন্ন ট্যাবে একাধিক পৃষ্ঠা খুলে থাকেন, তাহলে নিশ্চিত করুন যে একটি ট্যাব থেকে সাইন আউট করলে সেই ওয়েবসাইটের অন্যান্য খোলা ট্যাবগুলিও আপডেট হয়ে যায়।
একটি নিরাপদ ল্যান্ডিং পৃষ্ঠায় পুনঃনির্দেশ করুন : সফলভাবে সাইন আউট করার পরে, ব্যবহারকারীকে এমন একটি নিরাপদ ল্যান্ডিং পৃষ্ঠায় পুনঃনির্দেশ করুন যা স্পষ্টভাবে নির্দেশ করে যে তারা আর সাইন ইন নেই। ব্যবহারকারীদের এমন পৃষ্ঠাগুলিতে পুনঃনির্দেশিত করা এড়িয়ে চলুন যেখানে কোনও ব্যক্তিগতকৃত তথ্য রয়েছে। একইভাবে, নিশ্চিত করুন যে অন্যান্য ট্যাবগুলিও আর সাইন-ইন অবস্থা প্রতিফলিত করে না। এছাড়াও, নিশ্চিত করুন যে আপনি এমন একটি খোলা পুনঃনির্দেশ তৈরি করছেন না যা আক্রমণকারীরা সুবিধা নিতে পারে।
সেশন ক্লিনআপ : ব্যবহারকারী সাইন আউট হয়ে গেলে, ব্যবহারকারীর সেশনের সাথে সম্পর্কিত যেকোনো সংবেদনশীল ব্যবহারকারীর সেশন ডেটা, কুকিজ বা অস্থায়ী ফাইল সম্পূর্ণরূপে মুছে ফেলুন। এটি ব্যবহারকারীর তথ্য বা অ্যাকাউন্ট কার্যকলাপে অননুমোদিত অ্যাক্সেস রোধ করে এবং ব্রাউজারকে তার বিভিন্ন ক্যাশে, বিশেষ করে ব্যাক/ফরোয়ার্ড ক্যাশে থেকে সংবেদনশীল তথ্য সহ পৃষ্ঠাগুলি পুনরুদ্ধার করতে বাধা দেয়।
ত্রুটি পরিচালনা এবং প্রতিক্রিয়া : ব্যবহারকারীরা সাইন আউট করার সময় কোনও সমস্যা হলে তাদের স্পষ্ট ত্রুটি বার্তা বা প্রতিক্রিয়া জানান। সাইন-আউট প্রক্রিয়া ব্যর্থ হলে সম্ভাব্য সুরক্ষা ঝুঁকি বা ডেটা ফাঁস সম্পর্কে তাদের অবহিত করুন।
অ্যাক্সেসিবিলিটি বিষয় : নিশ্চিত করুন যে সাইন-আউট পদ্ধতিটি প্রতিবন্ধী ব্যবহারকারীদের জন্য অ্যাক্সেসযোগ্য, যার মধ্যে স্ক্রিন রিডার বা কীবোর্ড নেভিগেশনের মতো সহায়ক প্রযুক্তি ব্যবহারকারীরাও অন্তর্ভুক্ত।
ক্রস-ব্রাউজার সামঞ্জস্য : বিভিন্ন ব্রাউজার এবং ডিভাইস জুড়ে সাইন-আউট কার্যকারিতা পরীক্ষা করে দেখুন যাতে এটি ধারাবাহিকভাবে এবং নির্ভরযোগ্যভাবে কাজ করে।
ক্রমাগত পর্যবেক্ষণ এবং আপডেট : সম্ভাব্য দুর্বলতা বা নিরাপত্তা ত্রুটির জন্য সাইন-আউট প্রক্রিয়া নিয়মিত পর্যবেক্ষণ করুন। চিহ্নিত যেকোনো সমস্যা সমাধানের জন্য সময়োপযোগী আপডেট এবং প্যাচ বাস্তবায়ন করুন।
আইডেন্টিটি ফেডারেশন : যদি ব্যবহারকারী একটি ফেডারেটেড আইডেন্টিটি ব্যবহার করে সাইন ইন করে থাকেন, তাহলে দেখুন আইডেন্টিটি প্রোভাইডার থেকে সাইন আউট করাও সমর্থিত এবং প্রয়োজনীয় কিনা। এছাড়াও, যদি আইডেন্টিটি প্রোভাইডার স্বয়ংক্রিয় সাইন-ইন সমর্থন করে, তাহলে এটি প্রতিরোধ করতে ভুলবেন না।

ডিও

যদি আপনি সাইন-আউট ফ্লো (অথবা অন্যান্য অ্যাক্সেস প্রত্যাহার প্রবাহ) এর অংশ হিসেবে সার্ভারে কোনও কুকি বাতিল করেন, তাহলে ব্যবহারকারীর ডিভাইস থেকেও কুকিটি মুছে ফেলতে ভুলবেন না।
ব্যবহারকারীর ডিভাইসে সংরক্ষিত যেকোনো সংবেদনশীল ডেটা পরিষ্কার করুন: কুকিজ, লোকাল স্টোরেজ , সেশন স্টোরেজ , ইনডেক্সডডিবি , ক্যাশ স্টোরেজ এবং অন্যান্য স্থানীয় ডেটা স্টোর।
নিশ্চিত করুন যে সংবেদনশীল ডেটা সম্বলিত যেকোনো রিসোর্স—বিশেষ করে HTML ডকুমেন্ট— Cache-control: no-store HTTP হেডারের সাথে ফেরত পাঠানো হচ্ছে যাতে ব্রাউজার এই রিসোর্সগুলিকে স্থায়ী স্টোরেজে (উদাহরণস্বরূপ, ডিস্কে) সংরক্ষণ না করে। একইভাবে, XHR/ fetch কল যা সংবেদনশীল ডেটা ফেরত দেয় Cache-Control: no-store HTTP হেডার সেট করা উচিত যাতে কোনও ক্যাশিং প্রতিরোধ করা যায়।
ব্যবহারকারীর ডিভাইসে খোলা যেকোনো ট্যাব সার্ভার-সাইড অ্যাক্সেস প্রত্যাহারের সাথে আপ টু ডেট আছে কিনা তা নিশ্চিত করুন।

সাইন আউট করার সময় সংবেদনশীল ডেটা পরিষ্কার করা

সাইন আউট করার পর, ক্ষণস্থায়ী এবং স্থানীয়ভাবে সংরক্ষিত সংবেদনশীল ডেটা মুছে ফেলার কথা বিবেচনা করুন। সংবেদনশীল ডেটার উপর জোর দেওয়ার কারণ হল সবকিছু মুছে ফেলার ফলে ব্যবহারকারীর অভিজ্ঞতা উল্লেখযোগ্যভাবে খারাপ হবে কারণ এই ব্যবহারকারী আবার ফিরে আসতে পারেন। উদাহরণস্বরূপ, যদি আপনি স্থানীয়ভাবে সংরক্ষিত সমস্ত ডেটা মুছে ফেলেন, তাহলে আপনার ব্যবহারকারীদের কুকি সম্মতির প্রম্পটগুলি পুনরায় স্বীকার করতে হবে এবং অন্যান্য প্রক্রিয়ার মধ্য দিয়ে যেতে হবে যেন তারা প্রথমে কখনও আপনার ওয়েবসাইট পরিদর্শন করেনি।

কুকিজ কীভাবে পরিষ্কার করবেন

সাইন আউট স্ট্যাটাস নিশ্চিত করে এমন পৃষ্ঠার প্রতিক্রিয়ায়, সংবেদনশীল ডেটার সাথে সম্পর্কিত বা ধারণকারী প্রতিটি কুকি মুছে ফেলার জন্য Set-Cookie HTTP হেডার সংযুক্ত করুন। expires মানটি সুদূর অতীতের একটি তারিখে সেট করুন এবং ভাল পরিমাপের জন্য কুকির মানটি একটি খালি স্ট্রিংয়ে সেট করুন।

Set-Cookie: sensitivecookie1=; expires=Thu, 01 Jan 1970 00:00:00 GMT; secure
Set-Cookie: sensitivecookie2=; expires=Thu, 01 Jan 1970 00:00:00 GMT; secure
...

অফলাইন দৃশ্যকল্প

উপরে বর্ণিত পদ্ধতিটি সাধারণ ব্যবহারের ক্ষেত্রে যথেষ্ট হলেও, ব্যবহারকারী অফলাইনে কাজ করলে এটি কাজ করে না। সাইন-ইন অবস্থা ট্র্যাক করার জন্য আপনি দুটি কুকি প্রয়োজন বলে বিবেচনা করতে পারেন: একটি নিরাপদ HTTPS-কেবল কুকি, এবং একটি নিয়মিত কুকি যা জাভাস্ক্রিপ্টের মাধ্যমে অ্যাক্সেসযোগ্য। যদি আপনার ব্যবহারকারী অফলাইনে থাকাকালীন সাইন আউট করার চেষ্টা করেন, তাহলে আপনি জাভাস্ক্রিপ্ট কুকিটি সাফ করতে পারেন এবং সম্ভব হলে অন্যান্য পরিষ্কার-পরিচ্ছন্নতার ক্রিয়াকলাপ চালিয়ে যেতে পারেন। যদি আপনার কোনও পরিষেবা কর্মী থাকে, তাহলে ব্যবহারকারী পরে অনলাইনে থাকাকালীন সার্ভারে অবস্থা সাফ করার অনুরোধ পুনরায় চেষ্টা করার জন্য আপনি ব্যাকগ্রাউন্ড ফেচ API ব্যবহার করতে পারেন।

স্টোরেজ কীভাবে পরিষ্কার করবেন

সাইন-আউট অবস্থা নিশ্চিত করে এমন পৃষ্ঠার প্রতিক্রিয়ায়, বিভিন্ন ডেটা স্টোর থেকে সংবেদনশীল ডেটা পরিষ্কার করার বিষয়ে সতর্ক থাকুন:

sessionStorage : যদিও ব্যবহারকারী আপনার ওয়েবসাইটের সাথে তাদের সেশন শেষ করলে এটি পরিষ্কার হয়ে যায়, ব্যবহারকারী সাইন আউট করার সময় সংবেদনশীল ডেটা সক্রিয়ভাবে পরিষ্কার করার কথা বিবেচনা করুন, যদি তারা আপনার ওয়েবসাইটে খোলা সমস্ত ট্যাব বন্ধ করতে ভুলে যায়।
```
// Remove sensitive data from sessionStorage
sessionStorage.removeItem('sensitiveSessionData1');
// ...

// Or if everything in sessionStorage is sensitive, clear it all
sessionStorage.clear();
```

localStorage , indexedDB , Cache / Service Worker API গুলি : ব্যবহারকারী সাইন আউট করলে, এই API গুলি ব্যবহার করে আপনার সংরক্ষিত যেকোনো সংবেদনশীল ডেটা পরিষ্কার করুন, কারণ এই ডেটা সেশন জুড়ে থাকবে।

// Remove sensitive data from localStorage:
localStorage.removeItem('sensitiveData1');
// ...

// Or if everything in localStorage is sensitive, clear it all:
localStorage.clear();

// Delete sensitive object stores in indexedDB:
const name = 'exampleDB';
const version = 1;
const request = indexedDB.open(name, version);

request.onsuccess = (event) => {
  const db = request.result;
  db.deleteObjectStore('sensitiveStore1');
  db.deleteObjectStore('sensitiveStore2');

  // ...

  db.close();
}

// Delete sensitive resources stored with the Cache API:
caches.open('cacheV1').then((cache) => {
  await cache.delete("/personal/profile.png");

  // ...
}

// Or better yet, clear a cache bucket that contains sensitive resources:
caches.delete('personalizedV1');

ক্যাশে কীভাবে পরিষ্কার করবেন

HTTP ক্যাশে : যতক্ষণ আপনি সংবেদনশীল ডেটা সহ রিসোর্সে Cache-control: no-store সেট করবেন, HTTP ক্যাশে সংবেদনশীল কিছু ধরে রাখবে না।
ব্যাক/ফরোয়ার্ড ক্যাশে : একইভাবে, যদি আপনি ব্যবহারকারীদের সাইন আউট করার সময় Cache-control: no-store এবং সংবেদনশীল কুকিজ (উদাহরণস্বরূপ, প্রমাণীকরণ-সম্পর্কিত সুরক্ষিত HTTPS-only কুকিজ) সাফ করার সুপারিশগুলি অনুসরণ করেন, তাহলে ব্যাক/ফরোয়ার্ড ক্যাশে সংবেদনশীল ডেটা সংরক্ষণ করা হবে কিনা তা নিয়ে আপনার চিন্তা করার দরকার নেই। প্রকৃতপক্ষে, ব্যাক/ফরোয়ার্ড ক্যাশে বৈশিষ্ট্যটি Cache-control: no-store HTTP হেডার সহ পরিবেশিত একই-অরিজিন পৃষ্ঠাগুলিকে সরিয়ে দেবে যদি এটি নিম্নলিখিত এক বা একাধিক সংকেত পর্যবেক্ষণ করে:
- এক বা একাধিক নিরাপদ HTTPS-কেবল কুকিজ পরিবর্তন বা মুছে ফেলা হয়েছে।
- পৃষ্ঠাটি দ্বারা ইস্যু করা XHR/ fetch কলের জন্য এক বা একাধিক প্রতিক্রিয়ার মধ্যে Cache-control: no-store HTTP হেডার অন্তর্ভুক্ত ছিল।

ট্যাব জুড়ে ধারাবাহিক ব্যবহারকারীর অভিজ্ঞতা

আপনার ব্যবহারকারীরা সাইন আউট করার আগে আপনার ওয়েবসাইটের জন্য অনেক ট্যাব খুলে থাকতে পারেন। ততক্ষণে, তারা অন্যান্য ট্যাব, এমনকি অন্যান্য ব্রাউজার উইন্ডো সম্পর্কে ভুলেও যেতে পারেন। সমস্ত প্রাসঙ্গিক ট্যাব এবং উইন্ডো বন্ধ করার জন্য আপনার ব্যবহারকারীদের উপর নির্ভর করা এড়িয়ে চলাই ভাল। পরিবর্তে, ব্যবহারকারীর লগইন অবস্থা ট্যাব জুড়ে সামঞ্জস্যপূর্ণ কিনা তা নিশ্চিত করে একটি সক্রিয় অবস্থান নিন।

কিভাবে

ট্যাব জুড়ে একটি সামঞ্জস্যপূর্ণ সাইন-ইন অবস্থা অর্জন করতে, pageshow / pagehide ইভেন্ট এবং ব্রডকাস্ট চ্যানেল API এর সংমিশ্রণ ব্যবহার করার কথা বিবেচনা করুন।

pageshow ইভেন্ট : একটি স্থায়ী pageshow পরে, ব্যবহারকারীর লগইন স্ট্যাটাস পরীক্ষা করুন এবং সংবেদনশীল ডেটা - এমনকি পুরো পৃষ্ঠাটি - মুছে ফেলুন যদি ব্যবহারকারী আর সাইন ইন না থাকে। পৃষ্ঠাটি ব্যাক/ফরওয়ার্ড নেভিগেশন থেকে পুনরুদ্ধার করার পরে প্রথমবারের মতো রেন্ডার হওয়ার আগে pageshow ইভেন্টটি ট্রিগার হবে, যাতে আপনার লগইন স্ট্যাটাস চেক আপনাকে পৃষ্ঠাটিকে একটি অ-সংবেদনশীল অবস্থায় রিসেট করতে দেয়।
```
window.addEventListener('pageshow', (event) => {
  if (event.persisted && !document.cookie.match(/my-cookie)) {
    // The user has logged out.
    // Force a reload, or otherwise clear sensitive information right away.
    body.innerHTML = '';
    location.reload();
  }
});
```
ব্রডকাস্ট চ্যানেল এপিআই : ট্যাব এবং উইন্ডো জুড়ে লগইন অবস্থার পরিবর্তনগুলি জানাতে এই এপিআই ব্যবহার করুন। ব্যবহারকারী যদি সাইন আউট হয়ে থাকেন, তাহলে সমস্ত সংবেদনশীল ডেটা সাফ করুন, অথবা বিকল্পভাবে সংবেদনশীল ডেটা সহ সমস্ত ট্যাব এবং উইন্ডোতে একটি সাইন-আউট পৃষ্ঠায় পুনঃনির্দেশ করুন।
```
// Upon logout, broadcast new login state so that other tabs can clean up too:
const bc = new BroadcastChannel('login-state');
bc.postMessage('logged out');

// [...]
const bc = new BroadcastChannel('login-state');
bc.onMessage = (msgevt) => {
  if (msgevt.data === 'logged out') {
    // Clean up, reload or navigate to the sign-out page.
    // ...
  }
}
```

উপসংহার

এই নথিতে দেওয়া নির্দেশিকা অনুসরণ করে, আপনি একটি দুর্দান্ত সাইন-আউট ব্যবহারকারীর অভিজ্ঞতা তৈরি করতে সক্ষম হবেন যা অনিচ্ছাকৃত লগআউট প্রতিরোধ করবে এবং ব্যবহারকারীর ব্যক্তিগত তথ্য সুরক্ষিত রাখবে।