By Interactive Strategies
Jan 27, 2012

Sites of Note - Vol.6: You're Just My Type

Modern developments in CSS and Javascript have made gorgeous web typography increasingly de rigeur.  While home-brewed @font-face declarations in addition to services such as TypeKit and WebType have gained plenty of traction, there is certainly something to be said for the more austere, inventive or unusual implementations of typography that reach beyond the basic technical parameters.  Here are seven (lucky you!) sites that are noteworthy for doing something unique while maintaining a keen eye on aesthetics and functionality:

Type]Media 2011

Netherlands' Type]Media graduates not only managed to put together a portfolio of their stellar graduate typography work, but have presented it in an elegant, colorful and fun-to-use vehicle that lets the work take center stage. Arranged in random order, the site displays a unique glyph from each of the student’s type specimens as a means of identifying the typeface and its creator.   The fixed, index-like left nav and horizontality of the site are also refreshing, allowing for a pleasurable, linear reading experience that’s akin to leafing through a catalogue.

http://typemedia2011.com/

AIGA 50

The AIGA 50, a juried exhibition and awards gala held every two years in Washington DC showcases the region's cream of the crop in print and interactive design.  This year our friends at nclud have designed the event's promotional website, which features a mix of punchy header fonts set in a bold geometric sans-serif along with a lighter weight of the same family for body text.  Also worth noting is the slick image slider on the homepage, which combines text and imagery to create a paper-cutout / die-cut effect.  Nice.

http://50.aigadc.org/

Hanging Up the Moon

Sean Lam's "Hanging Up the Moon" is a rather original approach towards a music album released entirely online. Upon first glance, you might intuit that the animated title text on his website was done with a bit of HTML5 and maybe some CSS thrown in as I certainly did. But you'd be wrong.  While there's nothing ground-breaking about your run-of-the-mill animated .gif in this day and age, it's still great to see such a simple trick used to such great effect.  It's whimsical sure, but also subtle, classy,  and appropriate.  The text also plays nice as "cover art" of sorts, against the circle-in-a-square grid that's been used to organize the tracklist. Added bonus, Georgia (used throughout) is perhaps the only original browser-safe font that's actually still a delight to look at.

http://www.hangingupthemoon.com/#home

K.A.N.T.T.

Kantt's website is a lesson in sleek minimalism and sharp lines.  The push and pull between the headers rendered in all-caps Neutra against the classic elegance of Caslon used in the subheads makes for a stylish, modern pairing.  The graphic consistency is further carried through in animated page loads and rollovers.  Throughout, the type is combined with a recurring "X" and triangle motif and areas of flat color that accentuate the conversational messaging.

http://kantt.dk/

Flow Festival

Encompassing three days of music, art and performances, the online component of Helsinki's Flow Festival offers a dynamic visual experience that likely parallels that of actually attending the event itself. The large grotesk lettering used in the masthead, with its distinctive, slanted "F" makes a bold graphic focal-point.  Utilizing the same typeface, the main navigation, headers and body copy receive similar treatment in descending scale.  This, along with a uniform color palette throughout, create a natural hierarchy that helps tame the variety of content displayed.  Interestingly, typography also works as texture here. Appearing in random bursts of skewed, rotated or otherwise vertically oriented tapestries; blocks of repeating text have been set as a tiling background pattern, energizing the site's immersive, full-width display of articles.

http://www.flowfestival.com/en/

A Word A Day

Brandon Oxendine's colorful year-long project of illustrating one word daily by means of hand-rendered typography is certainly inspiring in its ambition.  The circular (and circumlocutory) "Juxtaposition" is a personal favorite.  In contrast, Oxendine's otherwise monochramatic website is typographically casual (dare I say aloof?) in just the right way, allowing the work to speak for itself. From the right vantage point, it almost brings to mind the editorial starkness and utilitarianism of a finely-wrought newspaper page or magazine spread in The New Yorker— which isn't a bad thing.  Easter-egg: hover over Mr. Oxendine's namesake in the nav bar for some anagrammatic fun.

http://awordaday.net/

Newswordy

As a self-professed lover of Letters, I find the concept behind Newswordy both noble and entertaining at once.  Offering a new word daily, the site features a growing collection of buzzwords (and their definitions) punctuating the dialogue of contemporary politics and news media.  Appearing in a bold sans-serif font reminiscent of workhorse typefaces such as Gotham or Avenir, the newsword of the day is un-missable. As reinforcement, the functional layout uses a no-nonsense three-column (responsive!) grid system to keep things organized, offset by an array of neon hues in the background, randomized daily.  Perhaps following through on the "medium is the message" maxim, Newswordy eschews any imagery, letting type be the star.  For us wordnerds, there's nothing better.

http://newswordy.com/
 

(202) 223-8656