The Logos of Web 2.0
There is no official standard for what makes something “Web 2.0”, but there certainly are a few tell-tale signs. These new sites usually feature modern web technologies like Ajax and often have something to do with building online communities. But even more characteristic among these brands is their appearance. Web 2.0 sites nearly always feel open and friendly and often use small chunks of large type. The colors are bright and cheery — lots of blue, orange, and what we jokingly call the Official Color of Web 2.0: lime green.
You can see some of these striking commonalities in Ludwig Gatzke’s compilation of nearly 400 Web 2.0 logos. Read on for a breakdown of the fonts used in a few of our favorite brands.
The Softies
A clear trend in new identities is the use of soft, rounded sans serifs dominated by VAG Rounded (AKA Rundschrift), but also including Helvetica Rounded, Arial Rounded, Bryant, and FF Cocon. All of these lend a modern friendliness to what might otherwise be a cold trademark.
Oct. 2008 Update — New and underused fonts in this category: Foco, Tondo, FF Netto, Estilo Text, and FF Unit Rounded.
 |
ClipShack — video sharing Font: VAG Rounded and Light obliqued |
 |
Zimbra — collaborative calendar Font: VAG Rounded Light |
 |
Wayfaring — custom Google Maps Font: VAG Rounded (fattened with added stroke) |
 |
Kajeet — mobile phone service Font: VAG Rounded (custom ‘j’) |
 |
Zopa — lending exchange Font: similar to Frankfurter Medium or Bryant Bold Alt |
 |
Pando — file sharing Font: similar to Bryant Medium Alt |
 |
MySpace — social networking Font: Arial Rounded Bold and Bell Gothic Black |
 |
TracksLife — personal database Font: Arial Rounded Bold |
 |
Eventful — collaborative calendar Font: Arial Rounded Bold (slightly smooshed) |
 |
Spongecell — collaborative calendar Font: Arial Rounded Extra Bold |
 |
Skype — internet telephony Font: Helvetica Rounded Bold |
 |
ShoZu — photo sharing Font: FF Cocon Bold |
 |
Tabblo and Tabblog — photo sharing Font: FF Cocon Bold |
The Futurists
Some sites are reflecting the technological breakthroughs of Web 2.0 with a look that says “tomorrow’s techno”. Pixel faces, hard edges, and ultra simplified forms are not as common as the cozy shapes from the group above, but they represent a good portion of the latest internet startups.
Oct. 2008 Update — New and underused fonts in this category: FS Sinclair, FS Alvar, FF Cube, FF Netto, Sys, Notes Style, Purista, Stratum, Neutraliser, ITC Tetra, Stainless, Atrament
 |
Last.fm — musical social network Font: ITC Ronda (customized) Alternate: Avernus |
 |
Photobucket — photo hosting Font: Digital Sans Medium |
 |
Plazes — geographical networking Font: Base 9 Regular SC |
 |
NewsGator — RSS aggregator Font: ITC Bauhaus Medium |
 |
ReminderFeed — reminders via RSS Font: FF Dot Matrix Two Regular |
 |
Technorati — weblog search tool Font: Neo Sans Medium |
 |
TagWorld — social networking Font: Handel Gothic Bold |
 |
Shoutwire — news sharing Font: Agency Bold |
The Classics
Safe standbys like Trade and News Gothic, Frutiger, Avenir, Interstate, FF Meta, FF DIN, and the always ubiquitous Helvetica continue to see use in new web logos.
Oct. 2008 Update — Using uncommon alternatives to classic typefaces can ensure a logo is unique. Here are a few new or underused alts to the standards:
- Trade Gothic → Spiegel, Benton Sans, Brown Gothic
- Frutiger → Locator, FF Transit, Vialog
- Futura → FF Super Grotesk, Neuzeit Grotesk, Nobel
- FF DIN → Malmö Sans, Magion, Sophisto, Antagometrica, FF Good
- Helvetica → see Alternatives to Helvetica
 |
Xanga — weblog community Font: Trade Gothic No. 2 Bold and Light |
 |
FeedBurner — RSS optimization and tracking Font: Trade Gothic Bold |
 |
Newsvine — news sharing Font: FF Meta Bold and Book |
 |
StandPoint — belief sharing Font: FF DIN Medium |
 |
DropSend — file sharing Font: Frutiger Bold |
 |
Flickr — photo sharing Font: Frutiger Black |
 |
