অ্যাক্সেসিবিলিটি
পড়ার মতো একটি বিবৃতিতে কোন বিষয়গুলো ভুল, তা স্পষ্টভাবে বলা থাকে। এই বিবৃতিতে তা আছে, পাশাপাশি আমরা কী মানদণ্ডে কাজ করি এবং যা বাদ পড়েছে তা কীভাবে জানাবেন, সেটিও বলা হয়েছে।
- লক্ষ্য হিসেবে WCAG 2.2 AA
- কনট্রাস্ট অনুমানে নয়, মেপে দেখা হয়
- জানা ঘাটতিগুলোর তালিকা আছে
অবস্থান
আমরা এই ওয়েবসাইটটি WCAG 2.2 level AA অনুযায়ী তৈরি করি এবং শুধু ধরে নিই না, যাচাইও করি: প্রতিটি উপাদান যে রঙের ওপর আসলে প্রদর্শিত হয়, তার সঙ্গে তুলনা করে কনট্রাস্ট মাপা হয়, আর কোনো ব্যর্থতা থাকলে বিল্ড আটকে যায়। এটি এমন কোনো লক্ষ্য নয়, যা ঘোষণা করে বছরে একবার ফিরে দেখি — প্রতিটি রিলিজে এই পরীক্ষা চলে।
এটি সম্পূর্ণ সামঞ্জস্যের দাবি নয়। জানা সীমাবদ্ধতাগুলো বাদ না দিয়ে নিচে তালিকাভুক্ত করা হয়েছে। এই সাইটে বা অ্যাপে কোনো কিছু আপনার জন্য ব্যবহার করা সম্ভব না হলে, [email protected] ঠিকানায় বিষয় হিসেবে অ্যাক্সেসিবিলিটি লিখে কী ঘটেছে তা জানান — এটিকে মতামত নয়, ত্রুটির রিপোর্ট হিসেবে বিবেচনা করা হবে।
কার্যকর হয়েছে
যা তৈরি করা হয়েছে
- JavaScript ছাড়াই প্রতিটি পেজ কাজ করে। ডিফল্টভাবে কিছু লুকিয়ে রেখে কোনো স্ক্রিপ্ট দিয়ে দেখানো হয় না। তাই স্ক্রিপ্ট কাজ না করলে, কঠোর কনটেন্ট ব্লকার থাকলে বা শুধু টেক্সট দেখায় এমন ক্লায়েন্ট ব্যবহার করলেও পেজের কনটেন্ট দেখা যায়। ইন্টার্যাক্টিভ উপাদানগুলো এমন পেজের ওপর যোগ করা সুবিধা, যেগুলো আগে থেকেই কাজ করে।
- বাস্তবে রেন্ডার হওয়া ব্যাকগ্রাউন্ডের সঙ্গে কনট্রাস্ট মাপা হয়—অনুমান করা কোনো রঙের সঙ্গে চোখে দেখে নয়; প্রতিটি উপাদানের পেছনে থাকা প্রথম অস্বচ্ছ ancestor নির্ধারণ করে মাপা হয়। এই সাইটের বডি টেক্সট একসময় 4.49:1 ছিল—AA মানের নিচে, যদিও দেখতে একেবারেই স্বাভাবিক—এবং মাপার পরেই বিষয়টি ধরা পড়ে।
- স্কিপ লিংক এবং দৃশ্যমান ফোকাস। প্রতিটি পেজ শুরু হয় কনটেন্টে যাওয়ার একটি স্কিপ লিংক দিয়ে, আর প্রতিটি ইন্টার্যাক্টিভ উপাদানে দৃশ্যমান ফোকাস ইন্ডিকেটর থাকে; গোছানোর জন্য outline সরিয়ে দেওয়া হয় না।
- সেম্যান্টিক কাঠামো। প্রতিটি পেজে একটি h1, বাদ না দিয়ে ক্রমানুসারে হেডিং, প্রকৃত তালিকা, সঠিক হেডার সেল ও ক্যাপশনসহ টেবিল, এবং স্ক্রিন রিডার দিয়ে নেভিগেট করা যায় এমন ল্যান্ডমার্ক থাকে।
- সিস্টেমের সেটিং অনুযায়ী অ্যানিমেশন চলে। prefers-reduced-motion চালু থাকলে প্রতিটি অ্যানিমেশন বন্ধ থাকে, আর কোনো কনটেন্ট দেখানোর আগে প্রবেশ-অ্যানিমেশনের জন্য অপেক্ষা করতে হয় না।
- টেক্সট বড় করা যায়। লেআউটে আপেক্ষিক ইউনিট ব্যবহার করা হয় এবং টেক্সট বড় করলে বা উইন্ডো সরু হলে লেআউট নতুনভাবে সাজে; ভেঙে যায় না বা পাশে স্ক্রল করতে হয় না।
- অর্থবহ বিকল্প টেক্সট ব্যবহার করা হয়। আর এমন কোনো লিংকের ভেতরের ছবিতে ইচ্ছাকৃতভাবে খালি alt রাখা হয়, যে লিংকে ইতিমধ্যেই নিজস্ব টেক্সট আছে—সেখানে বর্ণনা দিলে স্ক্রিন রিডার একই কথা দুবার পড়ে শোনাবে।
পরিচিত সীমাবদ্ধতা
এই অংশটিই পেজটি প্রকাশ করার কারণ। প্রতিটি বিষয় বাস্তব, আমরা সেগুলো সম্পর্কে জানি, এবং এর কোনো একটিকেই এখানে ঠিক হয়ে গেছে বলে দেখানো হয়নি।
সাইটটি ত্রিশটি ভাষায় প্রকাশিত, কিন্তু সব ভাষায় স্ক্রিন রিডার দিয়ে পরীক্ষা করা হয়নি। ইংরেজিতে পরীক্ষা করা হয়েছে। ডান থেকে বামে লেখা ভাষাগুলোর উচ্চারণ ও পড়ার ক্রম, এবং যেসব লিপির জন্য আমাদের ডিসপ্লে টাইপফেসে কোনো সমর্থন নেই ও প্ল্যাটফর্মের ফন্ট বিকল্প হিসেবে ব্যবহৃত হয়, সেগুলো সহায়ক প্রযুক্তি দিয়ে যাচাই করা হয়নি।
আমাদের দুটি টাইপফেস শুধু Latin সমর্থন করে। Cyrillic, Devanagari, Georgian, Thai, Arabic, Hebrew, Bengali, Ethiopic এবং CJK—সবই প্ল্যাটফর্মের নিজস্ব ফন্টে ফিরে যায়। পাঠযোগ্যতার জন্য এটি সাধারণত ভালো, তবে এর অর্থ হলো ইংরেজিতে আমরা যে টাইপোগ্রাফিক বিষয়গুলো নিয়ন্ত্রণ করি—ওজন, অক্ষরের ফাঁক, কোন আকারে ছোট টেক্সট আর যথেষ্ট বড় থাকে না—সেসব লোকালাইজড সংস্করণে আমরা নিয়ন্ত্রণ করি না।
কিছু ইন্টার্যাক্টিভ উপাদান নতুন এবং কম পরীক্ষা করা হয়েছে। তুলনা ম্যাট্রিক্স এবং সহায়তা অনুসন্ধান ফলাফলের সারিগুলো একই জায়গায় ফিল্টার করে, যা সঠিক পদ্ধতি। তবে পরিবর্তিত ফলাফলের সংখ্যা স্ক্রিন রিডারকে জানানো বাস্তবায়ন করা হয়েছে, ব্যবহারকারীর মাধ্যমে পরীক্ষা করা হয়নি।
সাইটের মতো একই লক্ষ্য অ্যাপের ক্ষেত্রেও প্রযোজ্য, তবে সাইটের তুলনায় অ্যাপ কম ঘন ঘন অডিট করা হয়। অ্যাপটি প্ল্যাটফর্মের নিজস্ব টেক্সট সাইজিং এবং স্ক্রিন রিডার সমর্থন করে, যেগুলো বেশিরভাগ কাজই করে দেয়। তবে বর্তমানে প্রতিটি রিলিজের বিরুদ্ধে আমরা আনুষ্ঠানিক অ্যাক্সেসিবিলিটি অডিট চালাই না।
সাইট বা অ্যাপ—কোনোটিরই আনুষ্ঠানিক তৃতীয় পক্ষের অডিট করা হয়নি। আমাদের এমন কোনো সার্টিফিকেশন নেই—তার ইঙ্গিত দেওয়ার চেয়ে এটি সরাসরি বলা আমাদের কাছে ভালো।
অ্যাপ এবং জানার মতো একটি বিষয়
Telvio অ্যাপ যে অপারেটিং সিস্টেমে চলে, তার অ্যাক্সেসিবিলিটি সুবিধার ওপর নির্ভর করে: iOS-এ VoiceOver এবং Dynamic Type, Android-এ TalkBack এবং ফন্ট স্কেলিং। এমন একটি অ্যাপের জন্য, যার ইন্টারফেসে রয়েছে একটি কীপ্যাড, ব্যালান্স এবং রেটের তালিকা, গুরুত্বপূর্ণ বেশিরভাগ বিষয়ই এগুলো সামলে নেয়।
অ্যাক্সেসিবিলিটি ফিচারের বদলে একটি অ্যাক্সেসিবিলিটি বৈশিষ্ট্য হিসেবে একটি ডিজাইন সিদ্ধান্ত উল্লেখ করা দরকার। অ্যাপ ব্যবহারে কোনো অ্যাকাউন্টের প্রয়োজন না হওয়ায় সাইন-আপ ফর্ম, প্রবেশ করানোর মতো পাসওয়ার্ড, ইমেল যাচাইয়ের ধাপ বা কোনো মেসেজ থেকে সংগ্রহ করার মতো কোড নেই—সহায়ক প্রযুক্তি ব্যবহারকারী বা ফর্ম পূরণে অসুবিধা হয় এমন যে কারও জন্য যে ধরনের ইন্টার্যাকশন সবচেয়ে বেশি বাধা তৈরি করে, তার পুরো শ্রেণিটিই এখানে নেই। ইনস্টল করুন, ডায়াল করুন, কথা বলুন।
এর সঙ্গে থাকা সীমাবদ্ধতাটিও অন্য সবকিছুর মতো একই পেজে রয়েছে: অ্যাপটি জরুরি সেবায় কল করতে পারে না, যা জরুরি কল-এ বলা আছে। কেউ যদি কোনো আত্মীয়ের জন্য—বিশেষ করে বিদেশে থাকা পরিবারের সঙ্গে কথা বলেন এমন বয়স্ক ব্যক্তিদের ক্ষেত্রে এটি একটি সাধারণ ঘটনা—এই অ্যাপ সেট আপ করে দেন, তাহলে সেটি করার সময় বোঝানোর মতো সবচেয়ে গুরুত্বপূর্ণ বিষয় এটাই।
কিছু ভুল হলে আমাদের জানান
বিষয় হিসেবে Accessibility লিখে [email protected]-এ ইমেল করুন। সহায়ক তথ্যের মধ্যে রয়েছে: কোন পেজ বা স্ক্রিন, আপনি কী করতে চেয়েছিলেন, কোন সহায়ক প্রযুক্তি ব্যবহার করছিলেন এবং তার সংস্করণ, আর তার বদলে কী ঘটেছে। এর কোনোটিই বাধ্যতামূলক নয়—“আমি স্ক্রিন রিডার দিয়ে রেটের টেবিল ব্যবহার করতে পারছি না” লিখে পাঠানোও যথেষ্ট ভালো রিপোর্ট, আর কিছু না পাওয়ার চেয়ে আমরা সেটিই চাই।
আমরা পাঁচ কর্মদিবসের মধ্যে একটি মূল্যায়ন এবং যেখানে ত্রুটি আছে বলে আমরা একমত, সেখানে আনুমানিক সময়সীমাসহ উত্তর দেওয়ার চেষ্টা করি। কোনো কাজ সম্পন্ন করতে বাধা দেয় এমন বিষয়গুলো অন্য কাজের আগে ঠিক করা হয়; কোনো কাজ কঠিন করে তোলে এমন বিষয়গুলো অস্পষ্ট প্রতিশ্রুতি না দিয়ে সৎভাবে কিউতে রাখা হয়।
আপনি যদি ইউরোপীয় ইউনিয়নে থাকেন এবং মনে করেন কোনো অ্যাক্সেসিবিলিটি বাধ্যবাধকতা পূরণ করা হচ্ছে না, তাহলে সংশ্লিষ্ট জাতীয় প্রয়োগকারী সংস্থার কাছেও বিষয়টি জানাতে পারেন। আমরা চাই আপনি আগে আমাদের জানান, তবে যেভাবেই জানান, আমরা উত্তর দেব।
পরীক্ষাগুলো আসলে যেভাবে চলে
দুটি বিষয় ব্যাখ্যা করা দরকার, কারণ এগুলোই একটি বক্তব্য আর বাস্তব কাজের মধ্যে পার্থক্য তৈরি করে।
কনট্রাস্ট রেন্ডার হওয়া অবস্থায় মাপা হয়, পার্স করা নয়। স্টাইলশিট থেকে পড়ে নেওয়া কোনো রঙের মান বলে একটি উপাদানকে কেমন হওয়ার নির্দেশ দেওয়া হয়েছিল, শেষ পর্যন্ত সেটি দেখতে কেমন হয়েছে তা নয়—যেমন গাঢ় ব্যান্ডের ওপর আধা-স্বচ্ছ উপাদান, regex বুঝতে পারে না এমন আধুনিক রঙের ফাংশন, বা হিরো ছবির ওপর থাকা একটি fixed header। প্রতিটি উপাদানের প্রকৃত ব্যাকগ্রাউন্ড বের করতে চেকটি প্রথম অস্বচ্ছ ancestor পর্যন্ত ওপরে যায় এবং ব্রাউজারের মাধ্যমেই রঙ নির্ধারণ করে, তারপর অনুপাত হিসাব করে। এই প্রক্রিয়ায় ধরা পড়ে যে এই সাইটের বডি টেক্সট 4.49:1-এ ছিল, যা AA মানের নিচে হলেও আলাদা করে দেখলে পুরোপুরি স্বাভাবিক লাগে।
পেজটি যেভাবে রেন্ডার হয়, সেভাবেই পরীক্ষা করা হয়; শুধু লেখা কোড দেখে নয়। আলাদা একটি probe প্রতিটি পেজ বাস্তব ব্রাউজারে লোড করে দেখে, viewport-এর কোনো টেক্সটের opacity শূন্য কি না, ডকুমেন্ট পাশে স্ক্রল করে কি না, এবং কোনো কিছু নিজের ব্যাকগ্রাউন্ডের একই রঙে রেন্ডার হচ্ছে কি না। শেষের বিষয়টি প্রকাশের পর না আসা পর্যন্ত অদ্ভুত মনে হতে পারে: একবার একটি grouped CSS rule কোনো লেবেলের রঙ ও ব্যাকগ্রাউন্ড একই করে দিয়েছিল, ফলে 1:1 কনট্রাস্ট অনুপাত তৈরি হয়েছিল—যা মার্কআপে অদৃশ্য, DOM-এ অদৃশ্য এবং সোর্সের স্ক্রিনশটেও অদৃশ্য।
যেসব সিদ্ধান্ত আমরা ইচ্ছা করেই নিয়েছি
- অনুমতি ছাড়া কোনো অ্যানিমেশন নয়। স্ক্রল অ্যানিমেশন একটি স্ক্রিপ্ট থেকে চালু হয়, যা আগে নিশ্চিত করে যে ব্যবহারকারী অ্যানিমেশন চান। তাই কম মোশন চালু থাকা পাঠক কনটেন্ট সঙ্গে সঙ্গে দেখতে পান এবং সেটিকে আসতে দেখেন না।
- JavaScript-এর আড়ালে কোনো কনটেন্ট নয়। কোনো কিছু অদৃশ্য অবস্থায় লেখা হয় না। এটি পারফরম্যান্সের মতোই একটি অ্যাক্সেসিবিলিটি সিদ্ধান্ত—দৃশ্যমান হতে যে পেজের স্ক্রিপ্টের ওপর নির্ভর করতে হয়, সেই স্ক্রিপ্ট কাজ না করলে পেজটি সবার জন্যই ব্যর্থ হয়।
- ডেটায় আইকনের বদলে শব্দ। তুলনা টেবিলে টিক ও ক্রসের বদলে “হ্যাঁ”, “কিছুই নয়” এবং “উপরে পূর্ণসংখ্যায় নেওয়া” লেখা থাকে, কারণ টিক ঘোষণা করার সময় অস্পষ্ট এবং কপি করলে অদৃশ্য।
- বর্ণনা পুনরাবৃত্তি হলে খালি alt। ইতিমধ্যেই নিজস্ব টেক্সট বহন করে এমন লিংকের ভেতরের ছবিতে
alt=""দেওয়া হয়, যাতে স্ক্রিন রিডার গন্তব্যটি একবার ঘোষণা করে, দুবার নয়। - চওড়া টেবিল নিজের বাক্সের ভেতরেই স্ক্রল করে—পেজকে পাশে ঠেলে দেয় না। তাই কোনো অনুচ্ছেদ পড়তে ফোনে কখনো অনুভূমিকভাবে স্ক্রল করতে হয় না।
শেষ কথা
আমরা WCAG 2.2 AA অনুযায়ী তৈরি করি এবং প্রতিটি রিলিজে তা যাচাই করি। এ সময় ধরে নেওয়া পটভূমির বদলে বাস্তবে রেন্ডার হওয়া পটভূমির সঙ্গে কনট্রাস্ট মাপা হয়। এটি পূর্ণ সামঞ্জস্যের দাবি নয়।
পরিচিত সীমাবদ্ধতাগুলো হলো: ত্রিশটি ভাষার ক্ষেত্রে স্ক্রিন রিডার পরীক্ষা শুধু ইংরেজিতেই করা হয়েছে, আমাদের টাইপফেসগুলো শুধু Latin লিপি সমর্থন করে—তাই অন্য লিপির জন্য প্ল্যাটফর্মের ফন্ট ব্যবহৃত হয়, নতুন ইন্টার্যাক্টিভ উপাদানগুলোর পরীক্ষা তুলনামূলকভাবে কম হয়েছে, এবং তৃতীয় পক্ষের কোনো অডিট করা হয়নি।
[email protected]এ বিষয় Accessibility লিখে ব্যবহার অনুপযোগী যেকোনো কিছু জানাবেন। এটিকে ত্রুটির রিপোর্ট হিসেবে বিবেচনা করা হয়, আর কোনো কাজ আটকে দিলে তা অন্য কাজের আগে ঠিক করা হয়।
সাধারণ জিজ্ঞাসা
Telvio কোন অ্যাক্সেসিবিলিটি মান অনুসরণ করে?
ওয়েবসাইটের লক্ষ্য WCAG 2.2 level AA, এবং নির্দিষ্ট সময় পরপর পর্যালোচনা না করে প্রতিটি রিলিজে এটি পরীক্ষা করা হয়। প্রতিটি উপাদান যে ব্যাকগ্রাউন্ডে আসলে দেখানো হয়, তার বিপরীতে কনট্রাস্ট মাপা হয়, এবং কোনো পরীক্ষায় ব্যর্থ হলে বিল্ড আটকে যায়। পূর্ণাঙ্গ সামঞ্জস্যের দাবি করা হয় না।
JavaScript ছাড়া Telvio-এর ওয়েবসাইট কি কাজ করে?
হ্যাঁ। কোনো কিছু ডিফল্টভাবে লুকিয়ে রেখে স্ক্রিপ্টের মাধ্যমে দেখানো হয় না, তাই JavaScript নিষ্ক্রিয় বা ব্লক করা থাকলেও প্রতিটি পেজের কনটেন্ট দেখা যায়। তুলনা করার ফিল্টারের মতো ইন্টার্যাক্টিভ ফিচারগুলো এমন পেজের ওপর অতিরিক্ত সুবিধা হিসেবে কাজ করে, যেগুলো আগেই কাজ করে।
Telvio-এর অ্যাক্সেসিবিলিটি অডিট হয়েছে কি?
ওয়েবসাইট বা অ্যাপ—কোনোটিরই তৃতীয় পক্ষের অডিট করা হয়নি। সাইটের প্রতিটি রিলিজে স্বয়ংক্রিয় ও ম্যানুয়াল পরীক্ষা চালানো হয়, এবং এই বিবৃতিতে জানা সীমাবদ্ধতাগুলো বাদ না দিয়ে উল্লেখ করা হয়েছে।
স্ক্রিন রিডার ব্যবহার করে কি Telvio অ্যাপ ব্যবহার করা যায়?
অ্যাপটি প্ল্যাটফর্মের নিজস্ব অ্যাক্সেসিবিলিটি ফিচারের ওপর নির্ভর করে—iOS-এ VoiceOver ও Dynamic Type, আর Android-এ TalkBack ও ফন্ট স্কেলিং। ওয়েবসাইটের তুলনায় অ্যাপটি কম ঘন ঘন অডিট করা হয়, এবং প্রতিটি রিলিজের জন্য কোনো আনুষ্ঠানিক অ্যাক্সেসিবিলিটি অডিট চালানো হয় না।
অ্যাক্সেসিবিলিটি-সংক্রান্ত সমস্যা কীভাবে জানাব?
[email protected] ঠিকানায় Accessibility বিষয় দিয়ে ইমেল করুন। কোন পেজ বা স্ক্রিনে সমস্যা হয়েছে, আপনি কী করতে চেয়েছিলেন এবং কী ঘটেছে—তা লিখুন। আপনি কোন সহায়ক প্রযুক্তি ও ভার্সন ব্যবহার করছেন তা জানালে সুবিধা হবে, তবে এগুলো দেওয়া বাধ্যতামূলক নয়। আমরা পাঁচ কর্মদিবসের মধ্যে উত্তর দেওয়ার চেষ্টা করি।
আমার ভাষায় সাইটে অন্য ফন্ট কেন ব্যবহার করা হয়?
সাইটটি যে দুটি টাইপফেসে তৈরি, সেগুলোতে শুধু Latin script রয়েছে। Cyrillic, Devanagari, Georgian, Thai, Arabic, Hebrew, Bengali, Ethiopic এবং CJK-এর ক্ষেত্রে প্ল্যাটফর্মের নিজস্ব ফন্ট ব্যবহার করা হয়। সাধারণত এতে লেখা পড়া সহজ হয়, তবে ওই লোকেলগুলোতে টাইপোগ্রাফির খুঁটিনাটি আমাদের নিয়ন্ত্রণে থাকে না।
