اصول دسترس‌پذیری در طراحی سایت؛ Accessibility برای افراد دارای معلولیت

اهمیت دسترسی پذیری در طراحی سایت به‌قدری زیاد است که مجموعه‌ای از استاندارد و قوانین بین‌المللی برای اجرای درست آن وضع شده است. دستورالعمل‌های دسترسی محتواهای تحت وب (WCAG)، مرجعی است که به‌صورت کامل استانداردهای جهانی را برای تولید محتوای دیجیتال معرفی می‌کند.

در این مطلب به معرفی اصول دسترسی پذیری در طراحی سایت و Accessibility برای افراد دارای معلولیت می‌پردازیم، همچنین باید و نبایدهای آن را بیان می‌کنیم.

طراحی دسترسی‌پذیری وب سایت (Accessibility design) چیست؟

دسترسی پذیری وب سایت به مجموعه‌ای از اصول طراحی و توسعه سایت گفته می‌شود که مشخص می‌کند یک وب‌ سایت یا دیگر برنامه‌های تحت وب باید برای تمامی کاربران، صرف‌نظر از سطح توانایی به‌راحتی قابل دسترس باشد. مفهوم Accessibility برای آن دسته از کاربران که دچار معلولیت‌های جسمی، حرکتی، بینایی، شنوایی و شناختی هستند از اهمیت زیادی برخوردار است.

یک وب‌ سایت زمانی از دسترسی پذیری مناسبی دارد که افراد با هر سطح توانایی بتوانند تعامل هدفمندی با بخش‌های مختلف سایت برقرار کنند، یعنی یک فرد دارای معلولیت بتواند به بخش‌های مختلف سایت دسترسی داشته باشد و در صورت نیاز اقدام مورد‌نظر (خرید، ثبت سفارش، درخواست مشاوره تلفنی و …) را انجام دهد.

اصول دسترسی پذیری طراحی سایت برای افراد معلول یک ویژگی‌ اضافی نیست، بلکه بخشی از استانداردهای طراحی وب سایت است که نقش مهمی در ارائه یک تجربه کاربری مطلوب ایفا می‌کند.

طراحی سایت برای افراد معلول

طراحی سایت برای افراد دارای معلولیت به وب‌ سایتی اشاره دارد که همه افراد صرف‌نظر از توانایی‌ها یا محدودیت‌های جسمی، حرکتی و شناختی بتوانند به‌راحتی وارد سایت شوند و از بخش‌های مختلف آن بازدید کنند. دسترسی پذیری سایت برای افراد معلول تنها شامل یک قشر خاص نیست، بلکه طیف وسیعی از کاربران را با محدودیت جسمی، حرکتی و شناختی شامل می‌شود.

با توجه به اینکه حدود ۱۵ درصد از جمعیت کشور را افراد دارای معلولیت تشکیل می‌دهند که با استناد به این آمار به‌خوبی مشخص می‌شود که اگر یک وب سایت اصول دسترسی پذیری را به‌خوبی پیاده سازی کند، می‌تواند دسترسی گروه‌های گسترده‌ای را به سایت فراهم کند که به بهبود سئو سایت کمک خواهد کرد.

چه گروه‌هایی از کاربران به وب سایت دسترسی پذیری نیاز دارند؟

دسترسی پذیری دیجیتال به طیف وسیعی از کاربران دچار محدودیت‌ها یا اختلالات کمک می‌کند تا به‌راحتی با وب سایت تعامل برقرار کنند. این کاربران عبارتند از:

