CSS Framework contest submission - some "validators needed" ;-)

Hi,

coming via Andreas Viklund´s blog to a CSS framework contest (and a long planned, never begun MODx template in mind) I just finished a set of templates, but before submitting them I would like to ask you guys for a quick review of them (especially MAC and Linux users: does safari, konqueror work and perhaps MAC/IE?) I tried IE5,IE5.5,IE6.0,FF and Opera, but a MAC isn´t available here in my office, so...

The sense of this contest is (similar to CSS Zengarden) to use only one HTML file with the same content for different designs. The HTML file is mostly accessible (but I think the creator has to do some fine tuning) and all the rest is done with CSS. So for example the content comes before the menu etc. (just look in the source code). The new thing - in comparison to ZEN garden - is that you use several Stylesheets, where only one is changed for layouting. The others (like typo, general layout stuff, form elements etc.) stay the same. I think with some work on that it would also be possible to integrate this in MODx with several documents for the Stylesheets, choosing layout just with the change of one TV for example

Okay, enough written, here are the 6 layouts:

Navigation on the left, 1 column content

simple case: navigation on the left, 1 column content

Navigation on the left, 2 columns content

they put some "additional content" called "sub" in the source, in this case shown on the right.

Topnavigation, one column content + local navigation on top

All the elements shown, but only one column. The local links are a bit silly and hard to design, so I put them in a bit boring way on the top of the content.

Topnavigation, one column content + local navigation on the right

Classic "split menu"

Topnavigation, two column content + local navigation on the right

Again all elements, this time with a top navigation.

Topnavigation, 2 columns content

Same without the local navigation.

While doing this stuff today, I heavily thought about the sense of these 6 given Layouts (meaning 6 different Stylesheets are given), I don´t think it´s the best choice, but I think it´s a beginning in different (buzzwording) web2.0. -whatever-thinking And I know it´s not valid HTML (nor CSS at the moment), but hey, this is not my Source (okay - CSS needs to be tuned tomorrow)

Hope I can get some critics or suggestions, deadline is sunday

Regards,
Marc

the third one, the "local links" font is bigger in Safari, so the last item drops to below the first item. Again in #5 and #6, the font size in the left sidebar is bigger. Not a problem here, but something isn’t quite taking effect.

Other than that, that’s a really nice template.

Hi Susan,

thx for safari-testing

the third one, the "local links" font is bigger in Safari, so the last item drops to below the first item.

Well, this is also in other browers. Problem is, that these dummy links are given and are very long. Usually the links should stay in one row.

Again in #5 and #6, the font size in the left sidebar is bigger. Not a problem here, but something isn’t quite taking effect.

Well, this is like it is supposed to be. This "sub" text is something like additional Info like a biography or something like that. That´s the reason why it is shown a bit smaller (beside the reason that there is not much space left ). But I will tune a little bit these things, thank you.

Other suggestions according design/compatiblity?

Nice work Marc ... very well done given the constraints indeed.

I am glad to see that there are others thinking this way. With all of my sites, there is one clean, semantic, valid XHTML 1.1 template. all the themes look incredibly different with alternate layouts and graphics, The key is starting with slim XHTML. Just code what you mean in a logical order (title, pageinfo, menu, submenu, content, footer) and lay it out with your CSS. I think your temlates look slick as hell! I would use them on my site, and I am tré picky about style.

-sD-

Thank you guys. There is always a way to improve things, but this had to be done in one day. I updated the files and put them together on one URL:

http://www.modxcms.de/contest/

So let´s see how the contest will be

Marc

BTW, I notice that you are using Friendly Alias Paths and don’t have a <base href="[(site_url)]" /> in your template -- this results in incorrect translation of all paths in your template that were provided as relative to the root of the site (for instance when clicking on the content pages in your templates). If you add that base tag within your HEAD tags in the template( s ) you use, all will be well.

Hi Jason,

this isn´t MODx, and I´m not using friendly paths yet. It´s just the static HTML files provided by this contest. For integration in MODx I´ll make this properly, promised

Marc