ফ্রি অ্যাক্সেসিবিলিটি টুল

WCAG 2.2 চেকার

WCAG 2.2 লেভেল A ও AA-এর 55টি সাফল্যের মানদণ্ডের প্রতিটিতে আপনার সাইট কোথায় দাঁড়িয়ে আছে, তা দেখুন। প্রতিটি মানদণ্ড চারটি স্ট্যাটাসের একটি পায়, ফলে আপনি বুঝতে পারেন স্বয়ংক্রিয় পরীক্ষা কী কী কভার করেছে আর কী এখনো একজন মানুষকে যাচাই করতে হবে।

ফ্রি। প্রায় এক মিনিটে সর্বোচ্চ 5টি মূল পেজ পরীক্ষা করে।

এই টুল কী যাচাই করে

  • লেভেল A ও AA-এর প্রতিটি মানদণ্ড

    সব 55টি মানদণ্ড, লেভেল A-তে 31টি ও লেভেল AA-তে 24টি, WCAG-এর ক্রম অনুযায়ী তাদের নম্বর ও নামসহ। 4.1.1 Parsing বাদ দেওয়া হয়েছে, কারণ WCAG 2.2 এটিকে অপ্রচলিত (obsolete) হিসেবে চিহ্নিত করেছে।

  • মানদণ্ডের সঙ্গে মেলানো স্বয়ংক্রিয় ফলাফল

    আপনার দেওয়া পেজ ও সর্বোচ্চ আরও চারটি গুরুত্বপূর্ণ পেজে axe-core-এর নিয়ম চলে, এবং প্রতিটি ফলাফল সেই সাফল্যের মানদণ্ডের সঙ্গে যুক্ত করা হয়, যা ওই নিয়ম পরীক্ষা করে। কোনো পরীক্ষিত পেজে কোনো মানদণ্ডের যেকোনো একটি নিয়ম ব্যর্থ হলেই মানদণ্ডটি ব্যর্থ হয়।

  • কীবোর্ড থেকে পাওয়া প্রমাণ

    প্রথম পেজে 40 বার Tab চাপার একটি পরীক্ষা 2.1.2 No Keyboard Trap-এর জন্য তথ্য দেয়, এবং পর্যালোচনার জন্য দেখানো একটি হিউরিস্টিক হিসেবে 2.4.7 Focus Visible-এর জন্যও।

  • অমীমাংসিত ফলাফল আলাদা রাখা

    কোনো নিয়ম যখন সিদ্ধান্তে পৌঁছাতে পারে না, যেমন ছবির ওপরের লেখার ক্ষেত্রে, তখন তার মানদণ্ডগুলো উত্তীর্ণ বা ব্যর্থের বদলে পর্যালোচনা প্রয়োজন দেখায়।

  • স্কোরের বদলে দৃশ্যমান ফাঁক

    যেসব মানদণ্ড কোনো স্বয়ংক্রিয় নিয়মের আওতায় পড়ে না, সেগুলো ম্যানুয়াল যাচাই (Manual check) হিসেবে চিহ্নিত হয়। কোনো কিছুকে গড় করে এমন শতাংশে পরিণত করা হয় না, যা আড়াল করে দেবে কী পরীক্ষা করা হয়নি।

যা এটি যাচাই করতে পারে না

  • যেসব মানদণ্ডে মানুষের বিচার প্রয়োজন, সেগুলোর সিদ্ধান্ত নেওয়া, যেমন 1.4.10 Reflow, 1.4.11 Non-text Contrast, ক্যাপশন ও অডিও বর্ণনা নিয়ে 1.2-এর মানদণ্ডগুলো, এবং ফর্মের ত্রুটি নিয়ে 3.3.1 থেকে 3.3.4।
  • “কোনো স্বয়ংক্রিয় ব্যর্থতা নেই” (No automated failures) স্ট্যাটাসকে উত্তীর্ণ হিসেবে গণ্য করা। যে নিয়ম চলেছে এবং উত্তীর্ণ হয়েছে, সেটি কেবল ওই নিয়ম যা পরীক্ষা করে তা-ই কভার করে।
  • কনফরম্যান্স দাবি (conformance claim), অ্যাক্সেসিবিলিটি বিবৃতি বা VPAT তৈরি করা। কনফরম্যান্স বিচার করেন মানুষ, পূর্ণ পেজ ও সম্পূর্ণ প্রক্রিয়ার ভিত্তিতে।
  • লেভেল AAA পরীক্ষা করা, বা স্ক্যানের পাঁচটি পেজের বাইরের পেজ পরীক্ষা করা।
  • লগইন বা চেকআউটের পেছনের ধাপগুলোতে পৌঁছানো, যেখানে সাধারণত 3.3.7 Redundant Entry ও 3.3.8 Accessible Authentication-এর মতো মানদণ্ড প্রযোজ্য হয়।