• کاربران با اختلالات شنوایی‌ مانند افراد ناشنوا و کم‌شنوا
• کاربران با اختلالات شناختی و عصبی مانند افرادی که دچار آلزایمر و اوتیسم، نقص توجه/بیش‌فعالی، صرع یا اختلالات کم‌توجهی هستند.
• کاربران دارای ناتوانی‌های موقت مانند افرادی که دچار شکستگی اندام شده‌اند یا کسانی که دوران نقاهت بعد از جراحی را پشت سر می‌گذارند.
• کاربرانی با اختلالات بینایی مانند نابینایی، کم‌بینا و کوررنگی
• سالمندان و افرادی که به دلیل افزایش سن با کاهش توانایی بینایی مواجه‌اند.
• کاربران با محدودیت حرکتی مانند افرادی که دچار آسیب نخاعی، فلج مغزی یا افرادی که با عدم کنترل حرکات دست و انگشتان مواجه هستند.کاربرانی که در یادگیری دچار مشکل هستند مانند افرادی با اختلالات پردازش شنیداری یا دیسلکسیا

نکته: در گذشته این طیف از افراد با مشکلات زیادی در فضای دیجیتال مواجه بودند، اما امروزه به لطف ویژگی دسترسی پذیری دیجیتال، به‌راحتی می‌توانند فعالیت‌های اینترنتی خود را از طریق وب‌ سایت‌ها و پلتفرم‌های آنلاین انجام دهند.

چرا Accessibility تاثیری مستقیم در سئو سایت دارد؟

با توجه به هوشمند شدن الگوریتم‌های گوگل، گوگل فقط به محتوا نگاه نمی‌کند و به‌صورت دقیق رفتار کاربران و نحوه تعامل آنها را با سایت در نظر می‌گیرد. مثلا نرخ پرش کاربران از سایت (Bounce Rate) چقدر است، زمان حضور کاربران در یک وب سایت (Dwell Time) چقدر است، آیا سایت ساختار قابل فهمی برای کاربران دارد و آنها به‌راحتی می‌توانند به بخش‌های مختلف دسترسی داشته باشند.

زمانی که یک وب‌ سایت از استانداردهای Accessibility که شامل ناوبری استاندارد، ساختار صحیح هدینگ، استفاده از متن جایگزین، خوانایی محتوا و دیگر موارد است پیروی کند، گوگل صفحات سایت را بهتری بررسی می‌کند و احتمال کسب رتبه برای کلیدواژه‌های هدف افزایش می‌یابد.
پس نتیجه می‌گیریم که اجرای اصول دسترسی پذیری در طراحی سایت، در بهینه سازی سایت نقش مثبتی ایفا می‌کند.

طراحی سایت دسترسی پذیری چه تاثیری روی نرخ تبدیل دارد؟

سایتی که دسترسی‌ پذیری خوبی دارد، نه‌تنها بهتر دیده می‌شود، بلکه نرخ تبدیل بالاتری نیز دارد. طراحی سایت Accessible کمک می‌کند تا کاربران محتوا را به‌راحتی بخوانند، بدون مشکل بتوانند در فراخوان اقدام CTA (ثبت‌نام، خرید، پر کردن فرم) شرکت کنند و همچنین یک مسیر مشخص در سایت داشته باشند. وب‌ سایتی که از این ویژگی‌ها برخوردار است، احتمال تبدیل بازدیدکننده به سرنخ یا مشتری را افزایش می‌دهد.
دسترسی پذیری ساده و قابل فهم برای کسب‌وکارهایی که بر فروش آنلاین محصولات تمرکز دارند، اهمیت ویژه‌ای دارد.

معرفی ۴ اصل دسترسی پذیری وب

دستورالعمل‌های دسترسی پذیری محتوای دیجیتال که کنسرسیوم جهانی وب (W3C) معرفی کرده بر چهار اصل اساسی استوار است که مشخص می‌کند یک وب‌ سایت یا پلتفرم دیجیتال برای ارائه یک تجربه کاربری مطلوب و دسترسی پذیری ساده، باید به این اصول پایبند باشد:

