The Fonts of Web 2.0


	The Fonts of Web 2.0

phatmommy

10-10-2007 6:07 PM

1299 views

tags:

web 2.0, design, fonts

Add a Comment

Login to Comment. Not a member yet? Sign up

Today's Top Clips

visit the Top Clips page

View the Top Clips from October 10, 2007

Embed This Clip In Your Site...

<div style="margin: 12px 0px; font-family: arial; color: #333333; background: #ffffff; border: solid 4px #e5e5e5; width: 100%; clear: left;"><div class="CM_CTB_Content_Wrap" style="margin: 0px; padding: 0px;background-color: #ffffff;"><div style="border-bottom: solid 1px #dcdcdc; white-space: nowrap; margin-bottom: 8px; background-color: #eeeeee ;background-image: url(http://www.clipmarks.com/images/source-bg.gif); background-repeat: repeat-x; height: 24px; line-height: 24px; vertical-align: middle; padding-bottom: 4px; color: #666666; font-size: 10px;" ><a href="http://clipmarks.com/clip-to-blog/" title="see clips that are hot right now"><img src="http://content.clipmarks.com/blog_embed/d3b8ecf7-5c4f-43a5-a05b-0190b1fd9285/8AA7FEF6-74DD-4320-97D1-A37A2CDBC207/" alt="" width="19" height="19" border="0" style="vertical-align: middle; margin: 0px 4px; display: inline; border: none; float:none;" /></a>clipped from <a title="http://www.fontshop.com/fontfeed/archives/the-logos-of-web-20/" href="http://www.fontshop.com/fontfeed/archives/the-logos-of-web-20/" style="font-size: 11px;">www.fontshop.com</a></div><blockquote style="text-align: left; padding: 0px 8px; margin: 4px 0px 8px 0px; background: transparent; border: none;" cite="http://www.fontshop.com/fontfeed/archives/the-logos-of-web-20/"><P>There is no official standard for what makes something “<A title="Web 2.0 has come to refer to what some people describe as a second phase of architecture and application development for the World Wide Web." href="http://en.wikipedia.org/wiki/Web2.0">Web 2.0</A>”, but there certainly are a few tell-tale signs. These new sites usually feature modern web technologies like <A title="good description of this technology at Wikipedia" href="http://en.wikipedia.org/wiki/AJAX">Ajax</A> 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.</P></blockquote><div style="height: 2px; font-size: 2px; background: #dcdcdc; border-bottom: solid 1px #f5f5f5; margin: 2px 4px;"></div><blockquote style="text-align: left; padding: 0px 8px; margin: 4px 0px 8px 0px; background: transparent; border: none;" cite="http://www.fontshop.com/fontfeed/archives/the-logos-of-web-20/">Read on for a breakdown of the fonts used in a few of our favorite brands.</blockquote><div style="height: 2px; font-size: 2px; background: #dcdcdc; border-bottom: solid 1px #f5f5f5; margin: 2px 4px;"></div><blockquote style="text-align: left; padding: 0px 8px; margin: 4px 0px 8px 0px; background: transparent; border: none;" cite="http://www.fontshop.com/fontfeed/archives/the-logos-of-web-20/">A clear trend in new identities is the use of soft, rounded typefaces</blockquote><div style="height: 2px; font-size: 2px; background: #dcdcdc; border-bottom: solid 1px #f5f5f5; margin: 2px 4px;"></div><blockquote style="text-align: left; padding: 0px 8px; margin: 4px 0px 8px 0px; background: transparent; border: none;" cite="http://www.fontshop.com/fontfeed/archives/the-logos-of-web-20/">Some sites are reflecting the technological breakthroughs of Web 2.0 with a look that says “tomorrow’s techno”.</blockquote><div style="height: 2px; font-size: 2px; background: #dcdcdc; border-bottom: solid 1px #f5f5f5; margin: 2px 4px;"></div><blockquote style="text-align: left; padding: 0px 8px; margin: 4px 0px 8px 0px; background: transparent; border: none;" cite="http://www.fontshop.com/fontfeed/archives/the-logos-of-web-20/"><P>Safe standbys like <A href="http://www.fontshop.com/fonts/downloads/linotype/trade_gothic_virtual/">Trade</A> and <A href="http://www.fontshop.com/fonts/downloads/linotype/news_gothic_std_ot_virtual/">News Gothic</A>, <A href="http://www.fontshop.com/fonts/downloads/linotype/frutiger_std_ot_virtual/">Frutiger</A>, <A href="http://www.fontshop.com/fonts/downloads/linotype/avenir_std_ot_virtual/">Avenir</A>, <A href="http://www.fontshop.com/search/?q=Interstate">Interstate</A>, <A href="http://www.fontshop.com/search/?q=FF%20Meta">FF Meta</A>, <A href="http://www.fontshop.com/search/?q=FF%20DIN">FF DIN</A>, and the always ubiquitous <A href="http://www.fontshop.com/fontfeed/archives/helvetica-and-alternatives-to-helvetica/">Helvetica</A> continue to see use in new web logos:</P></blockquote></div><div style="margin: 0px 6px 6px 4px;"><table style="font-size: 11px;border-spacing: 0px;padding: 0px;" cellpadding="0" cellspacing="0" width="100%"><tr><td style="background:transparent;border-width:0px;padding:0px;">&nbsp;</td><td align="right" style="background:transparent;border-width:0px;padding:0px;width:107px" width="107"><a href="http://clipmarks.com/share/8AA7FEF6-74DD-4320-97D1-A37A2CDBC207/blog/" title="blog or email this clip"><img src="http://content8.clipmarks.com/images/c2b-foot.png" border="0" alt="blog it" width="107" height="17" style="border-width:0px;padding:0px;margin:0px;" /></a></td></tr></table></div></div>

Clipmarks: Home; New Clips; Top Clips; Dashboard

Popular Topics: News; Life; Science; Technology; Entertainment

Get Started: Sign Up; Install Clipping Tool; How Clipping Works; Clip-to-Blog™; ClipSearch

Tools and Resources: FAQ; ClipWeek; Top Clippers; Top Tags; Site Map

About Clipmarks: About Us; Contact; Blog; Copyright; Privacy; EULA

Search Options

Today's Top Clips