PureVolume — music promotion Font: Avenir Book and Medium |
 |
Shutterfly — photo service Font: Avenir Heavy (customized) |
 |
9rules — web design network Font: Helvetica Bold |
 |
PODZINGER — podcast search Font: Interstate Black |
 |
Campfire — group chat Font: Interstate Regular |
 |
YouTube — video sharing Font: Alternate Gothic No. Two |
 |
Bloglines — news aggregator Font: ITC Officina Bold |
 |
Weblogs, Inc. — blog network Font: Syntax Bold |
 |
Wikipedia — collaborative reference Font: Hoefler Text |
New Classics
Just as there will always be trends, there will also be those designers who break from them. The following logotypes eschew the popular styles mentioned above and use new typefaces that have the potential to become timeless classics. The typeface is then used throughout the site in headers and graphics. It’s a great way to reinforce a brand and set it apart:
 |
Socialtext — enterprise wiki Font: Lisboa Sans |
 |
Facebook — social networking Font: Klavika (customized) Also: cards with Vista Sans |
 |
Joyent — small business server Font: Proxima Nova (alt ‘a’) Not a logo, but we love Joyent’s use of Proxima — a new face that feels familiar but has its own character. |
Update – March 22, 2006: Today’s email newsletter suggests some alternatives to the typefaces used in these trends. If you’re not subscribed to FontShop News, you’re missing out on that good stuff, plus the monthly calendar and free font. Register for a FontShop.com account or check your subscription settings to get on board.
See also:
- Test the fonts in this list at FontShop.com
- An annotated list of all the companies represented in Gatzke’s compilation.
- Ben Hunt sums up “current web style”.
- Christopher Fahey rounds up a list of other sites that categorize design style.
- Web2Logo catalogs the sites and hosts forum discussions for each.
-
News
The latest in the world of typography, lettering, and type design.
-
Handpicked Typefaces
Whether they’re newly released, stalwart classics, or hidden gems, these typefaces deserve special mention.
-
Type Tips
Improve your typography skills with these basic tips and advanced tutorials.
-
Fonts in Use
Specimens are nice, but we love to catch a typeface in the wild, where it can truly show how it performs in the real world.
The FontFeed is a daily dispatch of recommended fonts, typography techniques, and inspirational examples of digital type at work in the real world. Eat up.
Related Posts
- Wallpaper* Publishes Type-Tart Cards Gallery
- Wallpaper* have published a gallery of 450 type-tart cards on their website.…Read more
- In Use: Benton Sans for Pangea Day
- On May 10, 2008 — Pangea Day — sites in Cairom, Dharamsala, Jerusalem, Kigali, London, New York City, Ramallah, and…Read more
- Revived, Refined, & Refreshed: MT, ITC, LT, & Adobe
- The Monotype, ITC, Adobe, and Linotype libraries were all updated last month with new releases and specially priced value packs.…Read more
- Font Fight! — The Clone Wars Of Type
- College Humor follows up their funny spoof Font Conference with Font Fight!, where the Helvetica gang is attacked by Arial…Read more
- Extra Bold, Ultra Black Fonts: Hit Hard with Heavy Duty Type
- In an effort to get noticed, a lot of folks turn to the most obvious item in their font menu:…Read more
The FontFeed RSS
88 Comments:
Excellent selection. What about digg http://www.digg.com?
How about Coghead.com? I think that would fit in the 2.0 family.
Digg’s logo is most likely custom lettering, but there are a few similar typefaces, including ITC Tetra, Shimano Square, Neeskens, and Poca.
I’d put Coghead in the Classics category since it is set in Myriad, a modern version of the classic Frutiger.
This article is still one of our most popular despite its age, so I just updated each category with some new and underused fonts that offer an alternative to the stuff that may have seen too much play on the web.
It is nice to see the web 2.0 look spread to Television… not really logo work, but I’ve seen some nice font work with NBC promos. I think they use Reykjavik.
I haven’t seen the newer promos you may be referencing, but Klavika has been NBC’s house typeface for the last couple of years.
great collection of logos. also great resources to browse useful online resources for sharing and communicating online. thanks for pointing out what fonts were used.
–
great compilation. thanks.
Hey mate can you add to this list, the font of twitter.com?
I really need it!
Thanks :)
I doubt the Twitter logo is a font; I’m pretty sure it is custom designed. You might like Softmachine though.
Hello
As a fresh fontfeed.com user i just wanted to say hi to everyone else who uses this bbs :-)
great post! thanks for the awesome information….
May be you should consider updating this post with the new “Pepsi” identity. i guess Pepsi will fit in The Futurists category
Great article thanks !
nice!! very useful info, thanks
avn.rocky
What is the font used for ‘The Medicine Shoppe’?
great fonts here. Cool creatives at work
Excellent post! very useful. Thanx!
also check out: http://www.go2web20.net/
Brilliant! thanks for doing this font research, it will save me a lot of time. Well done Stephen
great collection
SAHweet!! The “Softies” are still my favorite.
Interesting. BUT, why do most logos look like they are made for an application of apple’s i-phone? To me there are clear similarities to the increasing wash of today’s modern webpages. Most look like an internet blogg, but not like a unique representations of the personality that it is supposed to be for.
Common designers, say your message clear and simple, but GET CREATIVE!
nice fonts thank you..
@ardh77: Well, it is quite reassuring that very little of that bevelled, highlighted, shadowed nonsense was seen amongst the Wolda winners.
@ Jennifer: The logo for The Medicine Shoppe is set in Bookman Swash (the original). There’s also ITC Bookman Swash, the updated design.
And don’t forget the OpenType version of ITC Bookman with the swashes built-in.
What a nice information you have here.
Stephen, I always wonder what font used for “POMERLEAU” – http://www.pomerleau.ca
Thanks.
Hmm, I’m not certain. It’s possible they could have modified the wonderful Armchair Modern.
Thanks for taking the time to gather these samples and identify the fonts.
Thank you for sharing this.
great collection……nice logos
Great info! What about the font for Polyvore.com?
Great collection of logos. I still like Skype’s.
Great … some more …. Web 2.0 … “things” …
When do we get to see Art 2.0 ?
Bad things will stay bad and not get better with some shiny polish @ stupid head-offs (plate shining for the win!).
People believing in such nonsense live in < 1000 bc.
Cool collection of fonts. We used some similar concepts in developing the logo for Answerly.com
Great difinitive list of web 2.0 logo designs. I’m looking for some inspiration for a new logo I need to design. This compilation should help, so thanks for a great post!
I think it’s time I rounded my text off, and found this article looking for some css codes.
Does anyone know which font styles are compatible with the current browsers out there?
loved ff cocon, the one for ShoZu, just bought it for my website too, great post!
i really loved the collection..but still there are more best logos which i saw in some other threads…
these creatives are really masterpieces.
Well, you have to realise – although it was updated last year – this collection was assembled three years ago. It’s inevitable that newer “masterpieces” as you call them are not included in this list.
thanxs for share,really appreciate !!!!
Great list – really got me thinking harshly about logos.
Then I got to the bottom here and noticed that there are two FontShop logos… which are completely different! Then compare them with the logo on http://fontshop.com/
Come on FONT Shop!
its really great to have such kind of information…
it is just awesome…
That’s the whole point of the FontShop graphic identity – the typefaces in the logo change continuously. The only constant is the yellow and black (and white).
best collection of web 2.0 logos!
Great collection! I love technoraty simplicity.
Thank you… great job !!
nice logos, love it.
I found these logos and typeface information very interesting.. I am a new lover to Typography, and the more I learn about it the more interested I become.. I find it very funny that these new modern fonts have been given names such as ‘softies’, ‘futurists’ and so on.. this is a great compilation..
KUDOS!
Hi,
These designs are inspirator for me.
Thanks.
beautiful work, beautiful concepts of creating logos
Amazing trip, it reminds me of the Typography Lectures by one of my favorite teacher back in school.
the compilation and the feedback ….
is there any visual time line available on web that depicts the transition of branding marks into the complex shapes of todays modern logo designs?
Digg’s logo is most likely custom lettering, but there are a few similar typefaces, including ITC Tetra, Shimano Square, Neeskens, and Poca.
I’d put Coghead in the Classics category since it is set in Myriad, a modern version of the classic Frutiger.
great post! thanks for the awesome information….
May be you should consider updating this post with the new “Pepsi” identity. i guess Pepsi will fit in The Futurists category
“Does anyone know which font styles are compatible with the current browsers out there?”
@TorchesUK as a web designer I use this handy page to see what I can get away with, cross browser/OS: http://www.apaddedcell.com/web-fonts
though there will need to be an update for Macs and Windows7. But it’s helped me find *nix fonts that compliment Verdana’s large x-height.
Since most of the wonderful fonts listed above are waaaay more than I can ever afford, I must make mine by hand in Gimp (images of company names I mean).
Thanks For Such A Inspiring Collection
Thanks, I need to update a logo this will really help me.
hi people.just registered. pls keep me informed pls. gat to know what’s up.
thanks for this collection may be better with some professionnel description
Great Logos
every time when i read about web2.0 design tends i make me mad. Web 2.0 is a concept not a design aesthetic. It doesn’t matter what trends these web2.0 sites are taking because design has nothing to do with web2.0. It will only increase the confusion.
see this
http://oreilly.com/pub/a/web2/archive/what-is-web-20.html?page=1
also check this presentation by Elliot
http://elliotjaystocks.com/blog/destroy-the-web-20-look-future-of-web-design-new-york/
I hear you, Taha. I’m not a big fan of design trend pieces either, but can’t deny that a certain aesthetic, whatever you want to call it, dominates the Web 2.0 concept. Those who are confused will be confused whether we acknowledge the aesthetic or not.
Hi Stephen thanks for the reply. Well actually I don’t care what people think about web 2.0 but some times I wonder what will be web 3.0. May be we can call grunge style web 3.0. Any way this post can satisfy many’s curiosity.I appreciate for the research that you did for this.
great article, I like it
thanks alot
i dont like this style (web 2.0), all logos is the similar…
Nice compilation! It is always nice to see other’s work.
last fm is my fav :)
What is the font used for the ferrovial agroman logo on thier website. Can any one suggest please.
The logos Pando, DropSend and 9rules are my favorites. I think web 2.0 get a lot of negativity but I think that many of them for their online focused purpose do work really well. Thank you for sharing these.
Do you think you can do the font for COOGI ??
Thanks
That’s ITC Avant Garde Gothic.
If you want typefaces identified, contact the Font Identification and Type Research Team. Works faster, more reliable.
Very inspirational, thanks!!!
Needless to say – Superb collection. Web 2.0 design means focused, clean and simple. I liked “Dropsend” and “Campfire” logos ver much. Many thanks for sharing this resource.
Hiya, I know people go on and on about web 2.0 but don’t you think it may be a sales ploy? If somebody says a professional template design the price may be average but if somebody says professional web 2.0 template design seems to bump up the price! I think simple is everything check out this post I wrote a few days ago.
Does anyone else think the same as me?
I guess I still don’t understand what makes a logo “Web 2.0.”
I read thru the list at this link, as well, and still cannot make heads nor tails of it:
http://www.designzzz.com/spectacular-examples-of-web-2-0-logo-designs/
My understanding of Web 2.0 is that other people perform the work:
- Forward the logo with a link attached as a form of viral advertising.
- A wiki logo that changes on an hourly / daily basis as the world updates it.
Stuff like that …
Cool Logos and very useful informations about the used fonts!
Thx for this from germany!
Yep! Nice sharing. Good to get inspired! :)
Great and excellent logos and I think Web 2.0 is a great tool to web designers and bloggers. Great stats! Thanks so much for the time you took to gather all these stats in one, easy to view place.
innovative
Nice list! Thanks! Also thanks to Glenda for sharing brandcaster.tv
very inspiring logo designs.. i love Zopa logo..
Really great collection. I have seen a pile of FONT posts showing really beautiful fonts. The reason I like this post more is because you mention the font name and linked to the font (making the font available/attainable ) making this post an oldie but a goody. Thank you.
Nice useful post.
We are researching for creation of a logo for a new project. Looks like we are going to be a softie!
Thanks for taking the time to put this together. I’m getting my design chops back up after a very long hiatus. This is getting the official stumble, like, tweet combo.
It’s interesting to see relationship of the fonts and what the brand represents. I know I’ll be back here soon for an upcoming project web 2.0 project.
I’m curios, has anyone seen any new trends coming out of the recession and the flurry of businesses being created in the midst of the 9-5 thing not providing opportunities?
What industries are you seeing and what’s the main branding trend your seeing?
thanks for doing this socialmedia portrait !
This is a great place for all those logos for web 2.0. I’ve never knew there were so many. This place is getting bookmarked.
What is the font used in the logo on http://www.contour.com
Contour Cameras
Thanks for sharing this fonts with us. Excellent work.
Have you heard just what the latest gossip is inside Sydney? That would be so sensational.
Post a comment: