عناوین محتوای مقاله
احتمالاً، سالمندان بخش قابل توجهی از مخاطبان هدف کسبوکارها را تشکیل میدهند. دبیرخانه شورای ملی سالمندان و مرکز آمار ایران، پیشبینی میکند که جمعیت بزرگسالان ایران با سن ۶۵ سال یا بالاتر تا سال ۱۴۲۱ به ۱۸ میلیون نفر خواهد رسید.
اولویتدادن به طراحی فراگیر و بهکارگیری شاخصهای شیوهنامهٔ دسترسیپذیری محتوای وب (WCAG) میتواند به شما کمک کند تا با بهبود تجربهٔ افراد مسن، به آن بازار در حال رشد دسترسی پیدا کنید.
از رنگ (و کنتراست رنگ) به روشی دسترسیپذیر استفاده کنید
یک مطالعه در سال ۲۰۲۳ نشان داد حدود ۲۵ درصد از بزرگسالان بالای ۷۱ سال تا حدی دچار اختلال بینایی هستند. این ممکن است یک تخمین نسبی باشد، بسته به اینکه «اختلال بینایی» چگونه تعریف شود.
محتوای صرفاً بصری برای بخش قابلتوجهی از کاربران دسترسپذیر نیست. شیوهنامۀ دسترسیپذیری محتوای وب (WCAG) حاوی الزاماتی بهنام شاخصهای موفقیت است که بهترین شیوههای استفاده از رنگ را تعیین میکند:
شاخص موفقیت ۱.۴.۱ – کاربرد رنگها، نیازمند آن است که رنگ به عنوان تنها وسیله بصری برای انتقال اطلاعات، نشان دادن یک عمل، درخواست پاسخ یا تمایز یک عنصر بصری استفاده نشود.
شاخص موفقیت ۱.۴.۳ – حداقل کنتراست، نسبت کنتراست متن و پسزمینه باید حداقل ۴.۵:۱ باشد. این باعث میشود محتوا برای افرادی که دچار کوررنگی (CVD) ↗ و سایر مشکلات بینایی هستند که بر توانایی آنها در خواندن متن با کنتراست کم تأثیر میگذارد، دسترسپذیر باشد.
در طراحی وبسایت خود، به نحوهٔ استفاده از رنگ فکر کنید. آیا وب سایت شما بهتنهایی از رنگ برای انتقال معنا استفاده میکند. بهعنوان مثال، متن راهنمایی که توضیح میدهد: «روی دکمه سبز کلیک کنید.»، شاخص موفقیت ۱.۴.۱ – کاربرد رنگها را نقض کرده است. هیچ مفهومی را صرفاً از طریق رنگ به کاربران منتقل نکنید.
کنتراست رنگ بسیار مهم است، و متأسفانه، یکی از رایج ترین مشکلات WCAG است. WebAim اعتبارسنجِ دسترسیپذیریِ کنتراستِ رنگها را ارائه میدهد، یک ابزار آنلاین رایگان که جفت رنگها (رنگ متن و زمینهٔ آن) را با الزامات WCAG مناسبسنجی میکند.
- coolors ↗
- Color contrast checker analyzer tool | Adobe Color ↗
- Color Contrast Checker – ColorKit ↗
- ColorKit ↗
- Color contrast checker (photutorial.com) ↗
پلاگینهای فیگما برای کنتراست چک
- Contrast | Figma ↗
- ↗Stark – Contrast & Accessibility Checker | Figma ↗
- A11y – Color Contrast Checker | Figma ↗
- Contrast Checker | Figma ↗
- Color contrast checker WCAG 2.1 | Figma ↗
- Color Contrast Checker | Figma ↗
مطمئن شوید که وب سایت شما تا ۲۰۰ درصد بزرگنمایی میشود
بسیاری از افراد دارای نقصِ بینایی از نرمافزارهای بزرگنمایی صفحه یا بزرگنمایی مرورگر خود استفاده میکنند. بزرگکردن محتوا برای آنها امکان خواندن راحت را فراهم میکند.
۲ شاخص موفقیت WCAG را میتوان برای آزمایش محتوای شما برای سازگاری با ابزارهای بزرگنمایی صفحه استفاده کرد:
- شاخص موفقیت ۱.۴.۱۰ – انطباقپذیری، در قانون «انطباقپذیری (Reflow)» باید مطمئن شوید که محتوا، بدون نیاز به کشیدن صفحه در دو جهت، معنا و کارکرد خود را حفظ میکند.
- شاخص موفقیت ۱.۴.۴ – تغییر اندازه متن، کاربران میتوانند اندازهٔ متن را بدون آنکه محتوا یا عملکرد آسیبی ببیند، تا ۲۰۰ درصد افزایش دهند.
اگر با استفاده از کنترلهای مرورگر وب، محتوای خود را بزرگنمایی کنید، هیچ چیز نباید خراب شود. باید بتوانید محتوا را بدون اسکرول در دو جهت افقی و عمودی بدون اسکرول بخوانید و همه چیز باید بههمانترتیب نمایش قبل از بزرگنمایی ظاهر شود.
وب سایت خود را برای دسترسی از طریق صفحه کلید آزمایش کنید
بسیاری از افراد از ماوس استفاده نمیکنند. آنها ممکن است آرتروز یا سایر شرایطی داشته باشند که بر تحرک آنها تأثیر میگذارد، یا ممکن است از نرمافزار خوانش صفحه برای مرور وب استفاده کنند. در برخی موارد، آنها به سادگی صفحه کلید را به ماوس ترجیح میدهند – بسیاری از توسعه دهندگان در این دسته قرار میگیرند – اما صرف نظر از اینکه چرا از صفحه کلید استفاده میکنند، شما باید یک تجربه کاربری مناسب برای آنها فراهم کنید.
اصول دسترسی صفحه کلید ساده هستند
کاربران وبسایت شما باید بتوانند فقط با صفحه کلید بهطور کامل، تمامی بخشها را پیمایش باشد. شما باید یک کلید برای رد شدن از عناصر و محتوای تکراری هر صفحه ارائه دهید. شاخص موفقیت ۲.۴.۱ – پرش از روی بلوکها، «پرش از روی بلوکها»، قابلیتی است که به کاربران امکان میدهد از روی بلوکهای تکراری محتوا بهسادگی عبور کنند.
میتوانید با مرور وب سایت خود بدون ماوس و فقط با صفحهکلید، یک تست اولیه انجام دهید. برای حرکت از کلیدهای جهت نما و دستورات Tab و Shift+Tab استفاده کنید. آیا همه چیز همانطور که انتظار میرود کار میکند؟
شاخص موفقیت ۲.۱.۱ – صفحه کلید، همه عملکردها (functionality) باید با صفحه کلید و بدون زمانبندی مشخص قابل دسترسی باشند.
شاخص موفقیت ۲.۴.۱۱ – حداقلهای ظاهر فوکوس، تحقق شاخص «حداقلهای ظاهر فوکوس» مستلزم آن است که نشانگرهای فوکوس در هنگام فعال بودن، به وضوح قابل تشخیص باشند.
وب سایت خود را قابل پیشبینی بسازید و دستورالعملهای واضح ارائه دهید
وبسایتهای خوب طراحی شده قابلپیشبینی هستند: عناصر ظاهری در تمام صفحات بهترتیب مشخصی قرار میگیرند. زمانی که افراد با وبسایت تعامل میکنند، هرگز نباید غافلگیر شوند؛ بلکه باید کاملا بر روند کار مسلط باشند. این موضوع بهخصوص زمانی که برای افراد سالمند محتوا تولید می کنید اهمیت پیدا میکند.
شاخص موفقیت ۳.۲.۳ – ناوبری یکپارچه، برای رعایت شاخص «ناوبری یکپارچه (Consistent Navigation)»، لازم است منوها و سایر کنترلهای استاندارد، بهگونهای یکپارچه جانمایی شوند.
به عنوان مثال، یک لینک که نوشته شده “درباره خدمات ما بیشتر بدانید” نباید کاربر را به سبد خرید هدایت کند؛ این کار برای هیچ کاربری خوشایند نیست، اما برای کسی که دارای معلولیت است، بهطرز ویژهای ناامیدکننده و اعصابخوردکن خواهد بود.
شاخص موفقیت ۳.۲.۴ – شناسههای یکپارچه، شاخص «شناسههای یکپارچه»، ناظر بر این نکته است که اجزای صفحه که عملکرد مشابه دارند، باید بر مبنای یک الگوی واحد بهکار گرفته شوند.
شاخص موفقیت ۲.۴.۵ – مسیرهای چندگانه، دستورالعمل «مسیرهای چندگانه (Multiple ways)»، توصیه میکند برای دسترسی به هر کدام از صفحات وبسایت، حداقل دو راه در نظر بگیرید.
وقتی محتوای وب قابلپیشبینی نباشد
- فردی که دارای معلولیت حرکتی است، ممکن است برای مسیریابی در وبسایت به زمان بیشتر و هزینهٔ تعاملِ فیزیکی بیشتری نیاز داشته باشد.
- فردی که دارای معلولیت بینایی است، ممکن است فکر کند لینک اشتباهی را کلیک کرده است.
- فردی که دارای مشکلات شناختی است، ممکن است گیج یا سردرگم شود.
- همهٔ کاربران تعجب خواهند کرد که چرا وبسایت عجیب و سخت کار میکند؟
شما میتوانید با اطمینان از تکرار عناصر ناوبری (بخش های مختلف وبسایت مانند منو) بهترتیب یکسان در تمام صفحات، پیشبینیپذیری را بهبود بخشید. لینکهایی با متن توصیفی دقیق ارائه دهید و در صفحات با محتوای زیاد از عناوین و زیرعناوین مرتبط استفاده کنید.
مهمتر از همه، دستورالعملهای واضحی (شاخص موفقیت ۳.۳.۵ – راهنما) برای فرمها ،سبد خرید و دیگر تعاملات کاربر ارائه دهید. دستورالعملها به کاربر دقیقاً میگویند که چه کاری باید انجام دهد و چه انتظاری میتواند از انجام آن کار داشته باشد.
با کاربران واقعی آزمون دسترسی (Accessibility Tetsing) برگزار کنید
بر اساس گزارش مرکز کنترل و پیشگیری بیماری (CDC)، حدود ۴۰ درصد از بزرگسالان بالای ۶۵ سال حداقل یک نوع معلولیت دارند. تست کردن انطباقپذیری محتوای شما براساس WCAG به شما کمک میکند تا میزان دسترسی کاربران سالمند خود را بسنجید و آن را بهبود بخشید.
بهیاد داشته باشید نباید یک محصول را فقط برای محدودهٔ خاصی از ناتوانی دسترسپذیر کرد و مواردی که در مقالهٔ ذکر شده است صرفاً جهت آشنایی و ایجاد حساسیت بیان شده است. برای تولید یک محصول دسترسپذیر برای سامندان، در قدمهای اولیه باید محصول را منطبق بر تمامی شاخصهای سطح AA کنید.
دسترسیسازی امری ساده است اما عدم برنامهریزی و نگاه پروژه کوتاهمدت به آن، کار را سخت میکند. درواقع باید برای دسترسپذیر کردنِ هر فیچرِ محصول در بَکلاگ آن محصول، برنامهٔ دسترسپذیرسازی بهعنوان یک وظیفهٔ تیم توسعه تعریف شود.
نویسنده: سوده محمدآبادی ↗
ویراستار و مطالب تکمیلی: آرتا مکبری