Who is up for a CSS challenge?
I hinted for some time now, that I was working on a ZenGarden-type site that simulates a CMS environment.
CSS Zen Garden did and does a tremendous job in educating web designers in the ways of CSS and showed that you can completely redesign one HTML document with different style sheets.
Now it is time we did the same for the enterprise level market, where high level CMS vendors still consider CSS too hard or not flexible enough to maintain the style of pages based on ifferent templates and with varying content.
Therefore I started the CSS Toolshed, and will go live with the site soon.
The CSS tool shed is a CMS simulation that has:
- A set of 4 templates for main page layout
- Different content in the main content slot on each reload – the content will be different short articles on CSS and web development.
So far my entry is the only one (Click through the different menus to see the different templates – top menu, left hand menu, bottom menu)
I am very ready to go live with this, but I need some demo styles beforehand.
With a variety of styles the impact can be a lot bigger than just with my sorry example.
So, who is up for providing more initial styles?
You can download the 4 sample templates and the blank css files
together with a template guide and submission guidelines.
Put the final CSS files on your server and send them to me directly or via the submission form
Thanks, and hopefully this will become a good resource for developers who cannot control the markup they have to style to the extend the ZenGarden allowed us to.
November 14th, 2005 at 1:46 am
Great idea – I was wondering if you wanted a copy of our XHTML-compliant CMS to run the site on?
It’s commericial software, but we’d be happy to donate a copy for this cause.
November 14th, 2005 at 9:52 am
Will the designs be made available for use, or will it only be a showcase site? If they will be available, under what licence?
November 14th, 2005 at 10:45 am
That is the decision of the designer and should be specified in the CSS comments. There won’t be any zipped downloads and the styles will be hosted on the designer’s servers.
Excellent point though, will add that to the submission page.
November 14th, 2005 at 1:09 pm
What’s the CMS in use here? Why not go Open Source?
November 14th, 2005 at 1:18 pm
Madjax,
how about submitting a CSS design instead of discussing the page engine? I will publish the engine driving the display at a later stage, but right now I want to get submissions. The idea is not to create or use YET another CMS, the idea was to simulate a CMS driven site that could withstand many many daily page reloads. Furthermore, I wanted to keep the content section very random.
November 15th, 2005 at 7:36 am
I was wondering about something… what about conditional comments? Obviously conditional comments are very important for professional css design, and I think it would be good to include them in the template. I know it would be troublesome, but would it be possible for the toolshed to support this? Or will designers just have to use hacks?
November 15th, 2005 at 8:07 am
Re: Conditional Comments
Personally I prefer the
element()
html>body element()
hack, as it does not care about the type of browser, but only its capabilities. Conditional comments are an MSIE only thing and do not work on a Mac either, therefore they might be handy when you need to cater for this environment but I am sick of measuring web design with browsers. Maybe if we allow MSIE to show some flaws it would increase the user numbers of better browsers. After all the support of some bespoke functionality (wahey – coloured scrollbars) made people use and love MSIE :-)
I will not change anything now that over 350 people have downloaded the templates. Nobody submitted a design so far, no need to annoy them any further.
November 15th, 2005 at 11:10 am
Looking at the demo site and templates (and having just about completed a pair of cms sites myself), it’s at least 5x the work of a Zen entry, so I’m guessing it’ll take a while to pull a design together and submit, unless someone’s got too much time on their hands ;)
I was going to ask which CMS you used, as I think it’s relevant – but it seems you’re not ready to divulge :)
November 15th, 2005 at 12:33 pm
Ermm…. showtime.php IS the CMS :-) There will be a full explanation in due time how to use it for yourself and maybe a packaged system to use for client presentations.
November 15th, 2005 at 2:20 pm
i have a file in windows\system -RPCSS.EXE. I GET MESSAGE DISTRIBUTED.COM IS TRYING TO ACCESS THE INTERNET - RPCSS.CXE.
This seams odd and like a virus since i did not activate this.
is this your file and, if so, why is it trying to acces the internet without mt permission or instruction ?
November 15th, 2005 at 2:26 pm
It certainly is not. All I provided in the zip is images, html and css files, none of which can be infected by a virus.
I am either working on my mac or behind my firewall and couldn’t send out anything infected.
Google is your friend:
http://www.google.com/search?client=safari&rls=en&q=RPCSS.EXE
November 17th, 2005 at 10:47 am
Hi there,
nice idea.. a lot of work.
I wonder what could be the benefit of web designer submitting its work? Would you be ready let say to provide same cms for designers with best /good /high rated templates? Then we could use and template and cms. Everybody happy.. that’s how I see it at least..
Alex
November 17th, 2005 at 11:27 am
The benefit for the designer is to have her/his design as a showcase on a high traffic site and proving that she/he can do flexible CSS that can withstand the issues CMS throws at it.
The “CMS” on the toolshed is a simulator, a single PHP file, and I will release it once the shed goes live for developers to showcase their CSS designs to clients. It is nothing really clever, the whole idea is to show how flexible your CSS can be.
Why do you submit a design to CSS Zen Garden?
As to ” a lot of work ” – it is not much when you start the right way. The templates don’t distinguish themselves in that many aspects and for the content section all that needs to be done is define styles for the content block elements. Generico was done from scratch in about an hour.
November 22nd, 2005 at 3:11 am
I’ve been working on a submission, but I have a few questions. I hope my comment will be seen and responded to.
First, how does one change the header image since it is an IMG tag? In the file it says src=”0.gif” but there must be some way to change this for whichever style is chosen, correct? How do I update the header image?
Second, in the files I downloaded, all of the book images have src=”0.gif” but they are different images when I look at them in the Generico theme. Is this simply a problem with the contents of ZIP files themselves, or am I missing something?
Thanks for your time.
November 22nd, 2005 at 8:30 am
Hi Jonathan,
the spacer GIF is there so that you can use a background image for the logo.
Check my generico CSS:
http://csstoolshed.com/generico/system.css
#logo{
background:url(gc.gif);
display:block;
width:347px;
height:100px;
}
The download pack doesn’t have the book images included that is why they don’t show up. As the building block gallery states, these can vary in size.
The buy now button is another spacer GIF, so that you can replace it with your own.
ul.productlist p.more img{
display:block;
float:right;
padding:0;
border:none;
width:100px;
height:20px;
background:url(buy.gif) top left no-repeat #9c9;
}