6 نکته مهم برای طراحی یک فرم

6 نکته مهم برای طراحی یک فرم
مهران پایریز

مهران پایریز

12 اسفند 1399

13 پسند
زمان مطالعه 5 دقیقه

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

 

UI ، UX

 

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

فهرست مطالب

ابزار را تست کنید!

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

اطلاعات مورد نیاز را به روشنی بیان کنید

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

عناصر مرتبط را گروه بندی کنید

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

فرم خود را با وضوح نشان بدهید

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

برچسب معنی دار وابسته

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

راه اندازی از یک اقدام صریح

دکمه های معمولا عملکردی مانند "ذخیره" و "ارسال" را انجام می دهند و حتی گاهی وقت ها اقدام بعدی را در یک جریان مانند تأیید یا به روزرسانی صفحه ایجاد می کنند.  با این احوال داشتن دکمه های مشابه همیشه بد نیست و در بعضی از مواقع به کاربر کمک می کند تا دسترسی بهتری به امکانات موجود داشته باشد .

منبع مقاله


دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

تجربه کاربری

8 نکته مهم در طراحی UX

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


مهران پایریز

مهران پایریز

27 بهمن 1399

8 دقیقه
تجربه کاربری , رابط کاربری

Sketch چیست؟

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


مهران پایریز

مهران پایریز

28 بهمن 1399

6 دقیقه
رابط کاربری

برنامه فیگما (Figma) چیست؟

برنامه فیگما (Figma) یکی از برنامه های حوضه طراحی رابط کاربری UI است که به طور آنلاین و در مرورگر اجرا می شود . در واقع این برنامه به صورت آنلاین اجرا می شود ...


برنامه فیگما (Figma) چیست؟

مهران پایریز

2 اسفند 1399

5 دقیقه