کاربردپذیری فرم ها در وب – اصول اولیه

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

اثربخشی، بهره وری و رضایتی که کاربران مشخص، برای دستیابی به اهداف مشخص در یک محیط خاص بدست می آورند.

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

گاها  فرم‌‌ها به عنوان آخرین و مهمترین مرحله‌ی دستیابی به هدف بشمار می‌آیند

بر اساس آنچه لوک رابلوسکی در کتاب Web Form Design: Filling in the Blanks بیان میکند، فرم ها میتوانند در سه دسته ی اساس تقسیم بندی شوند.

  • تجاری
  • اجتماعلی
  • ارائه کنندگان خدمات ارزش افزوده

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

تجاری

اجتماعی

خدمات ارزش افزوده

هدف کاربر

کسب اطلاعات / خرید

پیوستن به جامعه (Community)

انجام کار مشخص

اهداف کسب و کار

افزایش فروش

توسعه و رشد تعاملات در community

افزایش محتوا و زمان حضور کاربر در سایت

مثالی از نوع سایت

تجارت الکترونیک (فروشگاه اینترنتی)

شبکه های اجتماعی

بانکداری الکترونیک

نمونه ای از فرم

فرم خرید و پرداخت

فرم ثبت نام

انتقال وجه

موارد استفاده ی فرم ها بر اساس کتاب لوک رابلوسکی

۶ بخش اساسی در یک فرم

بهتر است برای اینکه کمترین سوالات ممکن را در ذهن کاربر ایجاد کنید، فرم کاملی داشته باشید. یک فرم کامل، دارای اجزای زیر است:

لیبل یا عنوان فیلد

کاربر به درک درستی از چیستی و هدف فیلد مربوطه دست می‌یابد.

فیلد ورود اطلاعات

بخشی از فرم که کاربر نسبت به آن بازخوردی را ارئه خواهد کرد. فیلدها میتوانند متن، رمز عبور، چک باکس، دکمه های رادیویی، منو های کشویی و … باشند.

کُنش

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

راهنما

اطلاعات اضافه ای که به کاربر برای پر کردن فرم کمک میکند.

پیام ها

پیام‌ها نتیجه ی اطلاعات ارائه شده و واکنش فرم نسبت به اطلاعات کاربر را نمایش می‌دهند. پیام میتواند مثبت یا منفی باشد. به عنوان نمونه “اطلاعات فرم به درستی ثبت شد (مثبت)” یا “نام کاربری انتخاب شده تکراریست (منفی)”

اعتبارسنجی

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

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

به نظر شما نکات دیگری هم وجود دارد که باید در این مرحله به آنها توجه کنیم؟

تمرکز موضوع: , نوشته شده در: ۱۰ مرداد ۱۳۹۲

درباره محمد رشیدی

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

    -استفاده از نقشه

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

    -عدم استفاده از کلملت و جملات زیادی و گمراه کننده:

    برای مثال در وردپرس چه لزومی داره این قسمت در فرمهاش باشه که:
    شما می‌توانید از این دستورات HTML استفاده کنید:


    خوب اونایی که اینکاره هستن خودشون میدونن . ونایی هم که اینکاره نیستن با دیدن این وقتو و ذهنشون درگیر میشه

    خود ما چند دفعه از این کدها در نظرات استفاده کردیم؟
    ______________________
    شوخی:
    -عدم استفاده از غلط املایی! :) ( همینجا "مرا از دیدگاههای این "نبشته" آگاه کن" )
    :)))

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

پاسخ دهید

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


*

شما می‌توانید از این دستورات HTML استفاده کنید: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>