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

কেনজি বাহেউক্স
Kenji Baheux

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

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

মূল বিবেচনা

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

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

ডিও

  • আপনি যদি সাইন-আউট ফ্লো (বা অন্যান্য অ্যাক্সেস প্রত্যাহার প্রবাহ) এর অংশ হিসাবে সার্ভারে একটি কুকি বাতিল করেন, তবে ব্যবহারকারীর ডিভাইসে কুকিটিও মুছে ফেলার বিষয়টি নিশ্চিত করুন৷
  • ব্যবহারকারীর ডিভাইসে আপনার সংরক্ষিত যেকোনো সংবেদনশীল ডেটা পরিষ্কার করুন: কুকিজ, লোকাল স্টোরেজ , সেশন স্টোরেজ , ইনডেক্সডডিবি , ক্যাশেস্টোরেজ এবং অন্য কোনো স্থানীয় ডেটা স্টোর।
  • নিশ্চিত করুন যে সংবেদনশীল ডেটা-বিশেষ করে এইচটিএমএল ডকুমেন্ট-সম্বলিত কোনো সংস্থান Cache-control: no-store HTTP হেডারের সাথে ফেরত দেওয়া হয়েছে যাতে ব্রাউজার এই সম্পদগুলিকে স্থায়ী স্টোরেজে (উদাহরণস্বরূপ, ডিস্কে) সংরক্ষণ না করে। একইভাবে, XHRs/ 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-শুধু কুকি, এবং একটি নিয়মিত কুকি JavaScript এর মাধ্যমে অ্যাক্সেসযোগ্য৷ যদি আপনার ব্যবহারকারী অফলাইনে সাইন আউট করার চেষ্টা করেন, তাহলে আপনি JavaScript কুকি সাফ করতে পারেন এবং সম্ভব হলে অন্যান্য ক্লিন-আপ অপারেশনে এগিয়ে যেতে পারেন। আপনার যদি কোনও পরিষেবা কর্মী থাকে, ব্যবহারকারী পরে অনলাইনে থাকাকালীন সার্ভারে অবস্থা পরিষ্কার করার জন্য একটি অনুরোধ পুনরায় চেষ্টা করার জন্য আপনি ব্যাকগ্রাউন্ড ফেচ 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 APIs : যখন ব্যবহারকারী সাইন আউট করেন, তখন এই APIs ব্যবহার করে আপনার সংরক্ষিত যেকোন সংবেদনশীল ডেটা পরিষ্কার করুন, এই ধরনের ডেটা সেশন জুড়ে বজায় থাকবে।

    // 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 via 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-শুধুমাত্র কুকিজ) সাফ করার বিষয়ে সুপারিশগুলি অনুসরণ করেন, তাহলে আপনার করার দরকার নেই সংবেদনশীল ডেটা ব্যাক/ফরওয়ার্ড ক্যাশে রাখা নিয়ে উদ্বিগ্ন। প্রকৃতপক্ষে, ব্যাক/ফরোয়ার্ড ক্যাশে বৈশিষ্ট্যটি Cache-control: no-store HTTP হেডার যদি এটি নিম্নলিখিত এক বা একাধিক সংকেত পর্যবেক্ষণ করে:
    • এক বা একাধিক নিরাপদ HTTPS-শুধু কুকি পরিবর্তন বা মুছে ফেলা হয়েছে।
    • XHRs/ 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();
      }
    });
    
  • ব্রডকাস্ট চ্যানেল API : ট্যাব এবং উইন্ডো জুড়ে লগইন অবস্থার পরিবর্তনগুলি যোগাযোগ করতে এই API ব্যবহার করুন। ব্যবহারকারী সাইন আউট হলে, সমস্ত সংবেদনশীল ডেটা সাফ করুন, বা বিকল্পভাবে সংবেদনশীল ডেটা সহ সমস্ত ট্যাব এবং উইন্ডোতে একটি সাইন-আউট পৃষ্ঠায় পুনঃনির্দেশ করুন৷

    // 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.
        // ...
      }
    }
    

উপসংহার

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