কেন এটি গুরুত্বপূর্ণ

WCAG লেখা হয়েছে সাফল্যের মানদণ্ড আকারে, এবং অডিটর, ক্রয় (প্রোকিউরমেন্ট) দল ও অ্যাক্সেসিবিলিটি বিবৃতি এভাবেই একটি সাইটের বর্ণনা দেয়। ব্যর্থ নিয়মের একটি তালিকা বলে কী ঠিক করতে হবে। মানদণ্ড-ভিত্তিক দৃশ্য বলে সাইটটি সম্পর্কে আপনি কী বলতে পারেন আর এখনো কী বলতে পারেন না।

স্বয়ংক্রিয় টুল লেভেল A ও AA-এর অর্ধেকেরও কম মানদণ্ড ছুঁতে পারে: axe-core তার নিয়মগুলো 55টির মধ্যে প্রায় 25টির সঙ্গে যুক্ত করে। বাকিগুলোর জন্য কোনো নির্ভরযোগ্য স্বয়ংক্রিয় পরীক্ষা নেই। কোনো ত্রুটির বার্তা সংশোধনের পরামর্শ দেয় কি না (3.3.3), বা 320 CSS পিক্সেল প্রস্থে পেজটি তখনো কাজ করে কি না (1.4.10), সফটওয়্যার তা বলতে পারে না। এগুলোকে ম্যানুয়াল যাচাই হিসেবে তালিকাভুক্ত করলে বোঝা যায় কোথায় এখনো পরীক্ষা বাকি।

এমনকি যে মানদণ্ডে কোনো স্বয়ংক্রিয় ব্যর্থতা নেই, সেটিও ব্যর্থ হতে পারে। 1.1.1 Non-text Content-এর নিয়ম যাচাই করে যে ছবির অল্ট টেক্সট আছে; কিন্তু সেগুলো বুঝতে পারে না যে যিনি ছবিটি দেখতে পান না, তাঁর কাছে alt="IMG_2041.jpg" অর্থহীন।

ফলাফল কীভাবে বুঝবেন

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

সবচেয়ে সাধারণ সমস্যাগুলো কীভাবে ঠিক করবেন

  • 4.1.2 Name, Role, Value ব্যর্থ

    div বা span এলিমেন্ট দিয়ে তৈরি কাস্টম কন্ট্রোল (মেনু, ট্যাব, অ্যাকর্ডিয়ন, টগল) সহায়ক প্রযুক্তিকে জানায় না সেগুলো কী বা খোলা আছে কি না। যেখানে সম্ভব নেটিভ <button> ব্যবহার করুন, তাকে একটি নাম দিন, এবং aria-expanded বা aria-pressed সেট করুন যাতে তার অবস্থা ঘোষিত হয়।

  • 1.3.1 Info and Relationships ব্যর্থ

    গঠন থাকতে হবে মার্কআপে, শুধু স্টাইলে নয়। বোল্ড প্যারাগ্রাফের বদলে আসল h2 ও h3 এলিমেন্ট, তালিকার জন্য ul বা ol, টেবিলের হেডারের জন্য scope-সহ th, এবং ফর্ম ফিল্ডের গ্রুপের জন্য লেবেল বা legend-সহ fieldset ব্যবহার করুন।

  • 3.1.1 Language of Page ব্যর্থ

    html এলিমেন্টে একটি lang অ্যাট্রিবিউট যোগ করুন, যেমন <html lang="en">। WordPress থিম সাধারণত language_attributes() দিয়ে এটি প্রিন্ট করে; Shopify থিমে layout/theme.liquid ফাইলে <html lang="{{ request.locale.iso_code }}"> ব্যবহার করুন।

  • 2.5.8 Target Size (Minimum) ব্যর্থ

    ছোট আইকন আর গায়ে গায়ে লাগানো লিংক আঙুল দিয়ে চাপা কঠিন। প্রতিটি টার্গেট অন্তত 24 × 24 CSS পিক্সেল করুন, অথবা ছোট টার্গেটগুলোর মধ্যে এমন ফাঁক রাখুন যাতে প্রতিটির কেন্দ্রে বসানো 24 px-এর একটি বৃত্ত অন্য কোনো টার্গেটের ওপর না পড়ে। প্যাডিং আইকন না বদলেই টার্গেট বড় করে।

  • ম্যানুয়াল যাচাইগুলো একে একে সেরে ফেলা

    দ্রুত যেগুলো করা যায় সেগুলো দিয়ে শুরু করুন। 1.4.10 Reflow-এর জন্য 1280 px চওড়া একটি ব্রাউজার উইন্ডো 400% পর্যন্ত জুম করুন এবং দেখুন কোনো কিছুর জন্য পাশাপাশি স্ক্রল করতে হয় কি না। 2.4.7 ও 2.4.11-এর জন্য পেজে Tab চেপে এগোন এবং দেখুন ফোকাস সবসময় দৃশ্যমান কি না, আর কখনো স্টিকি হেডার বা কুকি ব্যানারের আড়ালে চলে যায় কি না। 3.3.1-এর জন্য ভুলসহ একটি ফর্ম জমা দিন এবং দেখুন ত্রুটিগুলো লেখায় স্পষ্টভাবে বর্ণনা করা হয় কি না।

