We used to develop websites with ugly hacks, dirty workarounds and unmaintainable code. We had to create rounded corners with “corner” background images and nasty divs. Cross-browser transparency was dirty; shadows were quirky; and do you remember resizable buttons and tabs that had to be implemented with CSS sliding doors? All of these workarounds were extremely time-consuming and resulted in bloated code. With CSS3, these creepy hacks are becoming history. And better still, we can use CSS3 right now.
CSS3 is powerful, simple and very easy to learn. Although Internet Explorer does not support most CSS3 properties yet, many designers are experimenting with the new features, gracefully degrading their designs for users with older browsers and offering rich CSS3 interactivity to users on modern browsers. CSS3 is being used (as it should be at the moment) as an additional layer to enrich the user experience by making websites cleaner, more adaptive and more responsive. It’s time to start using CSS3 today.
We’ll consider all entries that we receive until 29th of June 1st of July 2010. The best entries will be published briefly after the contest has ended. The winners will be determined Smashing Magazine’s editorial team and announced shortly after the deadline.
All entries will be released for free downloading and available for free use, without any restrictions whatsoever (you will be credited in the release post, of course). You may include at most one link to your website in the footer of the design.
First Prize
The Intel X25-M Mainstream SATA II Solid State Drive provides faster disk performance and greater durability than traditional hard drives. The X25-M is a Solid State Drive (SSD), and it uses flash memory for storage, giving you dramatically faster data access. The X25-M is a SATA II hard drive with a capacity of 160 GB
Second Prize
The HD 555 features a special internal Surround Reflector, which generates an extended spatial sound field, making it the optimal headphones for home theater, as well as music. A comfortable, high-quality headphone system with acoustic refinement for sound channeling for a new kind of listening experience
Third — Fifth Prizes
Finally, Web design books. We will be giving away:
- Handcrafted CSS: More Bulletproof Web Design
by Dan Cederholm and Ethan Marcotte
- HTML and CSS Web Standards Solutions: A Web Standardista’s Approach
by Web Standardistas
- Designing with Web Standards (3rd edition)
by Jeffrey Zeldman and Ethan Marcotte.
To participate, please follow these steps:
Come up with an original, beautiful and readable design or technique that uses CSS3 styling. It could be anything: a typographic design, an original footer design, an interesting treatment of images or a complete CSS layout — it’s up to you. Also, feel free to use any CSS3 feature that you like. What’s important is that your submission is unique. The more distinctive it is, the better your chances of winning a prize!
Download our blank template.
Use this template to code your own (X)HTML and CSS. You may use JavaScript, but you don’t have to; pure (X)HTML and CSS3 is fine. You can use either XHTML or HTML 4.0 or HTML 5.
Make sure the design looks right in modern browsers (Firefox 3.5+, Opera 10.5+, Safari 4+, Google Chrome 4.0+ Internet Explorer 9+, etc.).
Make sure the design or technique still works (at some basic level) in older browsers.
You can submit more than one design for the contest. Once you’ve completed these steps, do the following:
Create a screenshot of your design in the browser (you can use the Fireshot Firefox Extension to do it).
Pack everything (both the screenshot and code) in a ZIP file.
Attach the ZIP file to an email, addressed to [email protected] and with the subject line [CSS3 Contest] Your_theme’s_title.
In the email, please state your name, your main URL and the country where you reside. If possible, please also briefly describe the ideas that were the driving force behind your design. Be creative, use unusual techniques, explore new skills, do whatever it takes — we want you to get really excited about this.