طراحی سایت برای دسترس پذیری بیشتر

طراحی سایت به سبک جدید

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

چرا سایت برای دسترس پذیری طراحی می شود؟

عنوان طراح سایت، قدرت و مسئولیت این را دارید که مطمئن شوید هرکسی فارغ از توانایی، زمینه یا موقعیت به آنچه که ایجاد می کنید دسترسی دارد. نکته قابل توجه در مورد در دسترس قرار دادن سایت این است که تجربه بهتری را برای همه به ارمغان می آورد. در سراسر جهان بیش از 1 میلیارد نفر دارای معلولیت هستند. در سال 2017، 814 دادخواست دسترسی به وب سایت در دادگاه های فدرال و ایالت تشکیل شده است. این دو نکته به تنهایی باید ما را در اهمیت طراحی برای دسترس پذیری متقاعد کند. یک مورد تجاری قوی نیز برای دسترسی وجود دارد: مطالعات نشان می دهد که وب سایت های قابل دسترس پذیری نتایج جستجوی بهتری دارند، آنها به مخاطبان بیشتری دسترسی پیدا می کنند، از نظر SEO مناسب هستند، زمان بارگیری سریع تری دارند، و همیشه قابلیت استفاده بهتری دارند. اجرای این دستورالعمل ها نسبتاً آسان است و می تواند به محصولات شما کمک کند تا به سطح AA از نیازهای دسترس پذیری به محتوای وب (WCAG 2.0) نزدیک شوند و روی رایج ترین فن آوری های ابزار کمکی - از جمله صفحه خوان ها، بزرگنمایی صفحه و تشخیص گفتار کار کند. 
 

کنتراست رنگ را به اندازه کافی اضافه کنید

   

برای قابل فهم کردن اطلاعات مهم از رنگ به تنهایی استفاده نکنی

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

در طراحی خود از الگوهای متمرکز استفاده کنید

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

یک مقاله مفید و جذاب بخوانید: پیش بینی قیمت مانا 2022

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

از برچسب ها با زمینه برای ورودی های فرم استفاده کنید

استفاده از متن در داخل عنوان برچسب یکی از بزرگترین اشتباهات هنگام طراحی فرم است. ممکن است وسوسه شویم که وقتی می خواهیم طراحی ما را ساده و مدرن کنیم، این روند را دنبال کنیم. قرار دادن متن در داخل قالب معمولاً خاکستری است و کنتراست کمی دارد، بنابراین خواندن آن دشوار است. 

شاید این مقاله برای شما مفید باشد: ارز کیشو و آینده آن

افرادی که از صفحه خوان استفاده می کنند معمولاً با استفاده از کلید Tab در یک فرم حرکت می کنند تا از طریق کنترل های فرم پرش کنند. عناصر <label> برای هر کنترل فرم خوانده می شوند. هر متن بدون برچسب، به عنوان یک قالب نمایش داده می شود و صفحه خوان بدون خواندن، از آن رد می شود. همیشه به افراد کمک کنید تا بفهمند چه کاری باید انجام دهند و در بالای فرم بنویسند. بهتر است  برچسب ها بعد از پر شدن فرم از بین نرود. مردم هرگز نباید متن را با آنچه می نویسند از دست بدهند. وقتی طراحان توصیف ها یا دستورالعمل ها را در فرم های خود پنهان می کنند، آنها به دلیل سادگی، قابلیت دسترس پذیری را فدا می کنند. این عمل به این معنی نیست که شما باید طراحی خود را با اطلاعات غیرضروری بهم بریزید، فقط مطمئن شوید که نشانه های اساسی را ارائه می دهید. نوشتار بیش از حد دستورالعمل می تواند به همان اندازه مشکل ساز باشد. هدف این است که تأیید کنیم فرد اطلاعات کافی برای انجام وظایف خود را در اختیار دارد.

متن جایگزین مفیدی برای تصاویر 

