Google is throwing its own hat into the web fonts ring with the Google Font Directory and the Google Font API. While it appears it doesn’t have any partnerships with the big names in typography like TypeKit does, just a handful of open fonts, it does have a partnership with TypeKit itself (as you’ll see below).
How the Google Font API works
Once you pick a font, you can embed it on a webpage by grabbing code that looks like this:
<link href='http://fonts.googleapis.com/css?family=Josefin+Sans+Std+Light' rel='stylesheet' type='text/css'>
And use it in your stylesheet like this:
h1 { font-family: 'Josefin Sans Std Light', arial, serif; }
You can also use other fonts using the WebFont Loader, which is a JavaScript library developed by Google and TypeKit.
Bane or Boon?
Although I won’t be ditching Font Squirrel anytime soon, one great thing about this new development is that the fonts are hosted on the most reliable servers in the world, just like the different JavaScript libraries are. The even greater thing is that this is Google, one of the strongest forces on the Web, is placing a stake another aspect of web standards.
Of course those things are scary at the same time. Google can just pick any endeavor under the sun, spend resources on it, and possibly dominate, if not dictate the market in no time. It may not get the purist designer types on board, since Google doesn’t exactly have the best reputation for great design, and its presentation has a bit of a developer slant, but it knows its web design technologies well. And in the case of web standards, where new practices are being adopted and old browsers are being discarded at a snail’s pace, Google’s massive resources and influence can only do well to speed things up.
Several design initiatives are taking advantage of the “global village” via the Web, and here’s a look at some of them. Perspectives that are completely different from your own—thousands of miles different—are just one way for you to grow as a designer, so take down some notes and get your passport stamped:
How would you illustrate your city?
CitID invites designers to honor their respective cities creating logos for them. Submission is by email and it’s a great way to get acquainted with design sensibilities from every corner of the world.
How would you create a charity site in 24 hours?
FullCodePress pits Australia, New Zealand, and the US against one another in a 24-hour race to build websites for charitable organizations. Last year’s teams designed for RainbowYouth (New Zealand) and NSW Disability Discrimination Legal Centre (Australia), with NZ coming out on top.
This year: Team USA members are already locked in, with no less than Jason Santa Maria at the helm, but applications for the Aussie and NZ teams are still open until May 5th. The showdown happens from June 19 to 20.
How would you build on an existing design?
The Exhibition Season of this year’s Layer Tennis is done, but if you missed all the live action this compilation video provides a great wrap-up. There were some interesting new matches this time, covering typography, motion graphics, photography, video editing, and the return of the 10-city tournament.
How does this color make you feel?
To wrap up this little excursion we’ve been on, here’s a golden resource for all the global designers out there: David McCandless and AlwaysWithHonor.com designed an infographic on What Colors Mean Across 10 Cultures.
What does it mean for Dell to choose Exljbris’ Museo and Museo Sans as its new corporate fonts? Maybe not much for some people, but as one who has enjoyed using the almost (some characters were modified for the company) the same fonts as freely as can be (some weights are paid), I feel like I’m sharing in Jos Buivenga’s triumph too.
A triumph for the little guy. A triumph for freedom, sharing, open standards. A triumph for hard work and talent that deserves to be recognized in the best possible way.
Museo and the other Exljbris fonts are also as ubiquitous as the Microsoft and Apple system fonts, at least on the Web, because they’re good and free. They’re like the new generation of default fonts to play with, since they’re the most accessible. Same case with The League of Movable Type.
This week, the Museum of Modern Art added the @ symbol to its permanent collection in the Department of Architecture and Design. Although it stands out because it’s intangible it carries just as much history and impact. For starters, did you know that @ has been around since the 6th or 7th century to denote a unit of measure? It’s been used for commerce since, made its way into the typewriter in 1885, then in 1971, Ray Tomlinson decided to use it in the first email system, giving it new purpose in the age of computing.
The story of the @ sign and its entry into the MoMA is also a fascinating lesson on what design can do:
The appropriation and reuse of a pre-existing, even ancient symbol—a symbol already available on the keyboard yet vastly underutilized, a ligature meant to resolve a functional issue (excessively long and convoluted programming language) brought on by a revolutionary technological innovation (the Internet)—is by all means an act of design of extraordinary elegance and economy. Without any need to redesign keyboards or discard old ones, Tomlinson gave the @ symbol a completely new function that is nonetheless in keeping with its origins, with its penchant for building relationships between entities and establishing links based on objective and measurable rules—a characteristic echoed by the function @ now embodies in computer programming language. Tomlinson then sent an email about the @ sign and how it should be used in the future. He therefore consciously, and from the very start, established new rules and a new meaning for this symbol.
The article continues on its value as a different kind of design piece: “It does not declare itself a work of design, but rather reveals its design power through use.” Around the world, different countries have composed different mythologies for it, and its uses are still expanding both socially and technologically.
This is probably the greatest kind of design—the @ symbol is both ancient and modern, local and universal, practical and beautiful, by continuously evolving in its meaning.
Coming Together is a font consisting entirely of different ampersands designed created by 400 artists and designers to help the Haiti earthquake victims. It’s available for $20 from leading font distributors and all proceeds go to Doctors Without Borders.
The “Coming Together” font contains over 400 glyphs and is supplied as a single, cross-platform OpenType font. All glyphs are accessible using OpenType-savvy applications, Unicode-savvy utilities, the Character Map utility on Windows, and FontBook on Mac OS X.
This is the fourth Font Aid initiative by the Society of Typographic Aficionados, the first one in 1999.
While it’s a bit late to write about this, it’s never too late to help Haiti out. What is unfortunate, however, is that another major earthquake has struck, this time in Chile. Tsunami warnings have been hoisted across the Pacific as well. I hope the Type Society and other groups extend their help for this particular disaster too.
I’ll get straight to my answer: very.
More specifically, I’m quite excited about what this league is doing for a branch of typography which seems almost mythical. We know about paid fonts and free fonts, but what’s buzzing big right now is the use of fonts on the web with the emergence of @font-face embedding, webfonts, and services like TypeKit. But what about usage and modification of fonts in general?
The open source debate is always tricky when creative works are in question, but the case shouldn’t be different for typefaces. The League is going beyond that debate, but still has some tough questions to be answered:
Is open source typography important enough to fight for? Are we all brave enough to do something to change the status quo? Is the status quo okay, do we really need to change anything at all?
What is the status quo? If this 3-year old post is any indication, it looks like a sleepy town that needs some jazzing up. The Open Font Library is more closely linked to the open source software community than with the open source design community, but they mentioned Lettercase being a Github-like tool, so it looks like they’re taking steps towards that already.
Should we fight for open source typography and change the status quo? It could potentially compete alongside the hosted font embedding services and create a fine alternative for web designers using custom web fonts. Options are good.
Sound off with your thoughts there!
Meet Laika, a dynamic font that throws out typographical conventions out the window. Serif, sans serif, bold, italic, old style, or new—Laika can be anything you want it to be. Check out the video below or play with it yourself!
There is such a rigid and finite nature to typography that it is staggering to imagine what the implications of a “dynamic font” would be. Is this how future fonts will be made and how they will behave?
A great product sells itself. In the case of FontStruct, which is a Flash-based tool for font design, its creators took no chances and went all out to promote it in the latest issue of their email newsletter: one full page showing what you can do with FontStruct.
Beautiful fonts created with FontStruct are put on display using powerful praises.
(The image above emphasizes only one testimonial. It would be too long if I put everything on the right side in full size.)
This is how you sell your product. You show it in action. And because we’re talking about typography here, nothing goes with beautiful type better than beautiful words. It also happens to be the smartest way to spice up testimonials, or similarly short pieces of text.
As long as you build a good product, you won’t have to worry about either the by-products or marketing copy. I mentioned “by-products” because aside from being a web-based tool, FontStruct is also a user-generated website. I know user-generated sites suffer from high noise-to-signal ratios and people are starting to doubt the “wisdom of the crowds”. But in creative environments like FontStruct, you tend to attract talented producers and enthusiastic consumers. Especially when coupled with a tool that works well.
If you’re looking for cool new fonts to play with, try FontStruct. You’re in for a pleasant surprise.
Beautiful, practical, flexible typography on the Web is practically non-existent and still remains a web designer’s dream. We’ve drawn a few steps closer through Flash- and CSS-based inline replacement techniques but at the price of accessibility and elegant code. Fortunately a member of the W3C’s CSS Work Group, Jason Teague, volunteered to be the primary advocate for the CSS3 typography modules. And he’s asking for our input.
These are the typography modules for CSS3:
CSS Fonts Level 3
…contains the properties to select fonts, as well as properties for font “adjustments”, such as emboss and outline effects, kerning, and smoothing/anti-aliasing. Font selection is identical to the similar section in CSS2. The font adjustment properties are new to CSS3.
CSS Web Fonts Level 3
…provides syntax for describing fonts: their name, their style, which characters they cover and also where to download them from. Adding such descriptions to a style sheet allows a designer to be more precise in font selection and, if the browser supports font downloading, to use fonts that people are unlikely to have installed, including fonts that the designer created himself for the purpose. Web fonts are also used by SVG and, conversely, one can use SVG to create fonts for download. Web fonts existed already in CSS2.
If you ask me, and I’m speaking as a non-expert in typography, I just want the type size renderings to be normalized across all browsers first. With all the new properties about to hit as CSS3 becomes mainstream (it’s working on Safari already), web designers will face even more problems just trying to keep websites sane-looking across different browsers.
Problem is, the W3C is not the right venue for raising this problem since it’s the browser vendors that render styles differently. And I’m not just referring to Internet Explorer here. We all want pixel perfection, do we not? But is it even possible? Not having to choose between px, em, and pt font sizing would be a good starting point.
Regardless, it’s good that there’s an open communication line between the general Web community and the working group. It doesn’t matter if you’re a type fiend or a casual web surfer. All you have to do is leave a comment (you have to register first), and your voice will be heard. So, what have you been wishing for when it comes to web typography? Sound off at Jason’s blog now!
It seems the online world is the perfect place for all the madness taking place every April 1st, but I’ve noticed some of the pranks circling the Web today are really good ideas and worth discussing here on Wisdump.
Gmail users have long wanted a send email in future time feature to avoid unnecessary follow-up and back-and-forth emailing, but Google spins it around. In addition to “never delete another email again”, there’s “never send another late email again”. You can send an email timestamped as far back as April 1, 2004, which is when Gmail was launched and a clue right there how legit this feature is.
Many people would love to have custom time/date stamps on their emails—I know I would. But it becomes a case of deception versus productivity. Will Google continue to draw the line? Do you see this happening in the future? If you can do it with blog posts, why not emails? If you’ll remember last year’s prank, Gmail Paper, it’s another great idea that asks “why not?” too. (And, if anything, testimonials don’t make a product believable.)
Also check out Google’s other pranks for this year:
- Virgle (see also Larry and Sergey’s video), the first human colony on Mars
- gDay, which lets you search content on the internet before it is created
- Google Wake Up Kit, a system that sends increasingly annoying alerts (SMS, water bucket, bed-flipping device) to wake you up – it’s potentially a good idea, but it’s not as subtly executed as Gmail’s pranks so I won’t elaborate on it
Whew! Google’s been busy this year!
Darren Rowse on ProBlogger has launched a way to monetize Twitter with PayPerTweet. This totally makes sense because we’ve long wondered how Twitter could possibly be penetrated by advertisers, and we get a pretty viable answer.
Problem is, Twitter is a pretty trustworthy environment right now—you follow only whom you want to and the second they start spamming you, “unfollow” is always one click away. PayPerTweet is not just a prank but an addressing of the question we’ve all had on our minds: who will cross the line and bring advertising to Twitter? Are we there already? Will you tolerate it? Perhaps fake tweets like announcing PayPerTweet and other pranks—rickrolling is such a big thing these days—is the closest thing we’ll ever get to sneakiness (read: sponsored tweets) on Twitter.
Another great thing about the PayPerTweet announcement is that because it’s a blog-based prank, the comments section clearly shows who got punk’d and who managed to call BS. And you can discuss in a follow-up post the success (or failure) of your prank. We thus find out that PayPerTweet came from an actual proposal to advertise via Twitter for $20. Darren Rowse refused the offer.
Renowned information design expert Edward Tufte joins SlideShare’s board of advisors to help guide people in presenting visual information the proper way. The online slideshow service will employ technologies that automatically eliminate bullet points, chartjunk, and other distracting elements from presentations.
Even if you’re remotely interested in design, you probably believe the world will become a better place by throwing out crappy PowerPoint slides. But is Microsoft to blame for all the ugly, overloaded, and difficult-to-read slides? Can and should software encourage and impress upon its users the principles of good design? And since we know that PowerPoint, as well as Word, was made for business, should we expect people in non-design industries to have rudimentary design sense (i.e., should it be part of their job description)?
Darren Hoyt releases a WordPress theme that showcases the hottest web design techniques ten years ago. How nostalgic! When you click on the preview image, a JavaScript alert comes up, saying, “Happy April Fool’s — seriously, you were gonna download this?”
I wonder how many people actually clicked, or if Darren Hoyt kept track of how many did. Using this theme would be a really good April Fools’ prank; too bad no real theme files were created. Update (April 7, 2008): Somebody actually did a similar prank! Jasongraphix redesigned his site with the “90s look” on April 1st! There’s always the possibility that somebody out there actually finds this theme attractive. This got me thinking: did you really think that old school web design was tasteful back then? Do you think the current web design trends will be considered attractive in the future?
In 1998 I was a freshman in high school and we were supposed to create webpages on a slow, 16-color (yes, literally 16 colors only, not 16-bit) computer, with no graphics program, and had to make do with whatever images were installed on the PC. My geekier-than-thou classmates were fooling around with DHTML alerts and scrolls, and I was too flabbergasted at the limitations of the computer I was using to even see how it was possible to create a decent-looking website. Today, I see people worship the Apple aesthetic, but bash rounded corners and other bright, shiny, glassy Web 2.0 looks, then proceed to play tug-of-war between light, clean, grid-based minimalism and dark, dirty, anything-goes maximalism.
Update (10:48 PM):
The Serif announces that FontFont will release a Helvetica Serif, which is a digital recreation of the sketches by Max Miedinger’s granddaughter.
If the little nuances in the image above don’t already give away the impression that this is a less than spectacular typeface and couldn’t possibly match the sans serif that is Helvetica, that’s okay. But know that having a serif version of Helvetica is a really big deal, quite an impossible one actually. (Update 04/02/08: Stephen Coles of Typographica.org reports in the comments there’s Helserif by Phil Martin.) Helvetica stands for everything a serif typeface isn’t. Do you think Miedinger would come up with a serif typeface just for the heck of it? Do we need a Helvetica Serif? Who should be tasked to create it?
I hope you’re having as much fun this April Fools’ as I am. Don’t forget to check out the most popular April Fools’ Day pranks on the web then go vote for them here.
*/
