یلدا ادامه داره... ❤️ ۴۰ درصد تخفیف همه دوره‌ها

استفاده از تخفیف‌ها
ثانیه
دقیقه
ساعت
روز
۶ نکته برای دسترسی‌پذیری در طراحی‌ فرم‌ها
ﺯﻣﺎﻥ ﻣﻄﺎﻟﻌﻪ: 4 دقیقه

۶ نکته برای دسترسی‌پذیری در طراحی‌ فرم‌ها

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

۱. تست کردن

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

۲. شفافیت در برچسب‌ها

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

۳. گروه‌بندی المان‌های مرتبط

المان‌های مربوط یک فرم را در کنار همدیگر قرار دهید. انجام چنین کاری باعث می‌شود که موارد مربوط به همدیگر با داده‌های سازگارتری پر شوند. اگر قرار است از یک سری چک‌باکس استفاده کنید، مطمئن شوید که آن‌ها را در کنار هم قرار می‌دهید.

۴. وضعیت فرم‌ها را به صورت واضح مشخص کنید

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

۵. استفاده از برچسب‌های معنادار

موضوع مهم دیگر این است که برچسب‌های قرار گرفته شده در فرم‌ها را به صورت واضح و معنادار بنویسید. مطمئن شوید که برچسب‌ها کوتاه و البته به اندازه کافی توضیح دهنده و روشن هستند. انجام چنین کاری نه فقط برای کاربران عادی بلکه برای Screen Readerها نیز بسیار مناسب‌تر است.

همچنین مطمئن شوید که labelها را به صورت درست آدرس‌دهی می‌کنید. این موضوع برای اسکرین ریدرها بسیار امری حیاتی و مهم است:

<label for="address">Enter your address:</label><br>
<textarea id="address" name="addresstext"></textarea>

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

۶. دکمه ارسال

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

به عنوان نکته مهم دیگر از برچسب‌های درست برای دکمه‌ها استفاده کنید. اگر قرار است فرم شما محتوایی را ارسال کند استفاده از برچسب Save انتخاب مناسبی نیست چرا که فرم شما عملیات Send را انجام می‌دهد.

در پایان

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

منبع

چه امتیازی برای این مقاله میدهید؟

خیلی بد
بد
متوسط
خوب
عالی
در انتظار ثبت رای

/@arastoo
ارسطو عباسی
کارشناس تولید و بهینه‌سازی محتوا

کارشناس ارشد تولید و بهینه‌سازی محتوا و تکنیکال رایتینگ - https://arastoo.net

دیدگاه و پرسش

برای ارسال دیدگاه لازم است وارد شده یا ثبت‌نام کنید ورود یا ثبت‌نام

در حال دریافت نظرات از سرور، لطفا منتظر بمانید

در حال دریافت نظرات از سرور، لطفا منتظر بمانید