100 Drupal 6 Fluid Width Themes Tested

ausvalue - August 14, 2009 - 06:14

I like to demonstrate Drupal to clients by demonstrating the effects of changing themes. To do this well I need to have implemented a number of themes that I know will work with my current configurations.

I have a belief that a good theme should be fluid width. Consequently, I downloaded every available Drupal 6 theme from Drupal.org that had the word 'fluid' in the description and tested them.

Most of my configurations end up having some sort of drop down menu. Some themes have their own 'suckerfish' drop down menu and where this was available I tested with this. For all others, I tested by disabling the themes display of Primary Links and using the nice_menus module to display a drop down in the header area

I setup and enabled for all logged in users, all the themes that I got working well on a website at http://humanise.org. This is a new open source project with the objective to create a software oriented metal detector suitable for humanitarian demining. If you wish to try the themes you can register as a user, login, go to 'My Account' from the navigation menu in the sidebar, Select the edit tab and change themes under the Account tab.

Note: We are looking for people to help with this humanise.org project. Not only are we looking for programmers but also helpers to do things such as create a logo or help advertise the project.

Drupal Themes I downloaded/installed were as follows:

960.gs
AD-Novus
A3-Atlantis
abarre
abessive
alina
art4_green
basic
blommor01
bluecitron
bluetrip
channel_nine
clearlooks
colourise
compact-lime
contented7
deco
easybreeze
fluid-Grid
foundation
genesis
genesis_coldday
Genesis_darkmatter
genesis_lite
genesis_typo1
Genesis_webx
Genesis_zine
goofy
interactive_media
internet_services
lightfantastic
litejazz
multiflex3
newsflash
nonZeroRed-DTB
pixture
pixture_reloaded
red-ruby
rootcandy
salamander
salamanderskins
Simply-Modern-theme
sky
spreadfirefox
strange-little-town
tendu
twilight
wabi
zen

As some of these had a number of subthemes plus the Drupal Base System contained some themes, the total number of themes available to test ended up being 100.

The results of testing these 100 themes are below. Those that have a ++ to their left are the ones that I considered worth enabling for users to try. Those with an XX to the right of the name had significant faults.

Most of the errors noted could be fixed easily such as a minor change to the css. I didn't end up reading all themes readme.txt files so some of the below may be covered there.

Content was set up so that some pages of the website were 2 columns and others were 3 column when the theme supported it. Testing was only done with Firefox (v3.0.13) on windows XP. Need to test all reasonable ones again with other browsers/client workstations.

A3 Atlantis: XX Nice menus couldn't be seen (color mismatch)
Fixed width

++ Abarre: Settable color scheme
only 2 columns, no footer

.AD Novus Fluid: XX Very 3 column. Needed to turn off their large logo
Not displaying lists properly in sidebars

960 Grid System Fluid: XX Nice Menus doesn't work
Not displaying lists properly in sidebars
Causes page not found log entries

Abessive: XX Good 1/2/3 column display. Nice menus ends up in middle of header area.

++ Ability: Good 1/2/3 col

AD Novus Fixed: Lists don't work well in sidebars

++ Alina: Very 2 column. RHS sidebar. Only partial fluid width.

++ ArtistsC01: Fixed width - Complicated block pattern, Sidebar on right.
Using themes own suckerfish menu
Multiple color schemes. Light brown scheme looked good.

Basic: XX Drop down doesn't work in nice menus
looks poor. Fixed width

++ Beach: Fluid width option. 1/2/3 col
Nice header picture which works nicely for Humanise.org
Would prefer drop menus to be in the full header (under the picture) rather than
above the content but it ended up clashing with the header picture
Ended up using this as the current default for Humanise.org

Blommer 01: XX Nice menus not very visible (white on white)
only partially fluid.

Blue Lake: XX Nice menus not dropping down.
Otherwise works well, fluid, 1/2/3

++ bluebreeze: Nice menus in header places it over the website name but works in content top.
fluid 1/2/3

bluebreeze fixed: Fixed width. Poor layout with 2 column.

Bluecitron fluid: XX Didn't create columns ???

++ Blue curve: Fluid, simple. 1/2/3

