Top 5 Tips for Web 2.0 Form Design
This week’s Tech Tip is an assortment of quick tips to give your forms a modern “web 2.0″ facelift. If you are familiar with the latest web design trends, you probably already know that web 2.0 promotes a user-centric design methodology, often with slick glossy elements that invite user interaction, while keeping the overall effect clean and uncluttered.
Did you know that it’s easy to apply web 2.0 design to Caspio-powered forms?
Whether you are just getting started or have CSS web design experience, our step-by-step instructions make it easy to add web 2.0 features to your own Caspio web forms.
1. Change Standard Buttons to Images
Replacing the default HTML buttons with an image of your choice is a simple way to add a little extra punch to your web form design. This is standard feature in Caspio Bridge Styles, where you can use the point-and-click wizard to customize a wide range of built-in style options, or use your own custom images and CSS rules.
Learn how to change standard buttons to images.
2. Create Rounded Borders for Input Fields
A quick and easy way to add rounded corners to your form fields is to use CSS3. This recent adaptation of style sheets is supported on nearly all current browsers, with the exception of Internet Explorer. But don’t worry; your web forms are still fully-functional, and IE support is coming soon. This tip shows you how to apply the popular CSS3 technique for rounded corners.
Learn how to create rounded borders.
3. Add a Gradient Background to Input Fields
Gradient backgrounds in fields are another subtle web 2.0 design technique that can have a big impact. Adding a gradient to input fields adds a nice three-dimensional effect to your forms.
Learn how to add a gradient background.
4. Add Glossy Headers
Another way to give your forms more personality is to add glossy headers. The technique outlined here is especially helpful because the header is still text and only uses a gradient overlay. This way, you can still use Caspio Bridge parameters to personalize the header content if needed.
Learn how to add glossy heading text.
5. Change Text Links to Images
In Caspio Bridge Reports, the various drilldown options (Details, Edit Record and Delete) appear as hypertext links. Although this is perfectly suitable for most applications, you can replace the text links with images to save space and add visual impact.
Learn how to change report text links to images.
Check out the Tech Tip articles for detailed instructions, or contact Caspio Support with any questions.
Popular Posts
- - How to Create a Database from Excel (Part 1: Import Spreadsheet)
- - Announcing Caspio Global Sites for Better Performance and Compliance
- - Need Structured Data in Your CMS? Embed Caspio’s Cloud Database
- - Form To Excel – Three ways to get web form data into Excel
- - Convert Microsoft Excel to a Web Database
Stay Informed
Tags
Amazon app templates awards BYOD Caspio Cloud Cloud Apps cloud computing cloud database community customers database reports data sets election Excel extensions facebook government how-to iPad iPhone Map Mashup media mobile mobile apps MS Access MS Excel News non-profit online database paas plugins ready-made applications ready-to-publish database roadmap searchable database search applications security Services usability web applications web apps web design web forms widgets