• قابل استفاده (Operable): این اصل به این موضوع اشاره دارد که یک سایت یا پلتفرم تحت وب باید با فناوری‌های کمکی و روش‌های ورودی‌ جایگزین، مانند صفحه کلید و نرم‌افزارهای تبدیل گفتار به متن، سازگار باشد.
• پایداری (Robust): محتوای دیجیتال باید با انواع دستگاه‌های دیجیتال هوشمند مانند موبایل، دسکتاپ، تبلت و همچنین با فناوری‌های کمکی سازگار باشد و بتواند در آینده عملکرد خود را به‌خوبی حفظ کند.
• قابل ادراک (Perceivable): محتواهای تحت وب باید طوری طراحی شوند که تمامی کاربران بتوانند هر سطح توانایی جسمی، حرکتی، بینایی، شنوایی و شناختی، اطلاعات مورد نیاز خود را دریافت کنند.
• قابل درک (Understandable): محتوای صفحات باید به‌راحتی توسط کاربران درک شود وآنها بتوانند تعامل هدفمندی با پلتفرم برقرار کنند.

دستورالعمل‌های پیاده سازی دسترسی‌ پذیری در وب سایت

کنسرسیوم جهانی وب که با نام (W۳C) نیز شناخته می‌شود، مجموعه‌ای از دستورالعمل‌ها را تدوین کرده که در این بخش به بررسی خلاصه‌ای از آنها می‌پردازیم:

بهینه سازی تجربه کاربری

یک وب‌ سایت برای استفاده تمامی کاربران و افراد دچار معلولیت، باید رابط و تجربه کاربری استانداردی داشته باشد. ارائه توضیحات متنی برای تصاویر (Alt)، استفاده از فناوری‌های کمکی، حذف محتوای چشمک‌زن، سازگاری با صفحه خوان‌ها، تست دسترسی پذیری با ابزار مخصوص و پرچسب‌‌گذاری مناسب برای عناصر صفحه از مواردی هستند که در بهبود رابط کاربری و تجربه کاربری ضروری هستند.
از جمله مواردی که تاثیر منفی بر تجربه کاربری (UX) دارند، می‌توان به محتوای گیج کننده و نامرتبط، پنجره‌های بازشو مزاحم (پاپ‌آپ‌ها) و تبلیغات ناخواسته اشاره کرد.

طراحی استاندارد صفحه اصلی سایت

صفحه اصلی معمولا اولین نقطه تعامل کاربران با وب سایت است. طراحی صفحه اصلی سایت باید ساده، جذاب و هدفمند باشد تا بتواند هویت برند را نمایش دهد. در صفحه اصلی یک وب‌ سایت باید اطلاعات مهم مجموعه مانند لینک‌های مهم، پیشنهاد‌های ویژه و شعار کسب‌وکار به‌خوبی نمایش داده شوند. در ضمن صفحه اصلی سایت نباید زیاد شلوغ باشد، مثلا تصاویر زیاد و عناصر گرافیکی شلوغ باعث سردرگمی کاربران می‌شود.

مدیریت لینک‌ها

لینک‌های ایجادشده در صفحات سایت باید واضح و دقیق باشند، مثلا زمانی که کاربر عبارت «لینک سازی داخلی» را دید و روی آن کلیک کرد، محتوای مرتبط با آن به او نمایش داده شود. اگر محتوا با عنوان لینک همخوانی نداشته باشد، کاربر سریع صفحه را ترک می‌کند. همچنین استفاده از انکرتکست‌های توصیفی و دقیق از نکاتی است که تجربه کاربری مطلوبی برای کاربران ایجاد می‌کند. به جای استفاده از لینک‌های مبهم مانند «اینجا کلیک کنید» بهتر است از توضیحات دقیق استفاده شود.

فرآیند طراحی و ارزیابی

برای طراحی و ارزیابی یک وب سایت با حفظ اصول دسترسی پذیری، حذف و اصلاح محتوای غیرضروری اهمیت زیادی دارد. محتواهای اضافی یا ناقص می‌تواند مانع تعامل کاربران با سایت شود و تجربه کاربر نامطلوب ایجاد می‌کند. استفاده از روش‌های تحقیق کاربر و آزمون‌های استفاده پذیری به درک دقیق نیازهای کاربران کمک می‌کند تا بهترین محتوا در سایت قرار گیرد. همکاری با یک تیم طراحی سایت حرفه‌ای، کمک می‌کند تا با اضافه کردن قابلیت‌های ضروری به سایت، تجربه کاربری بهبود یابد.