Bluemarine: Fluid, simple. 1/2/3 (Table based)

++ Bluemarine2: Fluid, simple. 1/2/3 (Table based)
Same appearance as Bluemarine so I only enabled this one.

++ Bluetrip: Fixed width 1/2/3 col, Extremely simple

Chameleon: Fluid. No header or footer. Can place menu in right sidebar.
Can't disable its display of Primary Links

Channel Nine: XX Fluid. Header isn't being displayed, consequently no nice menus

Clearlooks: Doesn't work as 3 col ???. Fluid
Only works 2 col with everything in R.H.Sidebar.

++ Colourise: White on black. Fluid option. Excessively large header area but
header area isn't defined in blocks.
No logo support.

Compact Lime: XX Fluid. No logo support. Only 2 col - R.H.sidebar
Theme tries to access an image (/Block-s.png) which
isn't there. Causes a page not found log entry.

++ Contented7: Fluid but only through a small range.

Deco: XX Puts Primary menu in both header and footer but no option not to display.

Doil: XX Fixed width. Nice menus not readable (white on white)

Easybreeze: Fluid only over very small range
Ends up being too wide for many screens when it has 3 columns.

Fluid Grid: XX Doesn't end up displaying sidebars ???

Fluid Grid Starter Kit: Doesn't end up displaying sidebars ???

Foundation: Doesn't work correctly as 3 columns

++ Garland: Various color sets or settable colors

Genesis: Fixed width. Simple.
Not enough margins. Poor appearance

Genesis Cold Day: XX Can't read sidebar, white on white

++ Genesis Dark Matter: Fixed width. White on black
Sidebars hard to read.
Lightning effect looks good.

Genesis Lite: Fixed width. Not enough margin. Simple

Genesis SUBTHEME: Fixed width. Everything simple black on white

Genesis Type1: XX 2 column. Sidebar on right. Fixed width
Very large white on black.
Unable to easily read sidebar. (too light)

++ Genesis Webify: Fixed width. 2 column. R.H.sidebar

++ Genesis Webx: Fixed width. Poor list layout in L.H.sidebar
Left and Right sidebars both on R.H.side

Genesis Zine: Fixed width. Both sidebars on R.H.side
text in lists is too hard to read

++ Goofy: Only left and right sidebars. No defined header etc
Better fluid width than most others. The sidebars are fluid width as well as the content.
Great rounded corners and shadows etc on sidebar borders. Seems strange that so few Drupal sites have them?
Some may consider these now out of date but they still make the site look more professional to me.
Note: From the credits, apparently Dries used this back at Drupal 4.0
Had to place nice menus in the right side bar and as it is setup for the menu items to drop down, it doesn't look right.

++ Interactive Media: Fluid only over a small width

++ Internet Services: Fluid only over a small width

Internet Services - 2nd Edition: After turning off Primary Links the words Primary Links still remains. Almost no fluid width. Poor.

Light Fantastic: Fixed width. Lists not showing well in sidebars.

++ Light Jazz: Fluid width in content area.
Has own Suckerfish menus
These are setup by setting primary links block into Suckerfish menu area.

Marinelli: XX Nice menus doesn't show up in header
fixed width. Both sidebars on R.H.side

Marvin: XX No Header. Only Left and right sidebars. Fluid width.
Turned off Primary Links but they are still displayed

++ Minelli: Fixed width. Various color sets and settable colors
(mediterro, Belgian chocolate or Shiny Tomato look OK)
display centers, width depends on number of columns

++ Multiflex-3: Fluid width. Nice rounded headings in sidebars
Uses own suckerfish menu. Part of internal display of Primary Links.

++ Newsflash: Fluid width. Can specify Font. 7 color schemes
Own suckerfish menus. To setup, turn off Primary Links in theme then place Primary Links block into the suckerfish menu area in the blocks setup.

Nista: XX Meant to be Fixed width but is actually fluid ??
Nice menus doesn't show in header

nonzero: XX Nice menus doesn't show in header.
Meant to be fluid but is actually fixed width. ??

++ Pixture: Fluid width. Various color sets or settable colors
(Red carpet is good)
I find page width of 95% to be a good fluid width.

