Forms

Forms can be one of the most important parts of a website, as they provide the point of contact between the user of the site and the people behind the site. Making a form that is easy to use and understand is not an exact science, but there are plenty of tips, tricks and best practices out there.

Dynamic Help in Web Forms (#)

Luke Wroblewski provides an excellent roundup of different methods being used around the web to provide help with forms. Definitely worth reading as it is a nice collection of patterns to solve the form help issue.

Using some images to capture the different strategies, he provides the good and bad of each method, concluding that there is no right answer, which method you use is user and situation dependent.

Enhancing forms - Unobtrusive Javascript (#)

An excellent example of how to use unobtrusive JavaScript for error checking a form prior to submission. The work is available for download, and at the end of the article is provided a sample form and some exercises to help with your understanding with implementing unobtrusive JavaScript on forms.

Styling form controls (#)

Roger Johansson has an in depth, 2 part look at styling form controls across the different operating systems and browsers. A worthy read if you have ever tried to wrangle submit buttons and input boxes into some form of consistency across browsers while trying to tweak their looks.

How to write HTML forms (#)

Simple a huge linkdump on things related to making forms. Well worth picking thru this page if you are researching methods and best practises for building forms.

Rediscovering the Button Element (#)

The good folks over at Particletree provide this useful little examination and tutorial of the differences between using an <input type="submit" versus the more versatile <button> element.

They provide some screenshots and sample html and CSS to help you get started on styling up better looking form buttons, which can even include images inside the button itself. Also see some good discussion in the comments.

10 Tips To A Better Form (#)

Particletree provides ten tips that can be used when designing a form for your website. Some of this is common sense, some of this is mandated by the W3C, and other bits are useful in certain case situations. If you haven't put much thought into building forms in the past or done any research on best practises, this is a great place to start.

The Man in Blue > Styling Form Widgets (#)

A short weblog post about styling form widgets, including a nice looking example of how to add some style to form submit buttons.

Web Application Form Design (#)

Luke Wroblewski writes an excellent, well illustrated piece about form design.

He covers form layout and the use of visual elements to discuss how we can make our forms easier to scan and understand, and hopefully a lot less painful to fill out.

The Form Assembly (#)

Wow, I've only had a quick look, but this is just amazing. Not only a super useful tool to help you build a form that follows the principle of progressive enhancement : unobtrusive, cross-browser and degradable, but the app itself uses a heavy dose of xmlHttpRequest. Definitely worth checking out - note that at the time of posting, it's in beta.

Check out the Resource categories for older content

The latest from my personal website,
Mike Papageorge.com

SiteUptime Web Site Monitoring Service

Sitepoint's web devlopment books have helped me out on many occasions both for finding a quick solution to a problem but also to level out my knowlegde in weaker areas (JavaScript, I'm looking at you!). I am recommending the following titles from my bookshelf:

The Principles Of Successful Freelancing

I started freelancing by diving in head first and getting on with it. Many years and a lot of experience later I was still able to take away some gems from this book, and there are plenty I wish I had thought of beforehand. If you are new to freelancing and have a lot of questions (or maybe don't know what questions to ask!) do yourself a favor and at least check out the sample chapters.

The Art & Science Of JavaScript

The author line-up for this book says it all. 7 excellent developers show you how to get your JavaScript coding up to speed with 7 chapters of great theory, code and examples. Metaprogramming with JavaScript (chapter 5 from Dan Webb) really helped me iron out some things I was missing about JavaScript. That said each chapter really helped me to develop my JavaScript skills beyond simple Ajax calls and html insertion with libs like JQuery.

The PHP Anthology: 101 Essential Tips, Tricks & Hacks

Like the other books listed here, this provides a great reference for the PHP developer looking to have the right answers from the right people at their fingertips. I tend to pull this off the shelf when I need to delve into new territory and usually find a workable solution to keep development moving. This only needs to happen once and you recoup the price of the book in time saved from having to develop the solution or find the right pattern for getting the job done..