استفاده از فهرست‌ها در صفحات

استفاده از فهرست مطالب در ابتدای صفحات، اطلاعات را به‌طور خلاصه و دقیق در اختیار کاربر قرار می‌دهد و او می‌داند که قرار است در این صفحه چه اطلاعاتی در اختیار او قرار گیرد. برای تاثیرگذاری بیشتر، پیشنهاد می‌کنیم که مهم‌ترین عناوین در ابتدای صفحه قرار گیرند، استفاده از فهرست‌های بولت‌دار کمک می‌کند تا محتوا خواناتر نمایش داده شود.

استفاده از عنوان‌ و برچسب

عناوین و برچسب مورد استفاده در محتوای سایت باید توصیفی و معنادار باشند تا کاربران درک درستی از محتوای صفحه داشته باشند. مثلا اگر قرار است راجع به قیمت محصولات توضیحاتی داده شود، عنوان بخش باید درباره قیمت و مرتبط باشد. همچنین استفاده از سلسله مراتب هدینگ‌ها «h1, h2, h3, h4 و …» باعث می‌شود تا ساختاربندی و اولویت‌بندی اطلاعات به خوانایی صفحه کمک می‌کند.

نوشتن متن جایگزین (Alt)

نوشتن متن جایگزین به معنای توصیف دقیق محتوای تصویر به‌صورت یک نوشته است. نوشتن متن جایگزین برای تصاویر کمک می‌کند تا کاربرانی که از صفحه خوان استفاده می‌کنند، بتواند به‌راحتی محتوای تصویر را درک کنند.

گرافیک تصاویر و محتوای چندرسانه‌ای

تصاویر و محتوای چندرسانه‌ای استفاده شده در سایت باید از کیفیت مناسبی برخوردار باشند. همچنین حجم این محتواها باید بهینه باشد تا سرعت بارگذاری صفحه کند نشود. استفاده بیش از حد از انیمیشن‌های چشمک زن توصیه نمی‌شود؛ زیرا تجربه کاربری را خراب می‌کند.

تضاد رنگی مناسب

انتخاب رنگ پس زمینه و عناصر یک سایت، می‌تواند تجربه کاربری را بهبود ببخشد و اطمینان حاصل کند که افراد با نیازهای خاص (کم‌بینا) به‌راحتی می‌توانند متن صفحه را مطالعه کنند. اصول دسترسی پذیری طراحی سایت برای افراد معلول به این موضوع اشاره دارد که از رنگ‌هایی که تضاد ضعیفی دارند یا خیلی مشابه هستند، استفاده نشود. مثلا استفاده از ترکیبی با کنتراست تاکافی، مانند برخی از طیف‌های رنگی نزدیک به یکدیگر می‌تواند برای برخی کاربران مشکل‌ساز شود، به ویژه افراد که دچار اختلالات بینایی هستند.

سازگاری با سخت‌افزارها و نرم‌افزارها

از دیگر دستورالعمل‌های پیاده سازی دسترسی‌ پذیری در وب سایت، سازگار بودن وب سایت با مرورگرهای مختلف (کروم، فایرفاکس، سافاری و اج) و سیستم‌عامل‌های پرکاربرد (ویندوز، مک، لینوکس) است. طراحی نیز باید متناسب با رزولوشن‌های استاندارد (۷۶۸×۱۰۲۴ پیکسل) باشد تا کاربران به‌راحتی‌ بتوانند با نمایشگر‌های مختلف وب سایت را مشاهده کنند.

ظاهر و خوانایی متن

از دیگر موضوعات مهم در دسترسی پذیری وب سایت، استفاده از فونت مناسب در متن است. اندازه مناسب فونت متن با توجه به محیط، مقیاس و نیاز کاربر مشخص شود و کنتراست کافی بین متن و پس‌زمینه، به بهبود خوانایی محتوا کمک می‌کند. استفاده از قالب‌بندی استاندارد برای نمایش اطلاعاتی مانند تاریخ و شماره تلفن، باعث می‌شود تا کاربران درک بهتری از موضوع داشته باشند.

