কন্ট্রাস্ট চেকার

একটি ফোরগ্রাউন্ড এবং ব্যাকগ্রাউন্ড রঙ পেস্ট করুন (অথবা স্ক্রিনশট থেকে বেছে নিন); কন্ট্রাস্ট অনুপাত এবং এটি কোন WCAG স্তর পাস করে তা জানুন। WCAG 2.1 AA অধিকাংশ এখতিয়ারে আইনগত অ্যাক্সেসিবিলিটি বেসলাইন; AAA হল উচ্চতর মান যা গুরুত্বপূর্ণ সামগ্রীর জন্য সুপারিশ করা হয়।

থ্রেশহোল্ডসমূহ

• WCAG AA, সাধারণ টেক্সট: সর্বনিম্ন 4.5:1।
• WCAG AA, বড় টেক্সট (18pt+ বা 14pt+ বোল্ড): সর্বনিম্ন 3:1।
• WCAG AAA, সাধারণ টেক্সট: সর্বনিম্ন 7:1।
• WCAG AAA, বড় টেক্সট: সর্বনিম্ন 4.5:1।
• অ-টেক্সট UI উপাদান (বাটন, ফর্মের বর্ডার): সর্বনিম্ন 3:1 (WCAG 2.1+)।

কেন কন্ট্রাস্ট গুরুত্বপূর্ণ

কম কন্ট্রাস্ট টেক্সট কম দৃষ্টিশক্তি সম্পন্ন ব্যবহারকারীদের (জনসংখ্যার প্রায় 4%), উজ্জ্বল সূর্যালোকে থাকা ব্যবহারকারীদের, সস্তা মনিটরে থাকা ব্যবহারকারীদের এবং বয়স্ক চোখের (শেষ পর্যন্ত সবার) জন্য অপঠনযোগ্য। অনেক ডিজাইন সিস্টেম গ্রে-অন-গ্রে ডিফল্ট করে কারণ এটি ডিজাইনারের ক্যালিব্রেটেড 5K ডিসপ্লেতে মার্জিত দেখায় — এবং অন্যত্র অপঠনযোগ্য।

WCAG AA পাস না করা মার্কিন যুক্তরাষ্ট্রে (ADA টাইটেল III), ইইউতে (EAA) এবং আরও অনেক এখতিয়ারে আইনত দায়বদ্ধ হতে পারে। সস্তা বীমা: শিপিংয়ের আগে প্রতিটি টেক্সট/ব্যাকগ্রাউন্ড জুটি একটি চেকারের মাধ্যমে চালান।

আমরা কী রিপোর্ট করি

1. কন্ট্রাস্ট অনুপাত একটি সংখ্যা হিসাবে (যেমন 4.71:1)।
2. পাস/ফেল প্রতিটি WCAG স্তর এবং টেক্সট আকারের জন্য।
3. প্রস্তাবিত সমাধান: সবচেয়ে কাছাকাছি গাঢ় ফোরগ্রাউন্ড বা হালকা ব্যাকগ্রাউন্ড যা পাস করবে।
4. লাইভ প্রিভিউ রঙের জুটিতে নমুনা টেক্সট সহ।

কালার-ব্লাইন্ডনেস সিমুলেটরের সাথে যুক্ত করুন

কন্ট্রাস্ট এবং কালার-ব্লাইন্ডনেস ভিন্ন অ্যাক্সেসিবিলিটি অক্ষ। একই UI-তে কালার ব্লাইন্ডনেস সিমুলেটর চালান যাতে এটি CVD আক্রান্ত ব্যবহারকারীদের জন্যও কাজ করে কিনা তা যাচাই করা যায়।