I was talking to a friend earlier today who works for a large design firm and he admitted to me that he’d never make it as a freelancer. His reason was based solely off the amount of time it took him to find the perfect font for everything. That lead to a rather interesting conversation about important fonts are to a site, the most creative layout backed by some amazing imagery could all be lost on a standard Times New Roman font, if it didn’t work with the rest of the design. Let’s take a look at some examples of sites that derive the majority of their design elements from the typography.
Earth Hour has a nice balance of typography and imagery. The overall design elements of the site are drawn from the oversized text, the images just help balance it out, as to not overwhelm the first time viewer of the site. You’ll notice they also don’t overdo it with the number of different fonts that they used, just as the fonts don’t drastically clash with each other.
More Hazards More Heroes is a great example of simplicity through design. There are really only two images that offer anything to the main homepage screen. The band name in the top left is what really grabs your attention, and it’s a cool use of typography as well to get each word of the band name to display more creatively than stacked one on top of the other.
Steven Caver’s site is the epitome of a well-done typography based site. Large blocks of text dominate the site leaving the sparse amount of images to go relatively unnoticed. You’ll also notice that the fonts aren’t anything crazy, just clean, simple, and pleasing to look at. The fact that they’re easy to read also takes the strain off your eyes, not to mention brain, when trying to decipher what the text says. I’ve seen some sites with typography this size in a font that’s more difficult to decode than a captcha security word image.
Elan Snowboards is another cool website that uses typography well. The site is laid out more like a hybrid scrapbook and journal and they did a great job at selecting the proper fonts to help maintain and portray that look. Again, there are multiple fonts on the page, but they don’t contrast one another greatly and there aren’t a gaggle of them to exhaust the viewer as they go from one section to the next.
Marie Catrib serves up a delicious looking site full of fun typography. Not only does the typography help give the site character, but the different colors of each font help liven up the site as well. The designer did a great job of blending the fonts, as you will notice there are quite a few, but they all work together. A great site and very well thought out.
Sibling Rivalry is loaded with all sorts of fun fonts. Again, not a ton of images on the homepage, but a lot of fonts and they’re in a wide variety of colors. All of these things work together nicely to make up a perfect blend, not something you’d expect from three brothers. But if you read some of the text on the homepage you’ll understand how fitting it is and how well the designer was able to capture their philosophy and attitude, then portray it in this design.
With a name like Typographica one would think that it would be oozing with all sorts of cool fonts. It certainly doesn’t disappoint, that’s for sure. I think one of my most favorite elements of this site is the somewhat subtle and almost hidden nature of their top level, main navigation. At first glance I thought that “Typographica. Type Reviews, Books, Commentary,” was simply the company name and tag line. But all it takes is a simple hover to realize those are all links.
What A Lovely Name is a fun site featuring good use of typography. It carries the fun, baby theme that surely gets expecting parents excited as they begin the quest of coming up with the perfect name for their child. You’ll notice that rather than relying on several different fonts to add character to the site they simply relied on various sizes, very clever.
Just Dot looks like a lab that creates magic potions for awesomeness, which I guess is a good aura to have for a media services company. Their choice of fonts works nicely with their scientific doodle drawings as the background. It’s a great balance of fun and professional, giving them the upper hand over other media service sites that look just like all of the others.
Elysium Burns features a few different fonts to make the site look good, just as he claims he does. There is a lot of text in this site, but thanks to the creatively executed use of typography it is all very well organized and displayed. Large font sizes and different colors help the slightly more important text stand out and beyond that the quality of the work does the talking.
There are several ways to implement typography in a site and really make it have an impact on the site. Whether it’s through a different font, increased size, or different color, implementing words on your site shouldn’t come across as a chore, or something that you have to tuck away and hide somewhere so that it doesn’t obstruct the look of all the other images and visual elements. It should be viewed more as another layer of the design tree, and something to help emphasize other aspects of the site.
About the author: with over ten years in the freelance web design and writing fields, Scott Stanton has had his finger on the beating pulse of the industry’s hottest design trends and bends for the past decade. Scott regularly writes for Wix.com the free website builder. Follow him on Twitter @TheScottStanton.
Today, I am giving away Web Design Riches, the ultimate guide on how to run a profitable web design business. Enter your name and email below to get instant access.