Pixture Reloaded: XX Color sets as per Pixture.
Has own suckerfish drop menus. To setup, turn off Primary Links in theme then place Primary Links block into the suckerfish menu area in the blocks setup.
Whenever there are drop menus or primary links the columns end up off screen to the right.
(Note: This is CSS while Pixture is a table based implementation.)

++ Pushbutton: Fluid width

++ Red Ruby: Fluid width in both content and sidebars.
Doesn't use full width of window. Poor formatting of lists in sidebars.

Root Candy: Fluid width. Intended as and works well as Admin theme.
color sets or settable colors.
Not suitable for non-admin as it maintains links to admin area even for anon users who can't access them.

++ Root candy Dark: Fluid width. Also intended as admin them but can use as ordinary theme.
Has additional options for navigation for anon, authenticated and admin users

Root Candy Fixed: XXX Started getting validation errors after setting site to this theme.
Was difficult to stop the validation errors even after shifting off this theme ???
No color sets. Fixed width.

++ Salamander: Fluid width. No suckerfish menu of its own.

++ Salamander1: Fluid width. Own suckerfish menu settable up under blocks.

++ Salamander10: Fluid width. Own suckerfish menu settable up under blocks.

++ Salamander11: Fluid width. Own suckerfish menu settable up under blocks.

++ Salamander12 Dark Page: Fluid width. Own suckerfish menu settable up under blocks.
White writing on black background

++ Salamander12 White Page: Fluid width. Own suckerfish menu settable up under blocks.

++ Salamander13 Dark Page: Fluid width. Own suckerfish menu settable up under blocks.
White writing on black background

++ Salamander13 White Page: Fluid width. Own suckerfish menu settable up under blocks.

++ Salamander14 Dark Page: Fluid width. Own suckerfish menu settable up under blocks.
White writing on black background

++ Salamander14 White Page: Fluid width. Own suckerfish menu settable up under blocks.

++ Salamander15 Dark Page: Fluid width. Own suckerfish menu settable up under blocks.

++ Salamander15 White Page: Fluid width. Own suckerfish menu settable up under blocks.

++ Salamander16: Fluid width. Own suckerfish menu settable up under blocks.

++ Salamander2: Fluid width. Own suckerfish menu settable up under blocks.

++ Salamander3: Fluid width. Own suckerfish menu settable up under blocks.

++ Salamander4: Fluid width. Own suckerfish menu settable up under blocks.

++ Salamander5: Fluid width. Own suckerfish menu settable up under blocks.

++ Salamander6: Fluid width. Own suckerfish menu settable up under blocks.

++ Salamander7: Fluid width. Own suckerfish menu settable up under blocks.

++ Salamander8: Fluid width. Own suckerfish menu settable up under blocks.
One of the better color sets

++ Salamander9: Fluid width. Own suckerfish menu settable up under blocks.

++ Salamander Skins: Fluid width. Own suckerfish menu settable up under blocks.

++ Simply Modern: 5 color sets. Settable fonts
Settable sidebar widths (fixed widths) and settable positions.
Own suckerfish menus. Setup under blocks.
Selectable background for content or masthead including option to download file for this.
Fluid width option.

++ Sky: Fluid width options. Settable fonts and settable font size.
Produced a 'warning: invalid arg...' when changing settings but everything worked regardless.
Fluid width in sidebars as well as content.

Slash: XX Fluid width. When nice menus was placed in header, it went all compressed as if placed in sidebar. Lost headings from sidebar blocks.

Slash Black: XX As for Slash

Slash Blue: XX As for Slash

Slash Green: XX As for Slash

spreadfirefox: XX Fluid width. nice menus unusable.

++ Strange Little Town: Fluid width option. Strange unneeded sliding bars around nice menus block.

Tendu: Fluid width. Simple black and white.
Not enough space/padding/margin.

++ Tendu Default Design: Fluid width.

The Dark Theme: Almost fixed width.
nice menus not showing up in the header.

Twilight: Fluid width option. Large color set or set own colors.
All color combinations have a dark background with light colored text.
Most color combinations make nice menus too hard to read.
Settable silhouette graphic for header. This header becomes obscured by nice menus.

