آیا می‌دانستید که ۴ درصد از کل جمعیت جهان مبتلا به کور رنگی هستند؟ در کنار این جمعیت، افراد بسیار زیادی دیگری نیز هستند که اختلالات بینایی متفاوتی دارند. در نظر نگرفتن این جمعیت می‌تواند روی خوانایی و استفاده‌پذیری وبسایت‌تان تاثیر منفی داشته باشد.
خیلی از افراد و طراحان وبسایت از موضوع دسترسی‌پذیری هراس دارند و نمی‌توانند به خوبی آن را پیاده‌سازی کنند. البته این در نهایت به خود شما بستگی دارد که می‌خواهید وبسایتی همگانی داشته باشید یا نه، اما باید بگویم که پیاده‌سازی دسترسی‌پذیری مناسب مخصوصا برای موضوع رنگ‌ها کاری بسیار آسان‌تر از چیزی‌ست که فکرش را می‌کنید.
دسترسی‌پذیری چیست؟
در دنیای طراحی وبسایت، استانداردها و نکات بسیار مهمی در ارتباط با دسترسی‌پذیری وجود دارند که در نهایت یک هدف منحصر به فرد را دنبال می‌کنند. هدف‌شان این است که وبسایت را به صورتی تبدیل کنند که همه افراد جامعه بتوانند به سادگی آن را درک و دریافت نمایند.
موضوعاتی که دسترسی‌پذیری آن‌ها را مورد هدف قرار می‌دهد بسیار گسترده است، از صوت، ناوبری و مشخصات متن گرفته، تا رنگ، فیدبک و… . موردی که ما می‌خواهیم در این مطلب روی آن تمرکز داشته باشیم رنگ است. به این دلیل که یکی از ساده‌ترین مشکلاتی است که می‌تواند روی یک وبسایت تشخیص داده شده و در عین حال حل شود.
زمانی که رسانه‌های بصری مانند وبسایت را بررسی می‌کنیم، افرادی که اختلالات بینایی دارند را به عنوان یک فاکتور بسیار مهم باید در نظر گرفت. براساس CBA که مخفف آگاهی‌رسانی کور رنگی است، از هر ۱۲ مرد یک نفر و از هر ۲۰۰ زن یک نفر به یکی از بیماری‌های مربوط به مشکلات بینایی و مشکلات شناختی رنگ دچار است.
یکی از موضوعات مهمی که در زمان پیاده‌سازی دسترسی‌پذیری رنگی باید در نظر گرفته شود، کنتراست رنگ‌ها یا تضاد آن‌ها با یکدیگر است.
منظور از رنگ‌ها، رنگ پس زمینه و رنگ قلم است. شما باید یک تعامل و همخوانی بسیار خوبی را بین رنگ پس زمینه و رنگ قلمی که متون با آن نوشته شده‌اند را در نظر بگیرید. برای مثال استفاده از رنگ سفید برای پس زمینه و رنگ سیاه برای قلم یک راهکار ساده و در عین حال بسیار کاربردی است.
براساس WCAG یا راهنماهای دسترسی‌پذیری محتوای وب شما نباید برای ساخت یک تعامل، رساندن یک مفهوم، خروجی یک جواب و متمایز کردن المان‌های بصری صرفا از رنگ استفاده کنید. در این راهنما، بهترین رویکردها برای ایجاد دسترسی‌پذیری رنگ به شکل زیر عنوان شده است:
- ایجاد کنتراست بالا در بین پس زمینه و پیش زمینه امری مهم است. کنتراست باید بین دو المان ایجاد شود که به شکلی به همدیگر مرتبط هستند.
- تنها از رنگ برای ارائه اطلاعات یا تفهیم آن‌ها استفاده نکنید، استفاده از یک متن در کنار آن می‌تواند دسترسی‌پذیری را بالاتر ببرد.
- مطمئن شوید که المان‌های تعاملی و المان‌های ناوبری وبسایت به خوبی قابل تشخیص باشند، استفاده از hover برای تغییر رنگ‌ها به تنهایی کافی نیست.
- مطمئن شوید که برچسب فرم‌ها از رنگی استفاده می‌کند که به سادگی قابلیت خوانایی داشته باشد؛ این موضوع را روی خطاها و دیگر المان‌های فیدبک نیز در نظر بگیرید.
- نرخ کنتراست متون و المان‌های تعاملی باید حداقل4.5:1 باشد.
۱۰ ابزار دسترسی‌پذیری رنگ
ابزارهای بسیار زیادی برای آنکه مطمئن شوید تا از ترکیبات رنگی مناسبی برای وبسایت استفاده کرده‌اید وجود دارند. در این قسمت از مطلب قصد داریم تا شما را با ۱۰ مورد از این ابزارها آشنا کنیم.
WebAIM Color Contrast Checker ابزاری است که به شما قابلیت اندازه‌گیری نرخ کنتراست بین پیش‌زمینه و پس زمینه را می‌دهد، هدف نهایی مقداری بالاتر از ۴.۵:۱ است.
Colorable ابزاری است که کنتراست را از طریق روشنایی موجود در رنگ‌ها بررسی می‌کند. ویژگی منحصر به فردی که این ابزار ارائه می‌کند این است که فارغ از خود رنگ، مشخصات آن را نیز در تست قرار می‌دهند. عمق، روشنایی و… از این مشخصات هستند.
Color Safe
Color Safe به شما در ایجاد یک پالت رنگی براساس راهنماهای WCAG کمک می‌کند. این پالت‌ها به شما اطمینان می‌دهند که از پس زمینه و پیش زمینه‌هایی با نرخ کنتراست بالای استفاده می‌کنند. در نهایت شما با مجموعه‌ای از رنگ‌ها همراه خواهید شد که قابلیت خوانایی بالایی را برای وبسایت‌تان به ارمغان می‌آورند.
Web Accessibility Guidelines یک ابزار برای کمک به شما در جهت تست کنتراست است. در این ابزار رنگ‌های متنی مختلف روی پس زمینه‌های مختلف قرار می‌گیرند. هدف از این کار شناسایی رنگ‌هایی است که می‌توانند برای خواندن بهینه باشند. در واقع این ابزار در یک دسته‌بندی الهام گیری نیز قرار می‌گیرد.
Stark یک پلاگین برای اسکچ و ادوبی XD است که به شما در تست کارها و بالا بردن قابلیت دسترسی‌پذیری طراحی‌ها کمک می‌کند. شما می‌توانید در این ابزار تست کنتراست بگیرید، از یک شبیه‌سازی برای افرادی که مبتلا به کور رنگی هستند برخوردار شوید و حتی پیشنهاداتی را برای بهبود رنگ‌ها دریافت کنید.
Colors For All یک چارت عظیم از رنگ‌هاست که روشی مناسب برای ترکیب رنگ‌ها را براساس استانداردهای WCAG به شما نشان می‌دهد.
Color Blind Web Page Filter ابزاری است که از شما یک آدرس را دریافت می‌کند و براساس یک فیلتر، شیوه نمایش وبسایت‌تان را برای افراد کور رنگ نمایش می‌دهد. زمانی که قصد شبیه‌سازی این حالت را داشته باشید این ابزار به خوبی به شما کمک می‌کند.
Color Review یک اپلیکیشن ساده است که به شما در بررسی کنتراست‌های رنگی کمک می‌کند. در این اپلیکیشن یک eyedropper و یک swatch نیز موجود است.
Colors شامل ۹۰ ترکیب از رنگ‌هایی است که برای طراحی وبسایت با الگوهای دسترسی‌پذیری سازگار است. هر ترکیب در این ابزار یک نرخ و راهنمای اندازه را به شما نشان می‌دهند. اگر می‌خواهید یک پالت رنگی مناسب را داشته باشید به نظر می‌رسد که این ابزار بسیار مناسبی باشد.
Contrast Grid
Contrast Grid به شما این امکان را می‌دهد تا بتوانید درک خوبی از ترکیبات پیش زمینه و پس زمینه را برای داشتن کنتراستی بالا داشته باشید. شما می‌توانید هر رنگی را در نظر بگیرید، ابزار از طریق یک حالت شبکه‌ای به شما کنتراست رنگ‌های مختلف را با آن رنگ نمایش می‌دهد.
در پایان
زمانی که قصد طراحی وبسایت را داشته باشید، باید بدانید که دسترسی‌پذیری بسیار مهم است. حتی اگر دید بصری عالی داشته باشید باید یک قدم به عقب برگشته و به فکر افرادی باشید که ممکن است مشکلاتی داشته باشند.
دسترسی‌پذیری باید به عنوان قاعده‌ای در نظر گرفته شود که شما در تمام طراحی‌های خود در نظر می‌گیرید. هدف یک وبسایت بسیار زیبا چیست زمانی که بخشی از کاربران نتواند از آن استفاده کنند؟
دیدگاه و پرسش
در حال دریافت نظرات از سرور، لطفا منتظر بمانید
در حال دریافت نظرات از سرور، لطفا منتظر بمانید