home archive font wall

I Love Typography

MADE POSSIBLE WITH THE SUPPORT OF
I Love Typography
MADE POSSIBLE WITH THE SUPPORT OF

15 excellent examples of Web typography

I have spent the last month searching, stumbling, noting, bookmarking and analysing in a quest to find 15 Excellent examples of Web Typography. I’ve chosen them because they make excellent use of type. Some of the examples mimic the typography of print, while others actually leverage web technology, smart CSS and delicious HTML to make their pages not only aesthetically pleasing, but legible, user-friendly and easily navigable.

In a few days, I will be taking an in-depth look at all these sites, delving into their grids, sifting through their CSS and dissecting their HTML, to discover what makes them tick — and what makes them excellent examples of typography for the Web.

Prepare yourself a drink, sip, sit back, scroll, click and — above all else — enjoy.

01: A List Apart for people who make websites

sd-alistapart.jpg

02: Shaun Inmanprofessional designer and developer

sd-shauninman.jpg

03: FontShopas its name suggests

sd-fontshop.jpg

04: Jesús Rodríguez Velasco blog of UC Berkeley professor

sd-rodriguez.jpg

05: BearSkinRug Shop professional illustrator, Kevin Cornell

sd-bearskinrug.jpg

06: Design View Andy Rutledge, design strategist

sd-andy-rutledge.jpg

07: Rikcat IndustriesRik Catlow, design director

sd-rikcat-industries.jpg

08: Quipsologiesnews and creative morsels

sd-quipsologies.jpg

09: Design Snipsweb design showcase

sd-design-snips.jpg

10: Red Interactive Agency web marketing and development

sd-red-interactive-agency.jpg

11: The Big Noob developed by and for…noobs

sd-the-big-noob.jpg

12: Design Can Change climate change

sd-climate.jpg

13: Process Type Foundry they make type

sd-process-type-foundry.jpg

14: Finch interactive and graphic design agency

sd-finch.jpg

15: SR28 Simon Reynolds, web designer and illustrator

sd-sr-28.jpg

Don’t forget to check back here for the second part, “15 Excellent Examples of Web Typography — a closer look.” It’s going to be dirty work, so your overalls, and be prepared to get your hands dirty, as we take these sites to pieces, look at grids, layout, and some very neat CSS tricks to improve your web typography.

What do you think of these examples? Are there others that you feel deserve a mention?

To ensure you don’t miss out on Part II, join the other +2000 TypeNuts and subscribe to I Love Typography today.

Read the second part, 15 Excellent Examples of Web Typography — Under the Bonnet.

FONT NEWS TYPE HISTORY MAKING FONTS INTERVIEWS BOOK REVIEWS TYPOGRAPHIC FIRSTS FEATURE ARTICLES