Drupal

Input elements should be organized in logical groups so that your brain can process the form layout in chunks of related fields.
–HTML: the Definitive Guide

This is a mockup showing an alternative to the cluttered node form. Play around with the tabs above to see for yourself, or read on for an explanation.

Suggestion 1: Uncluttered node form

The idea is to split up the (often huge) node form into tabs. This way, the fields can be separated into more sensible groups, making it quicker to e.g. just change the menu settings or attach an image. The View, Edit and Settings tabs are the default tabs, Image and Translations are in this case added by other modules and would work in the same manner.

Play around with it and see what you think!

Advantages:

• Uncluttered forms and user friendly grouping of fields
• Easier access to a particular field (not having to scroll down a long form)

Disadvantages:

• Without the suggestion below, it would require more page loads to edit fields on several tabs

Suggestion 2: AJAX/AHAH loading of tabs

This example is using AJAX/AHAH to load the contents of the tabs. This is much faster than having to access a complete new page. I've used the jQuery Tabs plugin for this (very rough!) mockup, but the same could be done with some custom functions inspired by this Tabs plugin. Note: The View tab is not loaded dynamically, but is part of the initial HTML served.

As the form fields are loaded only when they are requested, all the tabs (except View) could be encapsulated in one form tag, making it easy to switch between tabs without having to click Save on each and every tab. Adding a "Save and edit" could also be useful.

JavaScript obviously has to be enabled for this to work. It should therefore degrade for non-JS users, so that all functionality is still intact with JavaScript turned off. This could by done by simply using JavaScript to turn the otherwise "normal" tabs into AJAX ones in the first place. If JavaScript is disabled, the user would see the old fashioned "Edit" tab we're used to. Image and Translations tabs would be like they are today, as normal tabs linking to a stand-alone form.

Advantages:

• Faster access to the forms (not having to load a whole new page)
• Less network load (obviously)

Disadvantages:

• It uses CSS to hide and show tabs, could be a problem with themes?
• More JavaScript overhead, but less time waiting for the tabs to load in the end
• Anything else?