مقالات طراحی سایت

آموزش موارد مربوط به طراحی و ساخت وب سایت

طراحی برای دردسترس بودن صفحات وب بدین معنی است که طراح سایت باید این احتمال را در نظر بگیرد که خیلی از کاربران ممکن است محتوای سایت را بصورتی کاملا متفاوت نسبت به شما میبینند.

1. معرفی

برای کسانی که نسبت به موضوع دردسترس بودن مربوط به طراحی صفحات وب نا آشنا هستند باید بگوییم که تصور کنید که خیلی از کاربران محتوا را بصورتی کاملا متفاوت نسبت به شما میبینند.

  • ممکن است نتوانند ببینند، بشنوند، حرکت کنند، یا حتی نمیتوانند برخی یا کل اطلاعات را به راحتی پردازش کنند.
  • شاید مشکل در خواندن یا درک متن دارند.
  • شاید کیبورد یا موس ندارند یا نمیتوانند استفاده کنند.
  • شاید صفحه نمایش آنها تنها متن را نشان میدهد، یا صفحه نمایش کوچک دارند، یا اینترنت سرعت پایین دارند.
  • شاید نمیتوانند زبانی را که سند به آن زبان نوشته شده را صحبت و یا درک کند.
  • شاید در شرایطی است که چشمان، گوش ها، یا دستهایش مشغول است (مثلا در حال رانندگی است، یا در محیط پر سر و صدا کار میکند).
  • شاید مرورگر نسخه پایین دارد، یا مرورگر کاملا متفاوت دارد، مرورگر صدا دارد و یا سیستم عامل متفاوت دارد.

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

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

چگونه معادل متنی باعث میشود که تصویر در دسترس قرار گیرد؟ هر دو واژه برای کلمات "معادل متنی" مهم است:

  • محتوای متن میتواند برای کاربر بصورت کلام ترکیبی، خط بریل و متن نمایش داده شده نمایش داده شود. هر سه مکانیسم برای حواس کاملا متفاوت استفاده میشوند – شنوایی برای کلام ترکیب شده، لامسه برای خط بریل، و بینایی برای متن بصری – و باعث میشود اطلاعات برای گروهی از افراد با حواس و ناتوانی های مختلف در دسترس قرار گیرد.
  • متن برای اینکه مفید باشد باید عملکرد یا هدفی را که تصویر بدنبال آن است را منتقل کند. برای مثال، معادل متنی برای تصویر زمین در فضا را در نظر بگیرید. اگر هدف تصویر نمایش کره زمین باشد، معادل متنی "تصویر کره زمین در فضا" کفایت میکند. اگر هدف تصویر نمایش اطلاعات خاص درباره جغرافیای جهان باشد، معادل متنی آن اطلاعات را منتقل کند. اگر عکس برای این طراحی شده است که به کاربر بگوید برای اطلاعات بیشتر بر روی تصویر کلیک کنید، معادل متنی باید "اطلاعات درباره زمین" باشد. بنابراین اگر متن عملکرد یا هدف یکسانی هم برای کاربران ناتوان و هم دیگر داشته باشد، در معادل متنی میتوان آنرا لحاظ کرد.

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

درحالی که توسعه گرهای محتوای وب باید معادل متنی برای تصاویر و دیگر محتوای مولتی مدیا در نظر بگیرند، وظیفه یوزر ایجنت ها (برای مثال مرورگرها و تکنولوژی های کمکی مانند اسکیرین ریدر، نمایش بریل و غیره) نمایش اطلاعات به کاربر است.

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

2 تم طراحی در دسترس

رهنمودها دو تم عمومی را نشان میدهد: تغییر شکل مطبوع را تضمین بدهد، و محتوا را قابل درک و قابل انتقال باشد.

2.1 اطمینان از تغییر شکل مطبوع

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

  • ساختار مجزا از نمایش (به تمایز بین محتوا، ساختار، و نمایش اشاره دارد).
  • ایجاد کردن متن (شامل معادل متنی). متن میتواند به صورتی رندر شود که تقریبا همه مرورگرها در دسترس باشد و تقریبا برای همه کاربران در دسترس باشد.
  • ایجاد سندی که حتی اگر کاربران آنرا نبینند و یا نشنوند کار کند. فراهم کردن اطلاعاتی که چنین هدفی را دنبال کند یا در مواقعی که لازم باشد بعنوان ویدئو یا آدیو عمل کند. این بدان معنا نیست که یک نسخه صوتی از سایت برای افراد نابینا فراهم کنیم. افراد نابینا میتوانند از اسکرین ریدر استفاده کنند.
  • ایجاد سندی که بر یک نوع سخت افزار متکی نیست. صفحات میتوانند برای افرادی که موس ندارند، رزولوشن پایین دارند، صفحه نمایش سیاه و سفید دارند، صفحه نمایش ندارند، تنها خروجی صوتی یا متنی دارند قابل استفاده باشد.

تم تغییر شکل مطبوع در رهنمودهای 1 تا 11 آورده شده است.

2.2 متن را قابل درک و قابل نویگیت کنیم

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

تم قابل فهم کردن و نویگیت کردن متن در رهنمودهای 12 تا 14 آمده است.

3 چگونه رهنمودها سازمانده ای میشوند.

این سند شامل چهارده رهنمود، یا اصول کلی طراحی در دسترس است. هر رهنمود شامل:

  • شماره رهنمود.
  • بیان رهنمود.
  • منطق پشت رهنمود و برخی گروه هایی که از آن رهنمود منفعت میبرند.
  • لیستی از تعاریف پست بازرسی.

تعاریف پست های بازرسی در هر رهنمود توضیح میدهند که چگونه رهنمودها در سناریو های توسعه محتوا بکار گرفته میشوند. هر تعریف پست بازرسی شامل:

  • شماره پست بازرسی.
  • بیان پست بازرسی.
  • اولیت پست بازرسی. اولویت یک پست بازرسی از طریق استایل شیت مشخص شده است.
  • نکات اختیاری، مثال های طبقه بندی شده، و نشان دادن مرجع به رهنمود یا پست بازرسی بعدی.

تلاش شده تا هر پست بازرسی به قدر کافی موجز باشد تا رضایت کسانی که آنرا میخوانند جلب شود.

توصیه های W3C در 5 می 1999

نوشتن دیدگاه