++ Wabi: color sets or set own colors.
Fluid option by specify width as %

++ Zen: Fluid option. Using the border option makes it look better.
Is intended as a starting off module for design your own theme.
Is only slightly fluid.

++ Zen Classic: Had to get rid of its good looking primary links bar in order to use nice menus.
Nice menus wouldn't work in navigation are.
When nice menus was in Header area, layout goes haywire.
Works with nice menus in Content Top area.
Very simple blue on white. Only slightly fluid.

zenLand: color sets or set own colors.
Both sidebars on R.H.side. Only slightly fluid.
sidebars tend to overlap.
7 alternative background images for header.

Although the above results aren't from exhaustive tests, there is a lot of work done just in the above. Hope this all helps someone else.

Ken Dawber

http://AusValue.com

-1, not impressed

Jeff Burnz - August 17, 2009 - 00:42

To anyone reading this there are a large number of inaccurate criticisms in this write up. The most blatant is this persons *testing* of starter themes and making criticisms such as "looks poor, extremely simple" - yeah, thats what they are supposed to be like!

1. A number of the themes you have criticised are starter themes, such as Basic, Bluetrip (grids fixed width ffs), Genesis and Zen, all of which offer a default installation, the fact that these did not meet your satisfaction does not warrant criticism - the whole point is to modify them to suite YOUR requirements, which from what I read in your OP, is trivial for most of these theme (the blatantly grids based fixed width themes you *tested* not-with-standing).

2. Picture Reloaded does NOT use suckerfish menus, it uses Superfish menus, and does not break in the manner you describe, which is likely caused by your sites broken HTML or other issue.

2. With the Genesis subthemes - only one subtheme is fluid width! Additionally on your site the base theme is not installed, so if anyone tries to enable one of them they will get an error, and a very rude one indeed. Did you have the right version of Genesis installed when you did your tests - sounds to me like no.

Please, if you are going to make a write up get your facts strait and talk to the theme/module developer about the issue FIRST. This sort of thing riles me something chronic; we put in a HELL of lot of effort bringing you FOSS, so how about contributing, instead of simply denigrating.

-1, not impressed.

Jeff, While your statements

ausvalue - September 23, 2009 - 06:31

Jeff,

While your statements are mainly correct, the original post right from the beginning acknowledges the shortcomings of these tests. This is testing these themes with one particular configuration and one set of objectives. These objectives were clearly stated at the beginning.

A lot of the themes that didn't end up looking good with this configuration are in fact ones that with most other configurations may be far better.

This had an objective to demonstrate a large number of working themes without having to make any modification to the themes in a configuration that I often use. With lots of the themes, the particular color scheme of the theme combined with the default color scheme of nice_menus out of the box meant that to use it you needed to adjust the css somewhere to get this working correctly. I doubt if this is a fault that you would ask the theme developer to fix even though for the purpose of my objectives the theme was rejected.

Modifications is just something normally needed before you use a theme. My statement that it looks bad without these modifications isn't meant to be a criticism of the theme.

For another example the Twilight theme is great with its ability to select from different silhouette graphics for header but it just doesn't combine with using nice_menus across the top.

Certain things that I believe are important such as Fluid width are believed to be bad by others. Consequently statements such as 'only partially fluid' may be a plus or a minus depending on what people want.

Also the data that I use, may not be that common. This site has data using standard HTML lists in the sidebars. A number of the themes don't seem to format this properly in way that makes it appear to be in a list. I doubt if this common enough to be of concern for other people.

By the way, if a theme breaks because of incorrect HTML and other themes don't break with the same data, then I would consider that to be a poor theme. The wysiwyg editors we often supply, don't always create correct HTML. We need to be able to supply Drupal websites to sports clubs and churches and have their secretaries/committee members attempt to create content from a wysiwyg editor that isn't always perfect. I would prefer to stay well away from themes that were particularly sensitive to incorrect HTML.

I have enabled Picture Reloaded on the Humanise.org website if you want to check on the problem.

This test were not exhaustive tests. To even spend 5 minutes on each theme when there are 100 themes means that you have spent many hours testing the themes. Given that that time has been spent, the results may be helpful to someone else with similar objectives.

