webchick.net

very helpful lioness

If table-based layouts offend you on a deeply personal level, we need your help!

Sun, 10/26/2008 - 05:46 -- webchick

As a standards zealot, one of the things I'd personally love to see happen in Drupal 7 is the eradication of table-based layouts. I'm giving stink-eye directly at you, Pushbutton, Chameleon, and Bluemarine. These themes are a strange abberation from the Drupal project's otherwise very meticulous attention to detail regarding web standards, and I'm quite positive that they directly contribute to the Drupal project's ongoing struggles to attract and retain visual designers. Garland is a huge step up, but it was never designed to be an easy to modify base theme, and unless designers happen to stumble across something like Zen, I imagine they come away thinking that Drupal's markup is ugly and antiquated and go to something a bit nicer out of the box like WordPress.

I want Drupal 7 to be an incredible release that ramps up the user experience by 1,000-fold, and making Drupal more accessible to designers and themers (along with an accompanying selection of great looking designs out of the box) is a huge part of that. Fortunately, I'm not alone!

In coordination with several prominent members of Drupal's design/theming community, including Joon Park, John Wilkins, Brad Bowman, Stephanie Pakrul, and Earl Miles, we've come up with what we think is a workable plan for accomplishing these goals.

The overall gist is:

  1. Replace Drupal's default markup with a flexible, standards-based framework that's easy to extend.
  2. Hold a theming contest which uses the base markup, and select the best N designs to go into core as sub-themes.
  3. Remove the old, crufty themes and replace them with the new, gorgeous ones.
  4. Profit!

So if you either a) are a web standards zealot who wants to lend your expertise to the discussion on selecting the default markup, or b) have some time / energy / etc. to help organize a theming contest, please coordinate over at http://groups.drupal.org/node/16200!

Tags: 
drupal
drupal core diaries

Comments

Submitted by Bence (not verified) on

I would eliminate the font-size property entirely from themes. The visitor should choose the font size, not the webmaster.

Why do people start the themes like this?

body {
font-size: 14px;
}

package zen in the default install (or hint to its existence).

its the best thing since sliced bread!

...because there is one place they are still needed--email.The HTML rendering engines in most email clients cannot handle CSS table-less layout. I keep a simple table-based theme as an alternate on some of my sites so that I can use them as a basis for email newsletters.
(b.t.w., The fact that a layout is table-based does not make it non standards-compliant. It can still be semantically tagged.)
However, that said, I totally agree with your thoughts that we need some gorgeous themes shipping with Drupal. Why not ship Zen with Drupal and use it as a basis for porting some of the old themes? Then it would serve an additional purpose by giving some examples of Zen sub-themes.

The HTML email point is an excellent one - there should be some Zen-like table-based theme specifically for building email templates and optimised for the task. And call it something leading like "Email Only". ;-)

Submitted by John Matt (not verified) on

As I am a huge fan of Zen and its methods, and I too want Drupal's theming to be more approachable to the newbie. Count me in and I'll be sure to mention that in the groups page. club penguin

Submitted by Anonymous (not verified) on

just make sure they work with IE6 and IE7... ive spent far too much time trying to get items to float and position correctly in IE on otherwise "production" releases of themes..

Submitted by Antoine Lafontaine (not verified) on

First, I'd like to say I'm glad to hear that there's some consent on a new to do something with the themes included with the core distribution of Drupal.

My experience with Drupal is still fairly limited (less than a year) and I do not think I yet qualify as a (valuable?) contributor to the community but there are a few things I'd like to bring into that discussion and I do not know where to start and organize my taughts... I'll try to be as consise as possible and hopefuly this will bring some constructive/insightful ideas to the work you're doing.

My thoughts:

1. Drupal is a tool. By that I mean that in itself it doesn't do much; It is when you use it that it shines! Let's use a poor but easily understandable analogy: a hammer - the hammer by itself doesn't do much. Use it and you can build a splendid house... For me, a hammer doesn't need an fancy packaging. As long as it has a clearly understandable affordances (a robust looking head, a nice comfortable grip) It will look like it is -and will probably be- quite a good hammer. When it comes to Drupal, I agree there's a need to have better themes for it, but in Core, the themes should not include so much "fancy stuff". For me this would point toward an approach like Zen to be included in Core.

