8 Days Left To Enter The Typographic Layout Design Contest
You have 8 more days to submit your entry for our Typographic Layout Design Contest. The goal of the contest is to collect beautiful typographic (X)HTML- and CSS-based layouts, created by you, and release them for free as a gift to the Web design community.
So far, only 12 entries have a nice spot reserved in our release post, which will be published at the beginning of July. So, you still have a good chance of winning one of our prizes and showing off what you are capable of on the front page of Smashing Magazine!
Of course, as always, we have various prizes for our participants. The winners of the contest will be determined by the Smashing Magazine Editorial Team. Each winner will receive a prize, such as The Typographic Desk Reference, a quick reference guide of typographic terms and classification, with definitions of form and usage for Latin-based writing systems. Handy for the desk, the TDR contains a thousand facts on typography. Written and designed by Theodore Rosendorf.
Content is king, as we know, and typography is an extremely powerful means for designers to convey their message to their audience effectively. Recently, we presented an overview of useful typographic CSS tools and 8 simple ways to improve Web typography. And now it’s your turn to show what you are capable of using these tools.
Rules
To participate, please follow these steps:
- Come up with an original, beautiful, readable and attractive typographic Web design. (You may use grids or vertical rhythm if you want to, but you don’t have to.)
- Download our blank template.
- Code your own (X)HTML+CSS-based design on this template. (You may use JS-libraries or any other JavaScript, but you don’t have to. Pure (X)HTML and CSS is fine.)
- Feel free to use dynamic image replacement techniques, such as sIFR, sIFR Lite, cufon, FLIR, the @font-face attribute, etc. But please do not include commercial fonts in your templates, because the templates will be released as free downloads at the end of the contest.
- Make sure the design works in modern browsers (Firefox 3, Internet Explorer 7+, Opera 9.6, Safari 3.1, Google Chrome, etc.).
- Make sure your code passes the W3C validation test.
Once your template is complete:
- Create a full-screen screenshot of your template. (The Fireshot Firefox extension might help with this.)
- Pack everything (screenshot and template) in a ZIP file.
- Send your ZIP file by email to: templates@smashingmagazine.com
with the subject line [Typography Contest] Your_theme_title.
Please state your name, your website’s URL and the country you are from. If possible, please also include a brief description of the ideas that were the driving force behind your design. - Be creative, use unusual techniques, expand your skills! Do whatever it takes: we really want you to get excited about this.
Deadline
We’ll consider all designs that we receive by the 30th of June. The best entries will be published briefly after the contest has ended. The winners will be announced briefly after the deadline as well.
All templates will be released for free download and will be available to use for free, without any restrictions whatsoever (and you will be credited in the release post, of course). You may include at most one link to your site in the footer of the template.
How Do I Get Started?
You can design any kind of (X)HTML+CSS template you want: for any blog, portfolio, corporate website, product page, coming-soon page, maintenance page or any other page. However, the design should be new and designed specifically for this contest. Of course, you must hold the copyright of the design and the code.
To start you off with a couple of ideas, here is a showcase of some excellent typographic layouts that have been designed over the last few months.
You can find details about the contest and some inspiration for your work in our announcement post. Get excited, be creative and show us what you can do! Good luck, and we hope to hear from you soon!
(al)



















Andrew
June 23rd, 2009 4:11 pmSo are we allowed to use images at all? Such as background graphics?
(SM) Yes, you are.
Brian Temecula
June 23rd, 2009 5:38 pmResponse to comment #1. You should take pride in being professional, and making quality code that validates. Anyone can fire up Dreamweaver and produce crap code. Do you want to be like them?
Michaël
June 23rd, 2009 8:45 pmWhen I saw the annoucement post last month, I decided not to participate because the deadline was supposed to be the 31st of May, and that was an incredibly short delay…
Anyway, it’s too late to start now. But, for the next time, you should clearly announce when deadlines are corrected / delayed, that would prevent cases like mine.
Eddy Munn
June 23rd, 2009 11:14 pmMust it only validate for CSS 2.1?
jurica
June 23rd, 2009 11:34 pm… does any of this websites shown here can be validated properly?
Nikolaj
June 23rd, 2009 11:48 pmHi,
I´m just a little confused about the word “template” … does it have to something for a Blog or a CMS? Or could it be a static Site too … If Yes, how many Pages do you want (only Homepage, complete Site).
My Fav-CMS is Textpattern, and I really dont know how to give you the Template-Files for this …
(SM) It can be anything, a static page, too.
Curt Simon Harlinghausen
June 24th, 2009 1:21 amCan’t wait for the results.
I am very curious. Tension …..
Fabio
June 24th, 2009 7:19 amgreat contest! anyhow, dreamweaver doesn’t produce crap code…:(
Greg
June 24th, 2009 7:51 amI’m thinking something with Comic Sans……. hmmmmmm
DarthVinsus
June 24th, 2009 8:03 amI’m from Paraguay. Can I participate?
Michal
June 24th, 2009 8:38 amTo Brian Temecula :
Validation doesn’t mean nothing. You can validate and still produce shit code!
Chairman Pallian
June 24th, 2009 8:53 amCheck out the typeface on this site: LINK
robertoblake
June 24th, 2009 10:36 amI think I will enter just based on the fact I feel it will be an interesting exercise of my skills.
Roy
June 24th, 2009 11:37 amIs it allowed to use a wordpress framework?
Lucky 11 Studios
June 24th, 2009 12:12 pmDamn these “web design” contests… can’t you just make it a typographic DESIGN contest?!?
Oh, well…. maybe next time.
Quakeulf
June 25th, 2009 5:18 amPlease make sure to include as many rogue apostrophes as possible. It escapes me how modern designers can have no grasp of the written language even though they work with it every day. Are they really that ignorant? It is something that also sadly reflects in their styles as they seldom improve and only keep fresh by copying existing styles. :s
freshalex
June 25th, 2009 6:13 amwow this is a great competition, I wish I had head of it sooner, I don’t have time to now, but this is a great idea for a comp.
Christopher
June 25th, 2009 10:13 amif there was another week or two I would be able to enter. Dang full time job.
Jamal Nasir
June 26th, 2009 12:21 amCan it be animated Flash page or site, in the blank HTML page without CSS?
Greg Ponchak
June 26th, 2009 6:15 amI’m in, I’ll submit mine tonight :D
Danny
June 26th, 2009 7:22 amI´m with Lucky 11, can´t we have a design contest without the web getting all up in it? I can hate code and love smashing at the same time y´know.
santa
June 27th, 2009 6:06 amin reply to fabio,
dreamweaver is actually a great text editor. it has it even has code collapsing. last time i checked Coda does not.
Vince
July 8th, 2009 3:31 am@sm Well, what happened to this contest? It’s already july…