+- تالار گفتمان اسکریپت دات کام (https://forum.xn--mgbguh09aqiwi.com)
+-- انجمن: عمومی (https://forum.xn--mgbguh09aqiwi.com/Forum-%D8%B9%D9%85%D9%88%D9%85%DB%8C)
+--- انجمن: مطالب سرگرمی و جالب (https://forum.xn--mgbguh09aqiwi.com/Forum-%D9%85%D8%B7%D8%A7%D9%84%D8%A8-%D8%B3%D8%B1%DA%AF%D8%B1%D9%85%DB%8C-%D9%88-%D8%AC%D8%A7%D9%84%D8%A8)
+--- موضوع: ۹ نکته بهینه سازی فرم ارسال در وب سایت (/Thread-%DB%B9-%D9%86%DA%A9%D8%AA%D9%87-%D8%A8%D9%87%DB%8C%D9%86%D9%87-%D8%B3%D8%A7%D8%B2%DB%8C-%D9%81%D8%B1%D9%85-%D8%A7%D8%B1%D8%B3%D8%A7%D9%84-%D8%AF%D8%B1-%D9%88%D8%A8-%D8%B3%D8%A7%DB%8C%D8%AA)
۹ نکته بهینه سازی فرم ارسال در وب سایت - mina - 1398/05/01
فرم های وب نقش مهمی در هر روز استفاده از وب دارد. اگر وب سایت ها را ساختید و یا اجرا کنید، شانس این است که شما یک فرم وب را در آن داشته باشید، چه این یک فرم تماس ساده یا یک برنامه وب غنی و قوی است. روش های متعددی برای اطمینان از اینکه فرم های وب شما برای کاربران شما بهینه شده اند وجود دارد. در اینجا چند نکته برای اطمینان از اینکه فرآیند ارسال فرم شما کاربر پسند است. در ادامه شما را با ۹ نکته بهینه سازی فرم ارسال در وب آشنا می سازیم.
با ما همراه باشید.
نکته بهینه سازی فرم ارسال در وب
۱- زمینه مورد نیاز را به وضوح برجسته کنید
به عنوان یک کاربر فقط یک فرم وب را تحریک می کند تا بعدا متوجه شود که فیلدهای ورودی مورد نیاز را از دست داده اید.
یک قرارداد مشترک برای برجسته کردن زمینه های مورد نیاز، داشتن ستون (*) در کنار برچسب آنها است. به صراحت بیان می کند که فیلد ورودی مورد نیاز است یا فیلد اختیاری است، راه امن برای رفتن است.
![[تصویر: 1-9.jpg]](https://inten.asia/wp-content/uploads/2019/07/1-9.jpg)
۲- ارائه قابلیت کاربر پسند(user friendly) و پیام های خطای توصیفی
من مطمئن هستم که شما از آن متنفرید وقتی اشتباهی در فرم وب دارید و تمام خطا میگوید “شما باید تمام فیلدهای مورد نیاز را در زیر پر کنید”، زمانی که آنها یک پیام خطا خاص تر مانند “شما را فراموش کرده اید آدرس ایمیل خود را وارد کنید. ”
انجام اعتبار سنجی داده در زمان واقعی به عنوان کاربر پر کردن فرم وب راه حل خوبی برای پیام های خطای مبهم است. به عنوان مثال، بلافاصله پس از پر کردن فیلد ورودی ایمیل، فرم وب باید بررسی کند که آیا در قالب صحیح است یا نه، بلافاصله به کاربر اطلاع داده می شود.
![[تصویر: 2-8.jpg]](https://inten.asia/wp-content/uploads/2019/07/2-8.jpg)
۳- استفاده از Validation فرمت داده ی Client-Side (جاوا اسکریپت)
با استفاده از اعتبار سنجی داده های جاوا اسکریپت، زمان کاربر را ذخیره می کند، و همچنین میزان کار را که وب سرور شما باید پردازش های ارسالی وب را انجام دهد، کاهش می دهد. اعتبارسنجی خطای مشتری به شما این امکان را می دهد که به کاربران اطلاع دهید که اشتباه را درست انجام داده اند، و نه پس از ارسال فرم. این برای هر زمینه ورودی مناسب است که نیازی به بررسی پایگاه داده شما نیست. چیزهایی مانند اطمینان از اینکه آدرس ایمیل ارائه شده در فرمت صحیح است یا اینکه یک شماره تلفن تنها شامل اعداد است.
![[تصویر: 3-10.jpg]](https://inten.asia/wp-content/uploads/2019/07/3-10.jpg)
۴- استایل زمینه ای برای کاربران که بدانند در کجا هستند
اطمینان حاصل کنید که به شکل بصری زمینه های ورودی را به طوری که کاملا مشخص است که کدام زمینه کاربر فعال است. شما می توانید این کار را با استفاده از CSS انتخاب کنید:
زمینه ورودی یک رنگ مرزی دیگر را حداقل می کند – به طور پیش فرض، مرورگرهای وب این کار را برای شما انجام می دهند، اما اطمینان حاصل کنید که رنگ پیش فرض بر خلاف طراحی وب سایت شما متمایز است.
![[تصویر: 4-7.jpg]](https://inten.asia/wp-content/uploads/2019/07/4-7.jpg)
۵- پیشرفت را به روشنی نشان دهید
اگر فرم وب شما بزرگ است و در صفحات چندگانه (یا دارای چندین مرحله است)، اطمینان حاصل کنید که شما کاربر را با بازخورد ثابت در مورد پیشرفت خود ارائه می دهید تا به آنها اطلاع دهید که چه مقدار زمان لازم برای تکمیل فرایند ارسال فرم وب ،این موارد در مواردی مانند فرم نظرسنجی آنلاین با بسیاری از سوالات و یا فرایند پرداخت آنلاین فروشگاه رایج است.البته، جایگزین بهتر این است که فرم وب خود را کوتاه کنید – اما محدود کردن این گزینه حداقل به کاربر وب فرم نشان می دهد که در آن فرآیند تکمیل هستند.
![[تصویر: 5-6.jpg]](https://inten.asia/wp-content/uploads/2019/07/5-6.jpg)
۶- ذخیره اطلاعات فرم به صورت دوره ای
فرم هایی که از چندین صفحه یا مراحل عبور می کنند مستعد خطاهای کاربر هستند. برای جلوگیری از از دست رفتن اطلاعات، قطعا می خواهید یک راه برای ذخیره ورودی های کاربران خود را در هر جلسه یا متغیر کوکی داشته باشید. این باعث می شود که وب سایت بیشتر متضاد با خطا باشد و شانس های شما را بهبود می بخشد که فرم حتی پس از حوادث مانند کاربر که از صفحه وب دور می شود، تکمیل خواهد شد. با پر کردن فرم وب دوباره می توانید کاربران را از تکمیل آن رد نکنید.
۷- متن پیش فرض “ارسال”
به جای اینکه دکمه ارسال فرم وب خود را بنویسید «ارسال»، آن را به کاربر یادآوری کند که چه کاری انجام می دهد، مانند «ثبت نام در حال حاضر» یا حتی بهتر، اجازه دهید کاربر مزایای پر کردن این فرم را بداند.
![[تصویر: 7-1.jpg]](https://inten.asia/wp-content/uploads/2019/07/7-1.jpg)
۸- نمایش کاربران با فرمت ورودی
اگر از کاربران خود برای یک فرمت ورودی خاص مانند یک شماره تلفن یا شماره کارت اعتباری خواسته اید، بگذارید آنها را بدانند که چه انتظاری دارند. اگر یک رمز عبور باید یک تعداد مشخصی از کاراکترها داشته باشد، یا اگر شامل ترکیبی از کاراکترهای خاص باشد، این الزامات را به روشنی توصیف کنید. این ابهام را کاهش می دهد و فرم را سریعتر پر می کند.
![[تصویر: 9-1.jpg]](https://inten.asia/wp-content/uploads/2019/07/9-1.jpg)
۹- فرمهای عمودی ستونی بهتر هستند
بر اساس یک مطالعه ردیابی چشم توسط cxpartners، یک سازمان طراحی تجربه کاربر، اسکن کردن فرم را بهتر از اسکن از چپ به راست ترجیح می دهد. این تعداد حرکات چشم را که برای ساختن فرم نیاز دارید را کاهش می دهد.
![[تصویر: 10-1.jpg]](https://inten.asia/wp-content/uploads/2019/07/10-1.jpg)
ابزار و منابع فرم در وب
در اینجا چند ابزار و منابع برای کار با فرم های وب وجود دارد.
Wufoo
این برنامه وب به شما اجازه می دهد فرم های خود را تولید کنید و به شما کد لازم را برای جلب فرم در صفحات وب خود می دهد. آنها تجزیه و تحلیل و حتی پرداخت را برای شما اداره می کنند!
![[تصویر: 11.jpg]](https://inten.asia/wp-content/uploads/2019/07/11.jpg)
contactable
پلاگین جی کوئری که به شما امکان می دهد به راحتی فرم های تماس و فرم های بازخورد در هر نقطه از سایت خود ایجاد کنید. این بسیار آسان است برای استفاده و فراهم می کند یک نتیجه عالی است.
تغییر سبک های ورودی فرم در تمرکز با jQuery
این یک آموزش است که به شما نشان می دهد چگونه می توانید از jQuery استفاده کنید تا کاربران خود را از کجا در فرم در حال حاضر ببینند.
نکات فرم با CSS و جاوا اسکریپت
یک آموزش که به شما یاد می دهد چگونه برای نشان دادن نکات فرم، زمانی که کاربران بر روی یک فیلد کلیک کنند. این یک روش عالی برای نشان دادن فرمت های خاص کاربران برای شماره های تلفن و سایر زمینه ها است.
LiveValidation
راه آسان برای اعتبار سنجی میدان زندگی به عنوان نوع کاربر با جاوا اسکریپت. شما می توانید آن را به تقریبا هر کاری که می خواهید انجام دهید پیکربندی کنید.
در بالا ۹ نکته بهینه سازی فرم ارسال در وب را بیان کردیم تا شما را در مسائل مربوط به سئو یاری کنیم.
شرکتلینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید اینتن با تیم حرفه ایی خود توانسته یکی از بهترین شرکت های طراحی سایت در تهران را به خود اختصاص دهد.این شرکت با بیش از ۸ سال سابقه در زمینه ی طراحی سایت های اینترنتی و سئو لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید در حال فعالیت است و بیش از ۴۰۰ سایت معتبر را طراحی و به نام خود اختصاص داده است.برای کسب اطلاعات بیشتر با کارشناسان ما در قسمت لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید در ارتباط باشید تا در حیطه ی کاری خود اطلاعات بیشتری کسب نمایید.