আপনি অনুমান করতে পারেন যে সবাই আপনার মতোই রঙ বা পাঠ্য সুস্পষ্টতা উপলব্ধি করে। আমরা যেভাবে রঙ বুঝতে পারি তা আমাদের পরিবেশ (নিম্ন বা উজ্জ্বল আলো) এবং আমাদের দৃষ্টিশক্তির উপর নির্ভর করতে পারে। আপনি বা আপনার ব্যবহারকারীরা বর্ণান্ধতা বা কম দৃষ্টিশক্তি সহ লক্ষ লক্ষ লোকের মধ্যে থাকতে পারেন।
বিভিন্ন চাক্ষুষ প্রতিবন্ধী ব্যক্তিদের সমর্থন করার জন্য, WAI গ্রুপ একটি রঙের বৈসাদৃশ্য সূত্র তৈরি করেছে যাতে পাঠ্য এবং এর পটভূমির মধ্যে যথেষ্ট বৈসাদৃশ্য বিদ্যমান রয়েছে। যখন এই রঙের বৈসাদৃশ্য অনুপাত অনুসরণ করা হয়, মাঝারিভাবে কম দৃষ্টিশক্তি সম্পন্ন লোকেরা বৈসাদৃশ্য-বর্ধিত সহায়ক প্রযুক্তি ছাড়াই পটভূমিতে পাঠ্য পড়তে পারে।
চিত্র 1 এ দেখানো বৈসাদৃশ্য অনুপাতের পার্থক্য লক্ষ্য করুন।
4.5:1 এর বৈসাদৃশ্য অনুপাত হল ওয়েব কন্টেন্ট অ্যাক্সেসিবিলিটি নির্দেশিকা (WCAG) 2.0 দ্বারা নির্ধারিত প্রয়োজনীয় সর্বনিম্ন । এই রেশনটি বেছে নেওয়া হয়েছিল কারণ এটি প্রায় 20/40 দৃষ্টিশক্তির সমতুল্য দৃষ্টিশক্তির ক্ষতি সহ ব্যবহারকারীদের দ্বারা অভিজ্ঞতার বিপরীত সংবেদনশীলতার ক্ষতির জন্য ক্ষতিপূরণ দেয়।
আবার, 4.5:1 হল সর্বনিম্ন। কম দৃষ্টি বা অন্যান্য বর্ণান্ধতার সাথে ব্যবহারকারীদের সমর্থন করতে, AAA স্তরের সাথে দেখা করুন এবং 7:1 বৈসাদৃশ্য সহ সামগ্রী তৈরি করুন৷
আপনি DevTools-এ লাইটহাউস অ্যাক্সেসিবিলিটি অডিটের মাধ্যমে আপনার রঙের বৈসাদৃশ্য পরীক্ষা করতে পারেন।
উন্নত পারসেপচুয়াল কনট্রাস্ট অ্যালগরিদম
অ্যাডভান্সড পারসেপচুয়াল কনট্রাস্ট অ্যালগরিদম (এপিসিএ) হল রঙের উপলব্ধির উপর আধুনিক গবেষণার উপর ভিত্তি করে বৈসাদৃশ্য গণনা করার একটি উপায়।
APCA WCAG-এর AA এবং AAA স্তরের চেয়ে বেশি প্রসঙ্গ-নির্ভর।
এই মডেলে, নিম্নলিখিত বৈশিষ্ট্যগুলির উপর ভিত্তি করে বৈসাদৃশ্য গণনা করা হয়:
- স্থানিক বৈশিষ্ট্য (ফন্টের ওজন এবং পাঠ্যের আকার)
- পাঠ্যের রঙ (পাঠ্য এবং পটভূমির মধ্যে হালকাতার পার্থক্য অনুভূত)
- প্রসঙ্গ (পরিবেষ্টিত আলো, পারিপার্শ্বিক, এবং পাঠ্যের উদ্দেশ্যমূলক উদ্দেশ্য)
APCA-এর সাথে AA/AAA কনট্রাস্ট রেশিও নির্দেশিকা প্রতিস্থাপন করার জন্য Chrome একটি পরীক্ষামূলক বৈশিষ্ট্য অন্তর্ভুক্ত করে।
রঙের চেয়ে বেশি গুরুত্বপূর্ণ তথ্য জানান
যখনই আপনি ব্যবহারকারীদের কাছে গুরুত্বপূর্ণ তথ্য জানান, গুরুত্বপূর্ণ তথ্য শেয়ার করার সময় ভিজ্যুয়াল ইঙ্গিত ছাড়াও পাঠ্য বা বিকল্প পাঠের উপর নির্ভর করুন। চাক্ষুষ সংকেতের মধ্যে রয়েছে রং, নিদর্শন, ছবি, ফন্ট স্টাইলিং এবং নির্দেশমূলক ভাষা।
উদাহরণস্বরূপ, আপনার কাছে একটি যোগাযোগ ফর্ম থাকতে পারে যা লাল রঙে আন্ডারলাইন করে অবৈধ ইনপুটগুলিকে নির্দেশ করে৷ এই রঙের ইঙ্গিতটি স্ক্রিন রিডার বা রঙের দৃষ্টি প্রতিবন্ধী ব্যবহারকারীদের বলে না যে কিছু কাজ করছে না। ব্যবহারকারী হয়তো ভাবছেন যে কেন ফর্ম জমা দেওয়া কাজ করছে না এবং ছেড়ে দিন।
নির্দিষ্ট ত্রুটির একাধিক উপায়ে ব্যবহারকারীকে সতর্ক করতে ভুলবেন না। উদাহরণস্বরূপ, নির্দিষ্ট ইনপুটটি অবৈধ এবং কেন তা ঘোষণা করতে আপনি একটি ত্রুটি বার্তা যোগ করতে পারেন। সঠিক ইনপুট কেমন হওয়া উচিত সে সম্পর্কে আপনি সহায়তা পাঠ্য যোগ করতে পারেন।
আপনি এখনও লাল রঙে অবৈধ ইনপুট আন্ডারলাইন করতে পারেন, যতক্ষণ না অতিরিক্ত, অ-ভিজ্যুয়াল ইঙ্গিত থাকে।
আপনি যদি আপনার ইন্টারফেসে রঙের ব্যবহারের উপর খুব বেশি নির্ভর করেন, আপনি Chrome DevTools-এ বৈসাদৃশ্যের সমস্যাগুলি খুঁজে পেতে পারেন।
বৈসাদৃশ্য বৃদ্ধি এবং রং উল্টানো
যাদের দৃষ্টি কম তাদের জন্য, উচ্চ-কনট্রাস্ট মোডগুলি একটি পৃষ্ঠায় সামগ্রী নেভিগেট করা সহজ করে তুলতে পারে৷ উচ্চ-কনট্রাস্ট সেট আপ করার কয়েকটি উপায় রয়েছে।
ম্যাকোস এবং উইন্ডোজ উভয়ই অপারেটিং সিস্টেম জুড়ে বৈসাদৃশ্য স্তর বাড়ানোর উপায় অফার করে।
ব্যবহারকারীরা ফোরগ্রাউন্ড এবং ব্যাকগ্রাউন্ডের রঙগুলি উল্টাতেও বেছে নিতে পারেন (উদাহরণস্বরূপ macOS এ), যা বিশেষত ওয়েবসাইট এবং অ্যাপগুলির জন্য দরকারী যা অন্ধকার মোড সমর্থন করে না।
বিকাশকারী হিসাবে, আপনি এই সেটিংস চালু করে এবং ম্যানুয়ালি ব্যবহারযোগ্যতা যাচাই করে আপনার ইন্টারফেস এখনও দৃশ্যমান এবং ব্যবহারযোগ্য তা নিশ্চিত করতে পরীক্ষা করতে পারেন।
উদাহরণস্বরূপ, কোন পৃষ্ঠাটি নির্বাচন করা হয়েছে তা নির্দেশ করতে একটি নেভিগেশন বার একটি সূক্ষ্ম পটভূমির রঙ ব্যবহার করতে পারে। আপনি যদি এটিকে উচ্চ কনট্রাস্ট মোডে দেখেন, তাহলে সেই সূক্ষ্মতা সম্পূর্ণরূপে অদৃশ্য হয়ে যায় এবং এর সাথে পাঠকের বোঝা যায় কোন পৃষ্ঠাটি সক্রিয়।
আপনি যদি লেভেল AA বা উচ্চতর কন্ট্রাস্ট পূরণ করেন, আপনার বিষয়বস্তু এখনও প্রত্যাশিতভাবে কাজ করা উচিত যখন রং উল্টানো বা উচ্চ বৈসাদৃশ্যে। যাইহোক, অভিজ্ঞতা আশানুরূপ তা নিশ্চিত করার জন্য এটি এখনও পরীক্ষা করার মতো।