Principles of Beautiful Web Design

Posted in Web Design, Web and technology by Khaled on March 9th, 2007

Yes! yet another contest by SitePoint, after the Photo manipulation one, here’s a CSS contest. I will be a judge in this one too!

Josh Catone (the Community team leader @ SPF) posted :

The Challenge:

Announcing the SitePoint “Principles of Beautiful Web Design” CSS Competition. If you would like to win a copy of SitePoint’s acclaimed new book “The Principles of Beautiful Web design” then all you have to do is to take this html and turn it into a beautiful web page that is an advert for the book.

You are not allowed to change the html and can only use css and background images to create your masterpiece. Unlike the “Zen Garden” examples the html has very few extra “hooks” in the code and you will need to be very creative to turn this into a viable web page.

Advanced css’ers will therefore be able to use advanced selectors to create styling opportunities while those of medium skill levels can concentrate on the graphic side of things.

You must also use the SitePoint logo and the book cover image which can be downloaded from those links and the html for the images is already in place.

General Rules:

The html must remain untouched.

All html content must be used and not replaced with image replacement techniques.

Background images can of course be attached to any available element.

Valid CSS at whatever level you wish so advanced selectors can be used to good effect in browsers that support them.

Browsers to support are: IE6, IE7, Firefox 1.5+, Opera 9+. The design must display well in all the browsers listed with ie6 as the minimum requirement. However you may get more points if you can utilise advanced css to make the display even better in Ie7 firefox and opera.

No CSS hacks to be used.

No Javascript or any other kind of scripting.

The competition will be judged by:
Sarah
Josh
Jelena
Sara
Paul
DT
Dave
(and possibly other SitePoint Forums staff members)

Entries will be judged on technical merit, creativity, aesthetics, and compliance with the rules.

All entries must be received by 1 month from today: 6th April, 2007 at 11:59 (23:59) GMT. The winner notified shortly thereafter.

You are allowed to enter as many entries as you like but the judges decision will be final and will be based on not only the look of the page but also how clever and effective the use of css has been. (Also, you can only win once.)

You can download the html and images from Paul’s basic example but we are expecting much better from you. Remember the CSS is to be completely supplied by you but we have left Paul’s demo there so you can get some ideas on how the page can be manipulated.

When you have completed your design you can post in the competition entry thread and add a link to the layout or attach a screenshot and zip file which we can upload for viewing.

If you have any questions then post below in this thread as the entry thread will be just for entries only.

Good Luck!