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.