تاپیک برتر فروردین 94 : شعر به علاوه گرافیک
در این تاپیک طرح های گرافیکی تلفیق شعر و گرافیک قرار گرفته است.
  • مشاهده تاپیک برتر
  • تبلیغات   تبلیغات
    نمایش نتایج: از شماره 1 تا 3 , از مجموع 3

    موضوع: طراحی بهترین فرم برای وب سایت در html

    1. #1

      http://www.graphiran.com/wp-content/uploads/2013/01/1.pnghttp://www.graphiran.com/wp-content/uploads/2013/01/2.pnghttp://www.graphiran.com/wp-content/uploads/2013/01/2.pnghttp://www.graphiran.com/wp-content/uploads/2013/01/2.pnghttp://www.graphiran.com/wp-content/uploads/2013/01/2.png
      کاربر
      تاریخ عضویت
      Jun 2014
      عنوان کاربر
      کاربر
      شماره عضویت
      9794
      نوشته ها
      2
      پسندیده
      0
      مورد پسند : 4 بار در 2 پست

      طراحی بهترین فرم برای وب سایت در html

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

      1. بهتر است فیلدهای کمتری داشته باشید

      هیچ کس پر کردن فرم را دوست ندارد، اما آیا میدانستید هر فیلد میزان اثر بخشی فرم را 17% پایین می آورد. مطالعات بسیاری در این زمینه انجام شده که چند مورد آن در بخش زیر آمده:
      • یک فرم تماس با ما 11 فیلدی با فرم تماس با ما 4 فیلدی جایگزین شد و کاربران 160% از فرم تماس با ما 4 فیلدی بیشتر استقبال نمودند
      • یک فرم 5 فیلدی 34% بیشتر از فرم 9 فیلدی توسط کاربران تکمیل شده
      • در تحقیقی بر روی 40000 وب سایت یک فرم 3 فیلدی 17% بیشتر از یک فرم 4 فیلدی تکمیل شده. این که تعداد فیلدها از انواع مختلف (متن، جعبه متن، لیست، رادیو، چک باکس و ...) تاثیر بسیاری بر روی میزان تکمیل کردن آن خواهد داشت.

      2. فیلدهای اجباری را محدود نمایید

      فقط فیلدهایی که واقعا به آن احتیاج دارید را اجباری نمایید. در یک تحقیق بررسی شده که فیلد فرم تلفن اجباری 275% بر میزان اثر بخشی و تکمیل فرم تاثیر گذاشته. همیشه فیلدهای اجباری را توسط علامت هایی مشخص معین نمایید.3. فرم را به صورت تک ستونی طراحی نمایید

      فرم های تک ستونی سریعتر تکمیل می گردند و برای کاربر حس بهتری خواهد داشت. معمولا فیلدها در ستون دوم فراموش می شوند.4. عناوین را بالای فیلدها قرار دهید

      قرار دادن عنوان فیلدها در بالای آن در صورتی که قصد دارید کاربران فرم را سریعتر تکمیل نمایند ایده بسیار جالبی می باشد. چشم انسان قابلیت جا به جا شدن از بالا به پایین را در 50 میلی ثانیه انجام می دهد ولی به صورت افقی را در مدت 250 میلی ثانیه انجام می دهد. البته قرار دادن عناوین داخل فیلد نیز مورد مناسبی می باشد.5. عناوین فیلدها می بایست به درستی کار شوند

      سعی نمایید برای فیلدهای خود عناوین درستی انتخای نمایید و تا جایی که می توانید این عناوین را کوتاه در نظر بگیرید.6. فرم را اعتبار سنجی سمت کاربر نمایید

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

      در صورتی که قصد دارید کاربر فیلدی را در فرمت خاصی مثلا xxx-xxx-xxxx تکمیل نماید می بایست کاربر را مجبور به این کار نمایید. مثلا به جای ایجاد تک باکس برای فیلد تاریخ بهتر است به کاربر تقویم نمایش داده شود تا کاربر تاریخ را انتخاب نماید.8. ورودی های پیش فرض در فرم قرار دهید

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

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

      در کنار فرم آیکونی جهت نحوه تکمیل فیلد مورد نظر قرار دهید و این آیکون را به صورت موس اور به کاربر نمایش دهید.11. از کپچا CAPTCHA استفاده ننمایید

      در صورتی که از CAPTCHA استفاده نمایید میزان تکیل فرم توسط کاربران پایین خواهد آمد. در صورتی که از این مورد استفاده نمایید در حدود 3%–14% اثر بخشی فرم خود را از دست خواهید داد. جهت جلوگیری از اسپم ها از روش های دیگری که کاربر پسند تر هستند نظیر honeypot استفاده نمایید.12. کلیدهای فرم خود را نام گذاری نمایید

      برای فرم خود عنوان و توضیحات در نظر بگیرید تا کاربران بهتر و با اطلاعات بیشتری فرم را تکمیل نمایند. کلیدهای فرم خود را بهتر نام گذاری نمایید مثلا به جای کلید "ارسال" از کلید "تکمیل ثبت نام" استفاده نمایید.انجام این کار به کاربر این اطلاع را می دهد که در حال انجام چه کاری است.13. کلیدهای فرم خود را در معرض قرار دهید

      کلید پیش فرض فرم می بایست از سایر موارد فرم بیشتر نمایان باشد. این مورد در صورتی که فرم شما چندین کلید داشته باشد بسیار مهم است.14. با کاربران خود در ارتباط باشد

      زمانی که کاربر فرم را ارسال نمود پیغام مناسبی به کاربر نمایش دهید تا کاربر بداند پس از تکمیل فرم چه اتفاق می افتد و یا چه کارهایی می بایست انجام دهد.15. مقایسه فرم های بلند و فرم های چند مرحله ای

      در تحقیقی که بر روی یک فرم که به صورت تک صفحه ای طراحی شده بود با فرمی که به صورت چند صفحه ای و مرحله ای ایجاد شده بود فرمی که تک صفحه ای ایجاد شده بود بیشتر مورد استقبال کاربران قرار گرفت. فرمی که به صورت تک مرحله ای طراحی شده بود در حدود 22% بیشتر از فرم دیگر تکمیل شده بود. اما در صورتی که مجبور به ایجاد فرم چند صفحه ای بودید بهتر است در فرم بخشی را جهت آنکه کاربر بداند در چه مرحله ای از تکمیل فرم است تعبیه نمایید.
      سورس:
      [تنها کاربران عضو شده می توانند لینک ها را مشاهده کنند ]
      [تنها کاربران عضو شده می توانند لینک ها را مشاهده کنند ]

    2. 2 کاربر پست maryamsitedar عزیز را پسندیده اند .

      mehrabon (06-08-2014),tina13 (06-08-2014)

    3. #2

      http://www.graphiran.com/wp-content/uploads/2013/01/1.pnghttp://www.graphiran.com/wp-content/uploads/2013/01/2.pnghttp://www.graphiran.com/wp-content/uploads/2013/01/2.pnghttp://www.graphiran.com/wp-content/uploads/2013/01/2.pnghttp://www.graphiran.com/wp-content/uploads/2013/01/2.png
      کاربر
      تاریخ عضویت
      Jan 2018
      عنوان کاربر
      کاربر
      شماره عضویت
      21366
      نوشته ها
      32
      پسندیده
      3
      مورد پسند : 0 بار در 0 پست
      من دیدم توی بعضی از فرم ها برای دریافت پسورد یه چشم سمت راست تکست باکس هست برای نشون دادن یا مخفی کردن رمز عبور وارد شده. میشه این مورد رو هم توضیح بدید؟؟؟ چطوری میشه اینکارو انجام داد؟
      [تنها کاربران عضو شده می توانند لینک ها را مشاهده کنند ] |[تنها کاربران عضو شده می توانند لینک ها را مشاهده کنند ] |[تنها کاربران عضو شده می توانند لینک ها را مشاهده کنند ] |[تنها کاربران عضو شده می توانند لینک ها را مشاهده کنند ]| [تنها کاربران عضو شده می توانند لینک ها را مشاهده کنند ]

    4. #3

      http://www.graphiran.com/wp-content/uploads/2013/01/1.pnghttp://www.graphiran.com/wp-content/uploads/2013/01/1.pnghttp://www.graphiran.com/wp-content/uploads/2013/01/1.pnghttp://www.graphiran.com/wp-content/uploads/2013/01/2.pnghttp://www.graphiran.com/wp-content/uploads/2013/01/2.png
      کاربر
      تاریخ عضویت
      Jan 2014
      عنوان کاربر
      کاربر
      شماره عضویت
      8598
      محل سکونت
      اصفهان
      نوشته ها
      923
      پسندیده
      911
      مورد پسند : 946 بار در 519 پست
      نقل قول نوشته اصلی توسط Information96 نمایش پست ها
      من دیدم توی بعضی از فرم ها برای دریافت پسورد یه چشم سمت راست تکست باکس هست برای نشون دادن یا مخفی کردن رمز عبور وارد شده. میشه این مورد رو هم توضیح بدید؟؟؟ چطوری میشه اینکارو انجام داد؟
      سلام
      اگر از بوت استرپ استفاده می کنید این راه حلشه:
      [تنها کاربران عضو شده می توانند لینک ها را مشاهده کنند ]
      اگر استفاده نمی کنید هم استفاده کنید، خیلی چیز خوبیه :-)

      My Mail To Ask Question: [تنها کاربران عضو شده می توانند لینک ها را مشاهده کنند ]


    اطلاعات موضوع

    کاربرانی که در حال مشاهده این موضوع هستند

    در حال حاضر 1 کاربر در حال مشاهده این موضوع است. (0 کاربران و 1 مهمان ها)

    موضوعات مشابه

    1. قرار دادن Audio و Video در صفحات وب سایت توسط html
      توسط maryamsitedar در انجمن HTML, XHTML,XML
      پاسخ: 1
      آخرين نوشته: 01-30-2018, 11:30 AM
    2. ایجاد صفحات چندگانه در html
      توسط payam-nn در انجمن HTML, CSS, PHP, Java
      پاسخ: 1
      آخرين نوشته: 01-30-2018, 10:17 AM
    3. آموزش تبدیل psd به html با ساده ترین روش
      توسط Mr. Reza در انجمن HTML, XHTML,XML
      پاسخ: 13
      آخرين نوشته: 01-30-2018, 10:16 AM
    4. کد html تماس با ما به همراه سفارش طراحی
      توسط Mr. Reza در انجمن HTML, XHTML,XML
      پاسخ: 4
      آخرين نوشته: 08-17-2013, 09:20 AM
    5. درخواست کد html تماس با ما
      توسط Mr. Reza در انجمن HTML, XHTML,XML
      پاسخ: 3
      آخرين نوشته: 04-18-2013, 11:57 PM

    کلمات کلیدی این موضوع

    مجوز های ارسال و ویرایش

    • شما نمیتوانید موضوع جدیدی ارسال کنید
    • شما امکان ارسال پاسخ را ندارید
    • شما نمیتوانید فایل پیوست کنید.
    • شما نمیتوانید پست های خود را ویرایش کنید
    •  

    درباره گرافیران

    سایت گرافیران به منظور ارائه بهترین ابزار گرافیکی در وب در تاریخ ۴ خرداد ۱۳۸۹ ساخته شد. از آن زمان تا کنون سعی ما بر این بوده تا بهترین نمونه های آماده ، ابزار گرافیکی و آموزش های فتوشاپ را برای کاربران فراهم کنیم . گرافیران توسط هاست دی ال هاست می شود.

    اطلاعات

    طراحی شده توسط : FoX FuN

    تعرفه تبلیغات : مشاهده تعرفه ها

    ایمیل مدیریت سایت : info@graphiran.com

    لینک ها