درج زیرنویس‌های بسته (Closed Caption)

زیرنویس‌های بسته یا همان Closed Caption قابلیت روشن و خاموش شدن دارند و به عنوان یک لایه مجزای ویدیو ذخیره می‌شوند. نمایش زیرنویس ویدیو به افراد ناشنوا یا کم‌شنوا کمک می‌کند تا به‌خوبی محتوای ویدیو را بفهمند. همچنین کاربرانی که در محیط‌های پرسروصدا هستند و یا افرادی که دوست دارند بدون صدا محتوای ویدیویی را تماشا کنند، با فعال کردن قابلیت زیرنویس ویدیو نیازشان برآورده می‌شود. معمولاً زیرنویس ویدیو علاوه بر ویدیو شامل افکت‌های صوتی، اطلاعات گوینده و موسیقی است که باعث بهبود تجربه کاربری می‌شود.

اشتباهات رایج در طراحی سایت Accessible محور

ارائه یک تجربه کاربری مطلوب از مهم‌ترین ویژگی‌های یک وب‌ سایت است، اما بسیاری از سایت‌ها مشکلات دسترسی پذیری دارند که باعث خراب شدن تجربه کاربر می‌شود. در این بخش به معرفی اشکالاتی می‌پردازیم که تاثیر منفی بر تجربه کاربری یک وب‌ سایت می‌گذارند:

• نبود ساختار سلسله مراتبی هدینگ استاندارد
• استفاده از منوهایی که امکان پیمایش با کیبورد را فراهم نمی‌کنند.
• استفاده از تصاویری بدون متن جایگزین
• استفاده بیش از حد از انیمیشن‌های سنگین
• استفاده از متن‌های کم کنتراست
• استفاده از رنگ‌های نامناسب در پس‌زمینه که هماهنگی با عناصر سایت ندارد.

اهمیت محتوا در دسترسی پذیری سایت

اگر محتوای سایت از اصول دسترسی پذیری پیروی کند، کاربران سریع متوجه موضوع محتوا می‌شوند و تجربه کاربری را بهبود می‌دهد. استفاده درست از تگ‌های عنوان، لینک سازی هدفمند، استفاده از محتوای چندرسانه‌ای، ایجاد فهرست‌ها و جداول محتوا کمک می‌کند تا یک محتوای غنی و بهینه شود. تگ‌های هدینگ ساختار صفحه را مشخص و به کاربران و موتورهای جستجو کمک می‌کند تا ساختار محتوا را به‌راحتی متوجه شوند.

با برچسب‌‌گذاری محتوا و فایل‌های چندرسانه‌ای، محتوا برای کاربران نیازمند فناوری کمکی و معلولان قابل دسترس است.

استفاده از متن‌های توصیفی و دقیق برای تصاویر کمک می‌کند تا کاربران هر سطح از توانایی بتوانند موضوع تصویر را درک کنند و موتورهای جستجو به‌راحتی تصویر را شناسایی کنند.
انجام این اصول باعث می‌شود تا محتوای دسترسی پذیر بهینه‌ای تولید شود که هم نیازهای کاربران را با هر سطح توانایی برطرف می‌کند و هم برای موتورهای جستجو قابل درک است.

دسترسی پذیری وب در وردپرس

با توجه به قابلیت‌های پیشرفته‌ای که سیستم مدیریت محتوای وردپرس در اختیار کاربران قرار داده، طراحی دسترسی پذیری در سایت‌های وردپرسی نیز امکان‌پذیر است. قالب‌های پیش‌فرض وردپرس مانند Twenty Seventeen به طراحان و توسعه‌دهندگان وردپرس امکان پیاده سازی قابلیت‌های دسترسی پذیری را می‌دهند. اما برای اینکه دسترسی پذیری وب در وردپرس به‌صورت اصولی اجرا شود، نیاز به افزونه‌های مناسب داریم.

