Posted in Forms, HowTo, Mobile, Usability

Beautiful responsive web forms

Mobile browsing is already on track to outpace desktop browsing. Responsive web design allows you to craft sites that are flexible and provide an optimal experience across a wide range of devices. But, what about web forms? Your customers will want to engage with you across all these platforms. HTML5 and CSS3 can help but, as this recent article shows, it’s hardly easy even for a simple contact form. And, actually making your form attractive and usable means more CSS3 and lots of testing. Try this for real-world business forms and you’re talking serious $$$.

frevvo to the rescue!

With frevvo, all this stuff just works. Here’s a simple contact form created in 30 seconds just by dragging and dropping. On the desktop, with all that screen real estate, related fields have been grouped together on a horizontal line. The form looks great. You can easily change colors etc. but that’s for another article.


Now try the same form on your iPhone. The form fields all line up perfectly and the horizontally grouped fields automatically re-arrange themselves to fit the smaller screen. State and Zip naturally fit next to each other so they’re laid out that way. It looks great and is easy to use and fill out for your users. Best of all, zero CSS3 or HTML5 or any code whatsoever. Compare this with Amazon’s registration form – why waste space that’s already limited? GMail’s signup form looks pretty good though the fonts are still too small and it’s hard to read.

Portrait Forms

So, what will many of you do? Naturally, rotate your device. The frevvo form automatically adjusts. The fields expand to make use of the available space – after all, that’s why you rotated the device. Neither Amazon’s nor Google’s form adjusts. Both waste vast amounts of scarce real estate. Even with their massive web development resources, neither manages to get a simple form right.


What about you? Want to stop worrying about technical details like this. Contact frevvo today.

Leave a Reply