এই নিয়ম কী যাচাই করে
নিশ্চিত করে যে <img> এলিমেন্টে বিকল্প লেখা আছে, অথবা none বা presentation role আছে.
কেন এটি গুরুত্বপূর্ণ
WCAG 1.1.1 অনুযায়ী অর্থবহ ছবির জন্য বিকল্প লেখা থাকতে হবে। এটি না থাকলে স্ক্রিন রিডার ব্যবহারকারী বুঝতে পারেন না ছবিতে কোন প্রোডাক্ট দেখানো হয়েছে।
কীভাবে ঠিক করবেন
যেকোনো ওয়েবসাইটে
- আপনার CMS বা টেমপ্লেটে প্রতিটি ছবির alt টেক্সটে একটি ছোট, সুনির্দিষ্ট বর্ণনা যোগ করুন।
- একজন ক্রেতার কাছে যা গুরুত্বপূর্ণ তা বর্ণনা করুন: প্রোডাক্টের নাম, রং এবং কোন দিক থেকে দেখানো হয়েছে (যেমন ‘জলপাই রঙের ক্যানভাস টোট ব্যাগ, সামনের দিক’)।
- সাজসজ্জার ছবিতে খালি alt অ্যাট্রিবিউট (alt="") থাকা উচিত, যাতে স্ক্রিন রিডার সেগুলো এড়িয়ে যায়।
Shopify-তে
- Shopify অ্যাডমিনে Products > [product] > Media খুলুন, প্রতিটি ছবিতে ক্লিক করুন এবং ‘Alt text’ পূরণ করুন। সেকশনের ছবির জন্য Online Store > Themes > Customize খুলুন এবং সেকশন সেটিংসে ছবির alt টেক্সট সেট করুন।
- একজন ক্রেতার কাছে যা গুরুত্বপূর্ণ তা বর্ণনা করুন: প্রোডাক্টের নাম, রং এবং কোন দিক থেকে দেখানো হয়েছে (যেমন ‘জলপাই রঙের ক্যানভাস টোট ব্যাগ, সামনের দিক’)।
- সাজসজ্জার ছবিতে খালি alt অ্যাট্রিবিউট (alt="") থাকা উচিত, যাতে স্ক্রিন রিডার সেগুলো এড়িয়ে যায়।
WooCommerce ও WordPress-এ
- WordPress-এ Media > Library খুলুন, প্রতিটি ছবি সিলেক্ট করুন এবং ‘Alternative Text’ পূরণ করুন। প্রোডাক্ট গ্যালারির ছবিতেও একই ফিল্ড ব্যবহৃত হয়।
- একজন ক্রেতার কাছে যা গুরুত্বপূর্ণ তা বর্ণনা করুন: প্রোডাক্টের নাম, রং এবং কোন দিক থেকে দেখানো হয়েছে (যেমন ‘জলপাই রঙের ক্যানভাস টোট ব্যাগ, সামনের দিক’)।
- সাজসজ্জার ছবিতে খালি alt অ্যাট্রিবিউট (alt="") থাকা উচিত, যাতে স্ক্রিন রিডার সেগুলো এড়িয়ে যায়।
সংশোধন কীভাবে যাচাই করবেন
- প্রভাবিত পেজগুলো আবার স্ক্যান করুন।
- প্রোডাক্টের ছবিগুলো কীভাবে ঘোষণা করা হয় তা শুনতে একটি স্ক্রিন রিডার ব্যবহার করুন (VoiceOver: Mac-এ Cmd+F5)।
FixReports কীভাবে এটি খুঁজে পায়
আমাদের স্ক্যান যে পেজই পরীক্ষা করে, সেখানে একটি আসল Chrome ব্রাউজারে axe-core-এর image-alt নিয়মটি চালায়, এবং প্রতিটি ব্যর্থ এলিমেন্ট তার পেজ, মার্কআপ এবং প্রযোজ্য হলে একটি স্ক্রিনশটসহ জানায়।
একটি স্বয়ংক্রিয় পরীক্ষা নিশ্চিত করে যে এই নির্দিষ্ট সমস্যাটি আছে। পেজের বাকি অংশ অ্যাক্সেসিবল কি না, তা এটি বলতে পারে না: কিছু বাধা কেবল তখনই ধরা পড়ে, যখন একজন মানুষ পেজটি যাচাই করেন।