بسیاری از افراد در فرآیند گردش کار توسعه خود، از توسعه مبتنی بر مولفه با استفاده از راهنماهای سبک الگو، کتابخانههای مولفه یا سیستمهای طراحی کامل استفاده میکنند. حتی اگر به طور رسمی از این ابزارها استفاده نکرده باشید، احتمالاً از فرآیند مشابهی برای تقسیم یک طرح بزرگ برای یک وبسایت، برنامه یا سایر محصولات دیجیتال به قطعات قابل مدیریت استفاده میکنید.
مانند ساختن یک سازه فیزیکی، مهم است که هر بار یک قطعه را بسازیم. ابتدا، فونداسیون، سازه، دیوارها، پنجرهها، سقف و هر چیزی که بین آنها قرار دارد. ابزارهای توسعه مبتنی بر کامپوننت به ما این امکان را میدهند که این کار را برای وبسایتها، برنامهها و سایر محصولات دیجیتال انجام دهیم.
برخی از مزایای توسعه مبتنی بر کامپوننت شامل تقسیمبندی چیزها به قطعات قابل مدیریت است، بنابراین با این اجزای قابل استفاده مجدد، زمان توسعه کمتری وجود دارد. این به طراحان، توسعهدهندگان frontend و backend و QA اجازه میدهد تا همزمان کار کنند. و مشتریان، طراحان، مدیران محصول و موارد دیگر، آن را دوست دارند زیرا میتوانند فرآیند ساخت را پیشنمایش کنند و پس از راهاندازی وبسایت از یک راهنمای سبک زنده به عنوان مرجع استفاده کنند.
با این حال، وقتی به الگوها، اجزا و سیستمهای طراحی با در نظر گرفتن دسترسیپذیری نگاه میکنیم، چند سوال مطرح میشود. چگونه میدانید کدام الگوها در مورد دسترسیپذیری بهترین هستند؟ آیا باید از یک الگو یا کتابخانهی از پیش تعیینشده استفاده کنید یا الگوهای جدیدی ایجاد کنید؟ چگونه میدانید که آیا این الگوها واقعاً به کاربران شما کمک میکنند؟
با وجود انبوهی از گزینههای موجود، ممکن است در مورد الگوها، اجزا و سیستمهای طراحی سردرگم شوید. هدف این ماژول ارائه اطلاعات کلی در مورد چگونگی ارزیابی الگوها، اجزا و سیستمهای طراحی از نظر دسترسیپذیری است و به شما یک نقطه شروع میدهد تا به شما در انتخابهای دسترسیپذیرتر کمک کند.
انتقادی فکر کنید
انتخاب یک الگو، جزء یا سیستم طراحیِ قابل دسترس، کار پیچیدهای نیست، اما به زمان و تفکر انتقادی نیاز دارد. در واقع، چیزی به نام «یک الگوی بینقص» وجود ندارد، اما ممکن است گزینههای زیادی وجود داشته باشند که بتوانند کار کنند. این در مورد یادگیری انتخاب بهترین گزینه برای موقعیت منحصر به فرد شماست.
در ماژولهای تست بعدی، درباره تکنیکها و روشهای ارزیابی الگوها، اجزا و سیستمهای طراحی برای دسترسیپذیری بیشتر خواهید خواند. قبل از رسیدن به آنجا، باید از خود چند سوال اساسی بپرسید، مانند:
- آیا یک الگو، کامپوننت یا سیستم طراحیِ قابل دسترسِ تثبیتشده از قبل وجود دارد؟
- از چه مرورگرها و فناوریهای کمکی (AT) پشتیبانی میکنم؟
- آیا محدودیتی در کد یا چارچوب وجود دارد؟ آیا ادغامها، عوامل یا نیازهای کاربر دیگری وجود دارد که باید در نظر بگیرم؟
بسته به محیط توسعه و نیازهای کاربر، ممکن است سوالات اضافی یا متفاوتی از این سوالات داشته باشید. این سوالات را به عنوان نقطه شروع در ارزیابی دسترسیپذیری خود در نظر بگیرید.
منابع تثبیتشده
قبل از ساختن چیزی کاملاً جدید، بررسیهای لازم را انجام دهید و آنچه را که از قبل در قالب الگوها، اجزا و سیستمهای طراحی قابل دسترس وجود دارد، بررسی کنید. تنها با کمی تحقیق، ممکن است از یافتن یک (یا چند) راهحل که متناسب با نیازهای شما باشد، شگفتزده شوید.
برخی از منابع عالی برای الگوها، اجزا و سیستمهای طراحی قابل دسترس عبارتند از:
- اجزای قابل دسترس
- کتابخانه ARIA دانشگاه دیک
- سیستم طراحی Gov.UK
- اجزای فراگیر
- سرخابیA11y
- سیستم طراحی وب ایالات متحده (USWDS) ، ایجاد شده برای دولت فدرال ایالات متحده
- فهرست الگوهای قابل دسترس از مجله اسمشینگ
برای چارچوبهای جاوا اسکریپت، منابع زیر به طور پیشفرض یا قابل تنظیم برای دسترسی، نسبتاً قابل دسترسی هستند:
- وقتی CSS کافی نیست: الزامات جاوا اسکریپت برای کامپوننتهای قابل دسترس
- واکنش نشان دهید
- انگولار: کتابخانه متریال
- وو: ووتانسیلها
با این حال - و این نکته به اندازه کافی مورد تأکید قرار نمیگیرد - هرگز نباید فقط کد را کپی/پیست کنید و فرض کنید که در محیط شما جای میگیرد و به طور خودکار نیازهای کاربر شما را برآورده میکند. این در مورد همه الگوها، کامپوننتها و سیستمهای طراحی صادق است، حتی اگر به عنوان کاملاً قابل دسترس برچسبگذاری شده باشند.
همه منابع باید به عنوان نقطه شروع در نظر گرفته شوند. حتماً همه چیز را آزمایش کنید!
پشتیبانی از مرورگرها و فناوریهای کمکی (AT)
پس از تحقیق در مورد چند الگوی پایه، کامپوننتها یا یک سیستم طراحی کامل که ممکن است برای محیط توسعه شما مناسب باشد، میتوانید به سراغ پشتیبانی فناوری کمکی بروید. یکی از انواع اصلی فناوری کمکی که هنگام ارزیابی الگوها، کامپوننتها و سیستمهای طراحی باید روی آن تمرکز کنید، صفحهخوانها هستند.
صفحهخوانها با در نظر گرفتن مرورگرهای خاص ساخته شدهاند و وقتی با این مرورگرها جفت شوند، بهترین عملکرد را دارند. ما در ماژول مربوط به تست AT با جزئیات بیشتری به این موضوع خواهیم پرداخت، اما برای اهداف ارزیابی الگو، درک وجود این ترکیبها مفید است، بنابراین میدانید که از نظر پشتیبانی به چه چیزی نیاز دارید.
| صفحه خوان | سیستم عامل | سازگاری با مرورگرها | هزینه |
|---|---|---|---|
| دسترسی شغلی با گفتار (JAWS) | ویندوز | کروم، فایرفاکس، اج | نیاز به مجوز (نسخه رایگان ۴۰ دقیقهای موجود است) |
| دسترسی غیر بصری به دسکتاپ (NVDA) | ویندوز | کروم و فایرفاکس | رایگان (نیاز به دانلود دارد) |
| راوی | ویندوز | لبه | رایگان (به صورت پیشفرض در دستگاههای ویندوزی) |
| صداگذاری | مکاواس | سافاری | رایگان (به صورت پیشفرض در دستگاههای macOS وجود دارد) |
| اورکا | لینوکس | فایرفاکس | رایگان (در توزیعهای مبتنی بر گنوم تعبیه شده است) |
| تاک بک | اندروید | کروم و فایرفاکس | رایگان (در نسخههای خاصی از سیستم عامل اندروید تعبیه شده است) |
| صداگذاری | آیاواس | سافاری | رایگان (به صورت پیشفرض در دستگاههای iOS) |
پشتیبانی مرورگرها عموماً پیچیده است و وقتی دستگاههای AT و مشخصات ARIA را به این ترکیب اضافه میکنید، اوضاع پیچیدهتر هم میشود.
اما همه چیز بد نیست. خوشبختانه، منابع خوبی مانند HTML5 Accessibility ، Accessibility Support و Custom Control Accessible Development Checklist از WCAG به ما کمک میکنند تا پشتیبانی فعلی مرورگرها و دستگاههای AT و حتی زمان استفاده از ARIA را بهتر درک کنیم.
این منابع، زیرعناصر مختلف الگوهای HTML و ARIA موجود، از جمله آزمونهای جامعه متنباز را شرح میدهند. همچنین میتوانید برخی از نمونههای الگو را برای مرورگرهای دسکتاپ، موبایل و دستگاههای AT بررسی کنید. به این ترتیب، این منابع میتوانند به شما کمک کنند تا در مورد الگوها، مؤلفهها و سیستمهای طراحی که ممکن است بخواهید از آنها استفاده کنید، تصمیمی قابل دسترستر بگیرید.
ملاحظات دیگر
وقتی چند الگو یا کامپوننت پایهی قابل دسترس را انتخاب کردید و پشتیبانی مرورگر و دستگاه AT را در نظر گرفتید، میتوانید به سراغ سوالات زمینهای خاصتر در مورد الگو، کامپوننت، سیستم طراحی و محیط توسعه بروید.
برای مثال، اگر در یک سیستم مدیریتی (CMS) کار میکنید یا کد قدیمی دارید، ممکن است محدودیتهایی در مورد الگوهایی که میتوانید استفاده کنید وجود داشته باشد. پس از بررسی، ممکن است چندین الگوی انتخابی به سرعت به یک یا دو گزینه کاهش یابد.
بسیاری از چارچوبهای جاوا اسکریپت به توسعهدهندگان اجازه میدهند تقریباً از هر الگویی که انتخاب میکنند استفاده کنند. در مواردی مانند این، ممکن است محدودیتهای کمتری داشته باشید و بتوانید در دسترسترین گزینه الگو را انتخاب کنید.
هنگام انتخاب یک الگو، قطعه یا سیستم طراحی، ملاحظات دیگری نیز باید در نظر گرفته شوند، مانند:
- عملکرد
- امنیت
- بهینهسازی موتور جستجو
- پشتیبانی از ترجمه زبان
- ادغامهای شخص ثالث
این عوامل بدون شک در انتخاب الگوی شما نقش خواهند داشت، اما باید افرادی که محتوا و کد را ایجاد میکنند را نیز در نظر بگیرید. الگویی که انتخاب میکنید باید به اندازه کافی قوی باشد تا بتواند هرگونه محدودیت احتمالی پیرامون محتوای تولید شده توسط ویرایشگر یا کاربر را مدیریت کند، به علاوه به گونهای ساخته شود که توسعهدهندگان با هر دانش دسترسیپذیری بتوانند از آن استفاده کنند.