2. As a (not affraid of coding) designer, the theme I would choose would be the one I can easily change to my project's need. I would probably stir away as far as I can from the included default themes. If Drupal, by default, can be as neutral as it can be, this would reinforce my point in no. 1 and be my personnal default theme of choice.

3. The reality is that not everyone is a designer. There is a need for readily usable themes. Should they be included in core? Probably. If my number 1 point is as important as I believe it is, those theme should be derivative of Zen (or a core approach similar to Zen)

4. Would it be possible to have the "already designed" theme in the distribution download, but not in the core? Like I said in point 2, I would probably not want the already "all-designed" theme to stay in my drupal install, so I could easily remove them from the distribution without affecting the upgrade path, that would be great!

5. Instead of having a lot of "design" added to Drupal, have it easily "visualy" customizable out of the box... Drupal shines for its customization/flexibility... make it so that a -somewhat- bland/neutral default theme could be color tweeked (using color module?) in about 30 minutes... not just the page header... block, comments, each custom types page header... If the user, and especialy designers, can feel empowered by Drupal quickly (not just on the content level, but by its visual presentation too), they might want to stick around longer and learn what is needed to go the next step (since a lot have been said about the steep learning curve of Drupal)

Maybe number 5 is not really needed... it might end up being a bloat. I basically hope that a system/theme like Zen will make it as the foundation for Drupal 7 and that the the obvious need for "beautifuly designed" default theme will be addressed more as an included option that we can easily remove/turn off. I've read a few post about the need/hope for more designers flocking to drupal... To attract designers, you do not need beautiful designs per say, you need to make it easy for designers to be able to make their beautiful designs come to life in Drupal...

Last but not least, thank you Angie for all the exceptional work and I always look forward to read your thoughts on all things Drupal (core).


As a standards zealot, one of the things I'd personally love to see happen in Drupal 7 is the eradication of table-based layouts. I'm giving stink-eye directly at you, Pushbutton, Chameleon, and Bluemarine. These themes are a strange abberation from the Drupal project's otherwise very meticulous attention to detail regarding web standards,

Slow down.

There is nothing "anti web standards" about a table tag. It is in the current W3c spec - 4.01. It is in the next one too - HTML5.

I know that we are far along in a movement that prefers CSS for presentation and HTML for markup. This movement discourages [table] tag, but thats not strictly related to web standards. I guess you are using the term web standards in a non standard way (hah).

Submitted by Jeff Eaton (not verified) on

Tables are for presenting tabular data, not for structural layout -- that's the standard. They're perfectly valid elements when used as intended, but their abuse in other areas is definitely a violation of "web standards". It's like the H1 tag -- it's a perfectly valid tag, but using it to mean "bigger text, with boldface" instead of "a top-level heading" is a violation of web standards.

Now, I've seen some people use sized, floated DIVs to display tabular data, and that's definitely insanity. ;-) Pushbutton, Chameleon, and Bluemarine, though, definitely do abuse tables in ways that violate the web standards. The HTML5 spec includes a note under the TABLE definition that says, "we need some editorial text on how layout tables are bad practice and non-conforming"... heh.

The issue is table based LAYOUTS, not tabled content. We have a LOT of tables in drupal, but as long as they're semantically supposed to be tables, we're golden. Themes NEED the conversion not admin screens that should be tables... ++

Submitted by caroltron (not verified) on

This is so exciting, as I am a huge fan of Zen and its methods, and I too want Drupal's theming to be more approachable to the newbie. Count me in...(and I'll be sure to mention that in the groups page) :) -colleen

Ok, I don't have an exhaustive list, but I've got about 60 Drupal 6 themes that I've been playing with. I'd like to see all Drupal 6 & 7 themes specify if they are xHTML 1.0 Strict and validate against CSS 2.1. I can see some reason to validate against CSS 3.0 for more experimental themes, but really think the community should be aiming for xHTML Strict code:
http://openconcept.ca/blog/mgifford/accessible_drupal_six_themes

I hadn't actually thought of looking which of these contains tables. I grepped through all of them for:
grep -i table zen/zen_classic/*php

This way I'd catch references to tables in the template.php & page.tpl.php files, but not in the css files. All of the themes I have validated are tableless except the following:
ability, artistsC01, blue_bars, bluelake, box_grey, channel_nine, dark, fourseasons, sky, slash

Some of these are very slick themes, so would be great for them to be tableless too.