Tuesday, December 9, 2014

Mobile friendly contact forms


No one likes filling out forms. This is an axiom. A good contact form is a contact form, which is comfortable for site visitors. Period. A contact form, designed in a visitor friendly way, is never an accident. There are too many things to consider: form responsiveness, label placement, form design or suggestions you add. The world admires people who has brilliant intuition, but, for the rest of us, there is only one working formula: MEASURE and CHANGE, and then MEASURE and CHANGE again. Anyone can select the measurement tool they want to use: which one they like better, Google analytics or the amount of cash he has in his pocket. Easy Contact Forms is a tool helping to change a site’s front door (Aka a contact form). A minute will be enough to change the contact form layout. A few minutes will be enough to add several fields. Testing the results of the improvements on every 100 or so of visitors, you will eventually make your contact form friendly and comfortable for your site visitors. Easy Contact Forms will help you.
Form input fields:
input styled
input[type=text], input[type=url], input[type=email], input[type=password], input[type=tel] {
  -webkit-appearance: none; -moz-appearance: none;
  display: block;
  margin: 0;
  width: 100%; height: 40px;
  line-height: 40px; font-size: 17px;
  border: 1px solid #bbb;
}
Other forms of input control:
Styled form controls
input[type=checkbox] {
 width: 44px; height: 44px;
 -webkit-border-radius: 22px; -moz-border-radius: 22px; border-radius: 22px;
 border: 1px solid #bbb;
}

Reasonable anti-spam protection and several validation layers.

When we say reasonable, we’re assuming that you know how to increase the contact form anti-spam protection when it is necessary. Hidden fields, along with several built-in anti-spam filters, will do the job transparently for site visitors. Easy Contact Forms supports both server and client side contact form submission data validation. Client side contact form validation guarantees that a site visitor gets instant feedback, allowing making quick corrections. Server side validation guarantees that a contact form will work in browsers, when JavaScript is disabled. Server side validation plays a crucial role of contact form’s second line of defense.

Use HTML5 input types appropriate keyboard

<label for=”website”>Website:</label> <input type=”url” name=”website” placeholder=”www.yourwebsite.com” />
URL keyboard
<label for=”tel”>Tel:</label> <input type=”tel” name=”tel” placeholder=”Your telephone number” />
Tel keyboard
<label for=”email”>Email:</label> <input type=”email” name=”email” placeholder=”you@yourwebsite.com” />
Email keyboard
<label for=”time”>Time:</label> <input type=”time” name=”time” placeholder=”9:00 AM” />
Time picker

Easy to use GUI.

Easy Contact Forms have a lot of useful GUI features.
  • Ajax based contact form settings GUI.
  • Advanced data filtering and scrolling.
  • Tab based interfaces.
  • Splash screens and tooltips.

No comments:

Post a Comment