اگر به دنبال افزونه‌هایی برای اضافه‌کردن ویژگی صوتی در صفحات سایت هستید، با کمک افزونه‌های Text-To-Speech PHP/JS Script Converter امکان تبدیل متن به گفتار وجود دارد. همچنین برای طراحی با Divi، با استفاده از افزونه Divi Accessibility می‌توانید ویژگی‌های دسترسی پذیری را به قالب سایت وردپرسی اضافه کنید.

افزونه‌ WCAG 2.0 form fields for Gravity Forms به شما کمک می‌کند تا فرم‌های کاربرپسند و دسترسی‌ پذیر طراحی کنید. همچنین افزونه‌های wA11y – The Web Accessibility Toolbox یک ابزار کمکی برای بررسی مشکلات دسترسی پذیری وب سایت در اختیار شما قرار می‌دهد.

با کمک افزونه‌های WP Accessibility و WP Accessibility Helper که در وردپرس وجود دارند، به‌راحتی می‌توانید تنظیمات مربوط به رنگ، فونت و کنتراست را تغییر دهید و مشکلات مربوط به دسترسی پذیری وب سایت را شناسایی و برطرف کنید. از افزونه‌های Accessibility Widget و Accessible Poetry برای تغییر اندازه فونت استفاده می‌شود. برای ایجاد ویژگی‌ دسترسی پذیری در فرم‌های تماس نیز می‌توانید از افزونه Contact Form 7: Accessible Defaults استفاده کنید.

با استفاده از افزونه WP User Stylesheet Switcher می‌توانید لایه‌های متنی را در سایت‌ وردپرسی اضافه کنید تا کاربران بتوانند به‌راحتی بین آنها جابه‌جا شوند.

نکته: با کمک این افزونه‌های کاربردی می‌توانید یک وب‌ سایت وردپرسی دسترسی پذیر و بهینه طراحی و راه‌اندازی کنید.

طراحی وب سایت دسترسی پذیری در سیستم اختصاصی

برای طراحی وب سایت اختصاصی دسترسی پذیر، کدهای HTML به‌صورت دقیق و حرفه‌ای نوشته می‌شوند تا محتوای صفحات به‌درستی نمایش داده شود و برای همه کاربران در دسترس باشد. بعد از اینکه کدهای HTML به‌درستی نوشته شده، با استفاده از CSS ظاهر و ساختار صفحات سایت بهبود می‌یابد تا عناصر به شکل جذاب و مؤثر نمایش داده شوند. سپس با استفاده از زبان JavaScript لایه‌های تعاملی در سایت ایجاد می‌شود تا تجربه کاربری مطلوب و لذت‌بخشی ارائه شود. در آخر برچسب‌گذاری به‌گونه‌ای انجام می‌شود که معنای دقیق و کاربردی داشته باشد و باعث بهبود سئوی سایت شود.
با انجام درست و اصولی این موارد یک وب‌ سایت اختصاصی با دسترسی پذیری مناسب طراحی می‌شود.

سخن پایانی

با معرفی اصول دسترسی پذیری در طراحی سایت برای افراد معلول، یاد گرفتید که یک وب‌ سایت مناسب باید دسترسی‌ پذیری مناسبی فراهم می‌کند تا کاربران هر سطح توانایی بتوانند با سایت ارتباط برقرار کنند.

طراحی سایت برای افراد دارای معلولیت تنها یک موضوع فنی نیست، بلکه روشی مدرن برای ساخت سایتی حرفه‌ای و کارآمد است. وب‌ سایتی که دسترسی‌ پذیری خوبی داشته باشد می‌تواند کاربران بیشتری را جذب کند، نرخ تبدیل را افزایش دهد و تجربه کاربری روان و مطلوب ارائه کند.
اگر قصد سفارش یک وب‌ سایت اصولی و حرفه‌ای را دارید، کارشناسان ما در سایبریشو به‌صورت ۲۴ ساعته پاسخگوی سوالات شما هستند.