یکی از بخش هایی که در طراحی سایت وجود دارد ولی توجه چندانی به آن نمی‌شود بخش فرمها در طراحی سایت است. از این فرم ها معمولا برای جمع آوری اطلاعات از کاربر به منظور ثبت نام در سایت یا بخش تماس با ما استفاده میشود. استفاده فراوان از فرمها در طراحی سایت فروشگاه اینترنتی میشود. چون کاربران در مراحل خرید باید فرم‌های مختلفی را پر کنند. در طراحی سایت حرفه ای باید قواعد خاصی برای ایجاد فرم‌های مختلف در طراحی سایت رعایت شود. در این مقاله تعدادی از مهم‌ترین اصول طراحی فرم ها توضیح داده میشود.
دقت کنید که طراحی یک فرم خوب می‌تواند باعث ثبت نام کاربر شود. ولی فرمی که اصول در آن رعایت نشده باشد، نمی‌تواند با کاربر تعامل داشته و نرخ تبدیل Conversion Rate بسیار پایینی خواهد داشت. نرخ تبدیل یک فرم به درصدی از کاربران گفته میشود که به آن فرم رسیده و آن را با موفقت تکمیل می‌کنند.برای مثال شما در صفحه اصلی سایت خود یک فرم ثبت نام در خبرنامه دارید. از ۱۰۰ نفر بازدید کننده سایت شما فقط ۱۰ نفر آن فرم را تکمیل می‌کنند. پس در این حالت نرخ تبدیل آن فرم در سایت شما ۱۰% است.
بخش بسیار مهم طراحی فرمها توجه کردن به زیبایی ظاهری است. فرمها باید با فونت خوانا و سایز مناسب طراحی شوند. از آیکون‌های زیبا و رنگ‌هایی که جلب توجه می‌کنند در آن استفاده شده تا بتواند توجه کاربرانی که وارد سایت می‌شوند را جلب کند.
قبلا در مورد اهمیت انتخاب رنگ‌ها در طراحی سایت گفته شد که می‌توانید برای اطلاعات بیشتر آن را مطالعه کنید. هر چه فرمی که طراحی میشود زیباتر و حرفه ای‌تر باشد افراد بیشتری را برای پر کردن ترغیب می‌نماید. یک ظاهر زیبا مانند یک ویترین زیبا افراد را به سمت خود جذب کند.
فرمها در طراحی سایت از چندین فیلد تشکیل شده است. کاربران در هر فیلد باید اطلاعات خاصی را وارد کنند. مانند فیلد نام، آدرس، شماره همراه و……
برای فیلدهایی که ممکن است برای کاربر گیج کننده باشد حتما بخش توضیحات را قرار دهید تا جلوی بروز اشتباه گرفته شود.
این قابلیت را در فرم‌های ثبت نام قرار دهید تا رمز عبور کاربر را بررسی کند و رمزهای کوتاه یا نامناسب را قبول نکند. همچنین دکمه ای وجود داشته باشد که بصورت اتوماتیک رمز عبور بسازد تا کاربران تازه وارد بتوانند با کمک آن یک رمز عبور قوی داشته باشند.
همچنین حتما از فیلد تکرار رمز عبور هم استفاده کنید تا کاربر مطمئن شود رمز عبور را درست وارد کرده و بعد از ثبت نام با مشکل مواجه نشود.
این قابلیت را در فیلد رمز عبور فرمها در قرار دهید تا اگر در هنگام تکمیل فرم دکمه Caps lock روشن بود یا زبان سیستم به غیر از انگلیسی تغییر کرده بود با پیغام مناسب به کاربر هشدار داده شود.
بخش مهمی درطراحی فرمها و خصوصا فرم‌های اینترنتی ایجاد قابلیت اعتبار سنجی فوری است که معمولا با آژاکس ایجاد میشود. حتما با نمونه های آن برخورد کرده اید.
در گذشته وقتی فرم‌های طولانی ثبت نام را پر کرده و دکمه تایید را می‌زدید بعد از چند لحظه مجددا همان فرم پیش روی شما قرار می‌گرفت. بعضی از فیلدها به رنگ قرمز در آمده و با پیام خطا به شما اعلام می‌شد در بعضی فیلدها مقدار اشتباه وارد کرده‌اید. این کار بسیار خسته کننده شده و گاهی نیاز بود چندین بار فرم را پر شود.
اما امروزه وقتی فرم را پر می‌کنید اگر اشتباهی وجود داشته باشد همان لحظه به شما اعلام می‌گردد تا آن را اصلاح کنید. برای مثال اگر در قسمت نام کاربری مقداری وارد کنید که قبلا استفاده شده باشد بلافاصله به شما اعلام میشود این نام کاربری قبلا استفاده شده و شما باید نام دیگری را انتخاب نمایید.
برای نمونه تصویر زیر فیلدهایی که بدون نقص پر شده را با تیک سبز و فیلدهای نادرست با علامت قرمز مشخص کرده تا کاربر بتواند همان لحظه آن را اصلاح کند. نه اینکه بعد از زدن دکمه ارسال مجددا همان فرم برای او نشان داده شده و بخش‌های نادرست نمایش داده شود. به طور کلی استفاده از اعتبار سنجی بلادرنگ Real time Validation در طراحی فرمها می‌تواند نرخ تبدیل آن فرم را بسیار زیاد کرده و موجب رضایت کاربر گردد.
در تمامی فرمها چند فیلد وجود دارد که باید حتما مقداری برای آن وارد شود و نمی‌توان آن را خالی گذاشت. این فیلدها را حتما با علامت خاصی مشخص کنید. معمولا فیلدهای الزامی با * مشخص می‌شوند. فیلدهایی مانند نام کاربری، رمز عبور و ایمیل معمولا به صورت الزامی هستند و کاربر نمی‌تواند آن ها را خالی بگذارد.
تعداد زیادی از کاربران با دستگاه های همراه به سایت ها مراجعه می‌کنند. بنابراین برای تکمیل فرم باید سایت به صورت ریسپانسیو طراحی شوند. یعنی بتواند در هر سایز صفحه نمایش به صورت درست دیده شده تا کاربر به راحتی فرم را تکمیل کند. همچنین در نسخه موبایل باید فیلدها به صورت درشت‌تر و خواناتر طراحی شده تا کاربر نیازی به زوم کردن نداشته باشد.
در دنیای امروز وقت برای همه ارزشمند است و هیچکس دوست ندارد زمانی طولانی برای پر کردن یک فرم ثبت نام یا خرید محصول وقت بگذارد و در عین حال تمام اطلاعات خصوصی خود را در اختیار شما قرار دهد. برای مثال در فرم ثبت نام فقط کافی است نام کاربری، کلمه عبور و ایمیل پرسیده شود.
در فرم سفارش و خرید یک محصول نیازی نیست نام پدر، شماره شناسنامه، نام صمیمی ترین دوست و اطلاعاتی از این دست را از کاربر بپرسید. چون بخشی از حریم خصوصی کاربر است. افراد در دنیای مجازی فقط علاقه دارند که اطلاعات کلی خود را در اختیار سایت ها قرار بدهند.
بسیاری از سایت‌ها در فرم‌های خود از کد امنیتی یا Captcha استفاده می‌کنند. این کدها برای جلوگیری از حملات اتوماتیک توسط نرم افزارهای مخرب به سایت است و موجب میشود فقط انسان های وافعی بتوانند با سایت کار کنند. اما همین کدهای امنیتی باعث بوجود آمدن مشکلاتی مانند خوانا نبودن کدها را به وجود آورده است.
بسیاری از شرکت های معروف از این کدها به صورت هوشمندانه استفاده کرده‌اند. در هنگام ورود به سایت و ناحیه کاربری فقط دو فیلد نام کاربری و کلمه عبور وجود دارد. اگر مقدار آن را اشتباه وارد کنید در مرحله دوم بخش کد امنیتی هم به دو گزینه قبلی اضافه شده تا جلوی خرابکاری‌های احتمالی را بگیرد.
با رعایت کردن این نکات می‌توانید فرم‌هایی را طراحی کرده که بالاترین نرخ تبدیل را داشته باشد و کاربران در کوتاه ترین زمان ممکن آن را تکمیل و ارسال کنند. می‌توانید برای کسب اطلاعات بیشتر و یا مشاوره با همکاران ما تماس بگیرید.
پروژه طراحی وب سایت و مراحل آن
استفاده از تصویر در طراحی سایت
طراحی وب سایت و استانداردهای صفحات فرود
چرا طراحی وب سایت ما شکست می خورد؟
کلمات کلیدی: طراحی سایت فرم سایت
برای طراحی سایت نیاز به کمک دارید؟
سلام خوش آمدید!
برای ارائه خدمات بهتر در زمینه طراحی سایت و سئو مشاوران ما در واتس اپ در خدمت شما هستند.
دیدگاهتان را بنویسید