CSS Zen Garden Mark 2

Littering a dark and dreary road lay the past relics of browser-specific tags, incompatible DOMs, and broken CSS support.

Today, we must clear the mind of past practices. Web enlightenment has been achieved thanks to the tireless efforts of folk like the the World Wide Web Consortium (W3C) and the major browser creators.

The css Zen Garden invites you to relax and meditate on the important lessons of the masters. Begin to see with clarity. Learn to use the (yet to be) time-honored techniques in new and invigorating fashion. Become one with the web.

There is clearly a need for CSS to be taken seriously. The Original Zen Garden aimed to excite, inspire, and encourage participation by showing how a page could look different by just changing the CSS file. Now, we must think forward to responsive design, adapting the page to enhance the user experience and the device / browser THEY choose to use.

CSS allows complete and total control over the style of a hypertext document. The only way this can be illustrated in a way that gets people excited is by demonstrating what it can truly be, once the reins are placed in the hands of those able to create beauty from structure. To date, most examples of neat tricks and hacks have been demonstrated by structurists and coders. Designers have yet to make their mark. This needs to change.

You should show your graphics skills, design flair and your CSS skills. Please use the original CSS Zen Gardens for inspiration, but do not copy these designs as this will not fulfill the new brief

You may modify the style sheet in any way you wish, but not the HTML. Although this is not the usual way to work, it shows your skills in CSS and what you have learnt.

Copy the HTML code and work on it on the university web server or another server of your choice. You need to alter the THREE style sheets called style1.css, style2.css and style3.css and change the file name of the link back to your web page (the line below the comment). Once you have completed your masterpiece test it in all the browsers in the lab, and link the web page to your own portfolio site. The best submissions for the assignment will be showcased with your student details on an external web server

Why participate? Well its part of your assignment, but hopefully will also be a source of recognition, inspiration, and a resource we can all refer to when showing what you can do with CSS alone. With the advent of CSS3 and HTML5, and the difference between browser support this is a challenge!

This is where we move away from the original brief for CSS Zen Gardens. This version is to show cutting-edge use of CSS, that also degrades where necessary. Content is king. Accessibility is important. Good designs are what you should aspire to. Use as much CSS2 and CSS3 as you need to show off your good design. You will use this to show your skills in CSS, so try to be creative in its use. You want people to look and say "Wow that is cool! How did they do that!". If your CSS does not validate due to making it future proof, we can cope with that. If it doesn't for any other reason then fix it!!!

When designing this way you must think of earlier and later browsers to make your CSS as robust as possible. We don't expect your design to look the same in older browsers or browsers that don't have that latest feature as long as the content is still available, and you have done all you can to give them the best experience. If you forget some of the browser extensions to get it to work - then thats not good.

Please respect copyright laws for artwork, and add comments in the CSS to show the original source of the material. Although there is no set age limit this page is aimed at, any graphics used should not be offensive to a child or any adult in respect to gender, country or religion. Any graphics used that are deemed to be against this will result in this section not being marked in the assignment

This is a learning exercise as well as a demonstration, so please use this to improve your skills in CSS - a useful skill to show off to any future employer in Web Development