By biosv on

Let's say you are a developer and came up with a form that has many form elements (many text fields, many select fields, check boxes, ...). And of course you did not worry about making the form look any good. In worst case, all the form elements are displayed one by one in each line.

Now, it is the designer's job to make the form look nicely laid out and friendly to the user. As a designer, which approach would you take to make the form look good? The original form should be intact, and the layout should be easy to change and modify.

⋅ Categories: Drupal 6.x

Comments

ollynevard’s picture

ollynevard commented

Are you the designer or the developer?

If the structure of the form can't be changed you could try putting similar fields next to each other using CSS. For example say you had the following fields:

  • Title
  • First name
  • Last name
  • Phone
  • Mobile

You could set float: left; on First name and Last name so all the name fields are on the same line. Then set clear: left; on Phone so it starts on a new line and then set float: left; on Mobile so the number fields are on the same line.

If it is a really big form and you are, or have access to a developer, it would be a good idea to try and break the form up into stages. I recently saw this article on A List Apart about accordion forms which looks interesting. This could be achieved quite easily by using hook_form_alter to group like fields into fieldsets and add a couple of links to the bottom of each fieldset for next and previous. Then mix in a little jQuery to to make your links collapse the current fieldset and open the next/prev.

biosv’s picture

biosv commented

Thanks for your comment.
I am not a (core) developer or designer yet, but want to be both. ;)
I know it is good to separate contents from how they look, especially for complex contents that may need to go through changes, both in content and how they look.
I've read about few possibilities -- using CSS (style.css?), working on template files or themeable functions. I am still relatively new to Drupal, and I would appreciate more input.
Webform module seems to be worthwhile to look.