You are right when you state that some themes are meant to look simple etc or that they aren't intended to look good as they are only started themes. The comments stated are not meant as criticisms.

It wasn't done for the purpose of making some definite guide for Drupal themes. It was done for my own stated purposes. Given that this work is done, including with its many shortcomings, it should be able to be listed without people taking offense.

I don't believe that it is right to look at all the comments as criticisms of the themes.

...

Jeff Burnz - September 23, 2009 - 12:21

To my mind theres world of difference between statements such as:

"This is a starter them that has no styles" and "Looks bad".

One is an objective statement, the other a subjective opinion. Its when subjective opinion is presented as fact that one gets a little annoyed.

... if a theme breaks because of incorrect HTML and other themes don't break with the same data, then I would consider that to be a poor theme.

If a theme breaks because of poor HTML, its because you are not providing the correct set of tools to help your authors. There are plenty of tools such as filters and other better editors that can fix broken HTML (closing divs for example) that can prevent this. To describe the theme as poor is side stepping the issue here - bad HTML is bad for the web and bad for your site.

Nice menus is an important module, but not all themes can support it, and need tweaking. Colorable themes are hard to get this right especially, and ultimately we leave features like this out because of the enormous amount of support requests features such as this generate in our issue queues. For some strange reason many drupal users seem to think that because we release a theme its our task to then modify it for everyone that has a special case - that said most themers would make mods if you pay them a small amount to do so.

To attempt to shoehorn any contrib theme into your site without modification, but with specific requirements, is never going to fly - in a rare case it might, but likely it wont.

To even spend 5 minutes on each theme when there are 100 themes means that you have spent many hours testing the themes.

We spend an insane amount of our free time building and contributing these themes, whenever I hear someone complain that doing a decent job of this or that task "would take a lot of time" I have no sympathy. How long do you think it took me to build Pixture Reloaded? What about Genesis or Adaptivetheme? 50 hours, 100 hours, 200 hours? Combined I can tell you its a lot more than that...

Some kind of landmine?

jwuk - August 21, 2009 - 09:58

Wow, jmburnz, considering the objectives of the humanise.org project, you seem like some kind of landmine Ken stepped on. :(

I know nothing about his project, visited his site as a result of finding this thread in my search for fluid themes. But it sure seems like humanise.org has very worthy goals. If Ken's assessments are wide of the mark, why not just tell him so in a neutral constructive tone and help him home in on a suitable selection of themes?

Meanwhile, I tried to create an account on the site to view the other themes. Ken, your site mails me login details very promptly, but when I click on the resulting page I get 'Access denied'. I went to the request new password link and got a new link mailed to me, same thing happened.

Is anyone else getting into this site, or has the criticism here burned Ken so badly he's gone off for a new life on a better planet?

Jmburnz, those of us arriving at this thread, and doubtless Ken too, would all appreciate some pointers to a better review of fluid themes. TIA.

OK, lets flip that around, I

Jeff Burnz - August 21, 2009 - 12:17

OK, lets flip that around, I wonder how humanise.org would feel if I publicly denigrated their project with misinformation and mistake ridden "reviews"? Of course, this would NEVER be removed from their site and they would simply have fend of criticisms for ever after based on these "reviews".

Drupal is as much a not-for-profit project as any other, has aims a lofty as any other - and none of us, who spend thousands of hours contributing to this project, deserve such ill-informed public humiliation as the OP has seen fit to hand out. Most of use are professionals who build these themes, we give up our free time, money, blood, sweat and tears to contribute these themes - only to be slagged off by some random member with no clue. Yeah, I'm just thrilled about that:/

One thing you have to learn in this project, is that if you stick your neck out and make accusations that are simply unfounded, then expect a stern rebuttal.

Please note, afaict the OP did not post a single issue against any of these themes, and issues are the most direct and important way any user can contribute to the improvement of modules and themes. That is where he should have started, and not also, I never received a nice email asking me about my themes, instead the OP jumped right in and publicly defaced them, mistakes and all. Nice, real nice.

 
 

Drupal is a registered trademark of Dries Buytaert.