Default Admin Theme for D7

Drupal has an option I haven't seen in any other CMS: You can set a theme for the admin section to your liking. As nice as it is, it raises serious UX problems especially for new users, if admin and frontend theme is the same (see UX study Baltimore: Where is my site?)  There has been talk and action to cure this in a simple way: get a default administration theme into core.

Having learnt that core issues require determination and endurance, I'd like to make a fresh start (apart from an existing issue about that:(http://drupal.org/node/79023) by introducing some possible guidelines and candidates.

Guidelines

So what is this all about? Apart from seperating Front- and Backend optically, why should we want a seperate Admin theme and which requirements should it meet?

1. Clever use of Space

One thing that bugs me about Admin and settings pages in Drupal is the waste of space. Everything is rendered in a vertical manner, a lot of space is wasted because often only a third of the horizontal space is used. On the right see a typical example from the comment settings: the descriptions could easily also flow inside the red-lined area.

Though I understand the reason for this: Modules can easily insert new settings into this because everything is vertical, I hope one day we will see the use of all that horizontal space. For the time being, how to improve the use of space without having to change the forms? Well: Paddings should be small, Fontsizes can also be set to 11px for many things.

This is one main reason I never use Garland for admin section: The fonts are way too big and a lot of unnecessary paddings (that are fine for frontend) are there.

Here is an example from a theme I've done myself: The simple trick to set the font size in the blocks table to 11px makes the table much smaller and nicer, still it is very readable.

2. Optical Hierarchy

There is lots and lots of elements in Admin section. So how can you emphasize more important things and diminish less important? Not too hard to say. Use Font coloring: text can have many shades of grey, and can use color (at least the major color, which would be blue in Garland), text can be smaller and bigger. Headings can be big headings and smaller headings. Very importand messages can get an Icon, which is easy to understand for its symbolic character. See the examples from pixture for the icons. These make a lot of sense for messages which are normally very important.

3. Candidates

These first guidelines imply that a lot of work has to go into detail in an admin theme: font sizing, how to present tables and tabs. Other than a front end theme, the primary focus is not on looking nice. Well sure it should look nice. But furthermore, it must be rational and have a very good Information hierarchy, readability and so on. So far I know three themes that present themselves as Candidates, of which one is not ported for D6 and maybe never will, but is still useful as an example. These candidates so far are RootCandy, Pixture and Aquasoft (which is not ported to D6).

Realizing that this gets too long for a single blog post, it will be a series ;) So in the next issue we will have more guidelines and a look at the candidates and the skills they get onto the dancefloor.