افراد کم بینا اغلب از خوانندگان صفحه برای "شنیدن" وب سایت استفاده می کنند. این ابزارها متن را به گفتار تبدیل می کنند تا فرد بتواند کلمات موجود در یک سایت را بشنود.
به دو روش می توانید متن جایگزین ارائه دهید:

• در ویژگی <alt> عنصر تصویر.
• درون متن یا محیط خود تصویر.

سعی کنید آنچه را که در تصویر اتفاق می افتد و چگونگی اهمیت آن برای داستان را توصیف کنید، نه اینکه فقط جمله ای مانند "عکس" بگویید.
اگر تصویر کاملاً تزئینی است یا باعث ایجاد افزونگی می شود. سپس افزودن ویژگی <alt> خالی باعث می شود خوانندگان صفحه از آن چشم پوشی کنند. اگر متن جایگزین ننویسید، برخی از خوانندگان صفحه نام فایل عکس را برای فرد می خوانند. این بدترین تجربه ای است که می توانید ارائه دهید. گوگل در حال کار بر روی AI است که می تواند عکس ها را با دقت 94٪ توصیف کند. این مدل منبع باز است و هنوز در دست تحقیق است - امیدوارم که ما شاهد استفاده از آن در محصولات مختلف باشیم. 
 

در محتوای خود از علامت گذاری صحیح استفاده کنید

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

این مقاله را از دست ندهید: بهترین ارزهای دیجیتال متاورس

این درخت همان چیزی است که خوانندگان صفحه را قادر می سازد و افراد نابینا از آنها استفاده می کنند تا بتوانند به یک صفحه گوش دهند. عدم استفاده صحیح از علامت گذاری بر قابلیت دسترس پذیری تأثیر می گذارد. از برچسب های HTML فقط برای جلوه سبک استفاده نکنید. خوانندگان صفحه به صورت سلسله مراتبی از صفحات وب با عنوان (سرصفحه های واقعی، نه فقط متن هایی که از نوع بزرگ و پررنگ هستند) پیمایش می کنند. افرادی که از سایت شما استفاده می کنند می توانند لیستی از همه عناوین را بشنوند، مطالب را براساس انواع عناوین پرش کنند یا مستقیماً به عناوین سطح بالا <h1> بروند.

پشتیبانی از پیمایش صفحه کلید

قابلیت استفاده ازصفحه کلید یکی از مهمترین جنبه های دسترس پذیری به وب سایت است. افراد دارای معلولیت حرکتی، افراد نابینا که به خواننده های صفحه نمایش اعتماد می کنند، افرادی که کنترل دقیق عضلانی ندارند و حتی کاربران حرفه ای نیز برای پیمایش مطالب به صفحه کلید وابسته هستند. اگر معمولاً از کلید Tab در صفحه کلید خود برای پیمایش در میان عناصر تعاملی در یک صفحه وب استفاده می کنید: پیوندها، دکمه ها یا قسمت های ورودی. حالت متمرکز که قبلاً بحث کردیم، یک شاخص تصویری از موئلفه که در حال حاضر انتخاب شده است، فراهم می کند. هنگام مرور در یک صفحه، ترتیب عناصر تعاملی ضروری است و پیمایش باید منطقی و شهودی باشد. ترتیب برگه باید جریان بصری صفحه را دنبال کند: چپ به راست، بالا به پایین - هدر، ناوبری اصلی، دکمه ها و ورودی های محتوا، و در آخر پاورقی. یک روش خوب این است که سایت خود را فقط با استفاده از صفحه کلید آزمایش کنید. برای جابجایی در پیوندها و فرم ها از کلید Tab استفاده کنید. برای انتخاب یک عنصر با استفاده از کلید Enter تست کنید. تأیید کنید که همه اجزای تعاملی قابل پیش بینی و به ترتیب هستند.

نتیجه گیری

طراحی سایت صرافی ارز دیجیتال

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