এই টুল নিয়ে প্রশ্ন

WCAG 2.2-এ লেভেল A ও AA-তে কী বদলেছে?

ছয়টি মানদণ্ড যোগ হয়েছে: 2.4.11 Focus Not Obscured (Minimum), 2.5.7 Dragging Movements, 2.5.8 Target Size (Minimum), 3.2.6 Consistent Help, 3.3.7 Redundant Entry এবং 3.3.8 Accessible Authentication (Minimum)। WCAG 2.2 লেভেল AAA-তেও তিনটি মানদণ্ড যোগ করেছে এবং 4.1.1 Parsing বাদ দিয়েছে।

4.1.1 Parsing তালিকায় নেই কেন?

WCAG 2.2 4.1.1 Parsing-কে অপ্রচলিত হিসেবে চিহ্নিত করে বাদ দিয়েছে, কারণ এটি যেসব মার্কআপ ত্রুটি কভার করত, ব্রাউজার ও সহায়ক প্রযুক্তি এখন আর সেগুলোর ওপর নির্ভর করে না। W3C জানিয়েছে, WCAG 2.0 ও 2.1-এর ক্ষেত্রে HTML কনটেন্টের জন্য এটিকে এখন সবসময় পূরণ হয়েছে বলে ধরা হয়।

WCAG 2.2 পূরণ করলে কি WCAG 2.1-ও পূরণ হয়?

হ্যাঁ। WCAG 2.2 আগের সংস্করণগুলোর সঙ্গে সামঞ্জস্যপূর্ণ (backward compatible): যে কনটেন্ট 2.2-এর সঙ্গে সামঞ্জস্যপূর্ণ, তা 2.1 ও 2.0-এর সঙ্গেও সামঞ্জস্যপূর্ণ। তাই 2.2 অনুযায়ী পরীক্ষা করলে সেই পুরোনো সংস্করণগুলোও কভার হয়, যেগুলো অনেক নীতিমালা এখনো উল্লেখ করে।

অ্যাক্সেসিবিলিটি বিবৃতি বা VPAT লিখতে কি আমি এটি ব্যবহার করতে পারি?

এটি একটি সূচনাবিন্দু, কনফরম্যান্স রিপোর্ট নয়। একটি বিবৃতি বা VPAT-এর জন্য প্রতিটি মানদণ্ডের মূল্যায়ন প্রয়োজন, যার বেশিরভাগই একজন মানুষকে করতে হয়; ম্যানুয়াল যাচাই (Manual check) ও পর্যালোচনা প্রয়োজন তালিকা দেখায় কোনগুলোর জন্য এখনো তা দরকার।

এত মানদণ্ডে “ম্যানুয়াল যাচাই (Manual check)” লেখা কেন?

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

সূত্র

সংশ্লিষ্ট টুল

অ্যাক্সেসিবিলিটি সংশোধন রিপোর্ট ($174, এককালীন) পুরো ফ্রি স্ক্যান থেকে শুরু করে এবং যোগ করে আরও পেজ, প্রতিটি সমস্যার জন্য করণীয় পরিবর্তন, একটি PDF এবং আপনার সংশোধন যাচাইয়ের জন্য রি-টেস্ট।

অ্যাক্সেসিবিলিটি সংশোধন রিপোর্ট সম্পর্কে