Web Standardistas - HTML and CSS Web Standards Solutions

April 2009 Archives

A Dozen Questions for Mr Felton

Feltron Eight

Nicholas Felton is an award-winning graphic designer and typographer based in New York.

Felton’s editorial information graphics for Esquire, The New York Times, Wired and Print, undertaken through his studio Megafone, are characterised by careful attention to detail and a high degree of craft and have won him considerable praise for his skills as an information designer.

His ongoing Feltron Annual Report (2008, 2007, 2006…) - a self-published series of personal annual reports - present detailed displays of personal data compiled from his everyday activities, collated into a rich collection of graphs and maps reflecting countless measurements of his year, available as limited edition prints.

Felton is also the co-founder of Daytum, a “social dashboard” that converts data surrounding subscribers’ habits and routines into elegant information visualisations. A partnership between Felton and Ryan Case, Daytum launched an enhanced subscription service (Daytum Plus) in April.

We asked Mr Felton a dozen questions.

The 2009 Feltron Annual Report

Where did you learn your craft?

I went to school in Providence, Rhode Island at the the Rhode Island School of Design, and have had the good fortune of working for and with a number of truly talented designers throughout my career.

Who inspires you?

Sophie Calle, Brian Eno, Buckminster Fuller and E.O. Wilson.

What are your influences?

Science + Anything Designed Before Computers + Contagious Ideas + Good Stories


What role do systems play within your design process?

Systems, rules and structures are hugely important in my process.

Whether it’s a design brief or a grid system or a set of internal rules I designate - each one helps me narrow the range of possible outcomes of a design until I am confident that what I’ve created is both a good solution aesthetically and conceptually.

Does recording data about an activity alter one’s relationship to that activity, i.e. is gathering personal data recording, or constructing?

Perhaps they’re different things. I can record a year’s worth of activity without constructing any meaning from it. Before Daytum, that was my entire approach - the patterns and totals did not emerge until after the year was finished and could not affect the outcome. Now that Daytum can do the tabulations in real-time, the feedback and cross-influencing potential has definitely come into play… but I’m good at ignoring them.

After half a decade of gathering personal data have you discovered anything about yourself that you might otherwise have been unaware of?

In general, I drink less, I exercise more, I am generally less adventurous, I work more…. Predictably - I am getting and acting older.

Daytum [Detail]

Does enabling others to use your systems through Daytum devalue or strengthen your own work as an artist?

I definitely think it strengthens my work. As more people embrace and popularize personal reporting, it encourages me to experiment with new data-collection strategies and new visual communication approaches.

Have others’ uses of Daytum surprised you?

Absolutely… and that’s the best part of it. By creating an open and flexible system - we hope that more people can use it in ways that a dedicated site for tracking one thing, like running or diaper changes can never accommodate. We never thought that one of our users would be a dog!

Where do you see yourself on the nerd-designer continuum?

I see myself somewhere in the middle, but acknowledge that others probably place me much closer to the nerd end of the spectrum.


What’s your favourite typeface?

What day of the week is it?

In the desert island scenario, I would probably go with Hoefler Text. It’s been a go-to since we first met.

What’s your favourite plain text editor?

It will place me low on the nerd continuum, but if I’m not coding, my go-to text editor is TextEdit (in plain text mode).

What’s your favourite tea?


With green tea a distant second.

1241052240 · Web Standardistas · Follow Us on Twitter | 2 Comments

FOWD London

FOWD London [Detail]

We’ll be attending FOWD London on Thursday, 30 April. If you’re there and you recognise us (although we can’t promise we’ll be wearing tweed), please come up and say hello. We’d love to talk to you.

As we’ll be away for most of the bank holiday weekend we’re taking a short break, we’ll be back in full, re-invigorated action on 5th May. See you then!

While we’re away you might enjoy reading the Nicholas Felton interview, A Dozen Questions for Mr Felton, hot off the press. Don’t say we’re not good to you.

1241046540 · Christopher Murphy · Follow Us on Twitter

1, 8, 27, 64, 125, 216...

Twitter [Detail] (Courtesy of Action Datsun)

As our loyal readers already know, we’re delighted to announce that our friends at friends of ED will be supporting us with a number of free copies of our book for the growing band of Standardistas following us on Twitter, a simple way of thanking you for your support.

Our carefully crafted pseudo-random-number-generator-system™ has already picked the first winner - follower number 256 - and over the next few days we’ll be announcing winner number two, using a new algorithm to keep things interesting.

As before, the lucky follower will be notified within mere minutes of following @standardistas at the ‘magic number moment’.

If you know of anyone who might benefit from a copy of the book and would appreciate a daily dose of carefully selected web design inspiration via Twitter, we’d appreciate if you could point them towards @standardistas.

Tweet this!

It’s all about the numbers.™

1240972080 · Nicklas Persson · Follow Us on Twitter

Twitterific 2.0

Twitterrific [Detail]

In his recent article ‘Twitter Clients Are a UI Design Playground’, Daring Fireball’s Mr Gruber explores the UI design of Twitter clients, highlighting the different approaches adopted by a variety of applications. Gruber states:

There are several factors that make Twitter [an] ideal playground for UI design … Look at a few screenshots of these apps, especially the recent ones, and you will see some very different UI designs, not only in terms of visual style but in terms of layout, structure, and flow.

With the beautifully designed Tweetie for Mac and the idiosyncratic Birdhouse recently released - both gathering vocal followers - the stage looks set for yet another upgrade. Twitterific 2.0, an upgrade to Iconfactory’s popular Twitter client coming soon, looks like yet another iteration in the ongoing user interface design playground.

Watch this space (closely) as the Twitter Client UI Design Playground continues to evolve.

1240970520 · Christopher Murphy · Follow Us on Twitter

Typographica - Now Completely New

Typographica [Detail]

Founded by Joshua Lurie-Terrell, Typographica has served as a wealth of typographic inspiration, relatively unchanged since 2002. Edited since 2003 by Stephen Coles (of The FontFeed and The Mid-Century Modernist), the site - for years characterised by an energetic and spirited typographic discussion - ground to a halt in 2006, its activity, “slowing to a cold maple syrup drip,” in the words of Cole.

Thankfully, 2009 sees Typographica relaunched. With a new design by Chris Hamamoto and Stephen Coles, Typographica is, “Now completely new.” Coles states:

The accessibility of type design tools and distribution is yielding hundreds of new font releases every month. Most of them are rubbish. A select few are worthy of your money (or your client’s). Now, thanks to a new website, Typographica has a new mission as a vehicle for typeface recommendations and reviews.

It’s fitting then that Typographica relaunches with a perennial favourite, the annual Favorite Typefaces selection - a yearly account of the best in new typeface design. With typefaces by Hoefler and Frere-Jones, Xavier Dupré and Matthew Carter included in the Favorite Typefaces of 2008 list you’re sure to find something inspiring at what looks set to be the welcome return of the Typographica of old.

1240886700 · Christopher Murphy · Follow Us on Twitter

1, 2, 4, 8, 16, 32, 64, 128...

Twitter [Detail] (Courtesy of Action Datsun)

We’re delighted to announce that our friends at friends of ED will be supporting us with a number of free copies of our book for the growing band of Standardistas following us on Twitter.

Using a carefully crafted pseudo-random-number-generator-system™, we’ll be offering three lucky new followers a free copy of our book, a simple way of thanking you for your support. The lucky followers will be notified within mere minutes of following @standardistas at the ‘magic number moment’. Our first book will be given to our nth follower within the next 24 hours, with the next two books announced as their magic numbers approach.

If you know of anyone who might benefit from a copy of the book and would appreciate a daily dose of carefully selected web design inspiration via Twitter, we’d appreciate if you could point them towards @standardistas.

Tweet this!

It’s all about the numbers.™

1240528980 · Christopher Murphy · Follow Us on Twitter


MOD™ Poster [Detail]

Courtesy of Svestoslav Simov, founder of independent type foundry Fontfabric, MOD™ is a contemporary fat face available for free in OpenType format. Exuberant and angular, MOD™ is ideal for display purposes.

1240383120 · Christopher Murphy · Follow Us on Twitter


Tal Leming: 'Web Fonts' [Detail]

Tal Leming’s article on WebType Fonts is an excellent overview of some of the potentials (and pitfalls) of embedding fonts for the web, culminating in a proposal that honors the work of type designers whilst opening the door to web designers to use well-crafted typography online.

Although Leming is a type designer and type technology specialist (and a former “jack of all trades” at idiosyncratic foundry, House Industries), he takes a balanced and constructive view, proposing a possible solution to the legal minefield of font embedding. Leming states:

I don’t like to predict the future, but here’s what I think could happen … you want to use a font from XYZ foundry for headlines on your site. You go to the foundry’s website, you enter the domain that your font will be used for, you buy a web embedding license for a small fee, you download the web font file and you put it on your site.

His proposed solution (.wtf, WebType Fonts), ties OpenType fonts to specific domains, allowing professional, foundry-crafted typefaces to be tied to registered domains, ensuring type designers are - deservedly - paid for their work. An interesting idea with potential.

1240381320 · Christopher Murphy · Follow Us on Twitter

TypeCon2009 - Rhythm

TypeCon2009 Wordmark [Detail]

Exquisitely crafted by the UnderConsideration Department of Design - a further division of the UnderConsideration Online Network - the TypeCon2009 wordmark is a wonderfully inventive piece of typography, executed beautifully.

An annual typographic conference organised by the Society of Typographic Aficionados (SOTA), the TypeCon2009 theme is ‘rhythm’; a theme UnderConsideration Department of Design’s Armin Vit and Bryony Gomez-Palacio have embraced in the development of their design. Their typically considered approach to the conference branding is an elegant one, capturing the essence of rhythm and interpreting it typographically.

Vit and Gomez-Palacio state:

Rhythm is understood as the broad concept of arrangement and composition in repeating yet fluctuating patterns and in design and typography it is employed as a visual tool that establishes order yet allows for surprises.

The resulting TypeCon2009 wordmark, based on the five lines of a musical staff, serves to both capture the essence of rhythm and simultaneously create a flexible branding solution which allows for variety whilst maintaining a consistent visual language.

In true UnderConsideration spirit, Vit and Gomez-Palacio describe the creation process from initial concept to finished wordmark from concept to execution, outlining Project Details and Images at the UnderConsideration Archives.

1240374660 · Christopher Murphy · Follow Us on Twitter

The FontFeed

The FontFeed [Detail]

Courtesy of FontShop, The FontFeed offers a daily dispatch of recommended fonts, typography techniques, and inspirational examples of digital type at work in the real world. Perfect for a little typographic inspiration.

Equally worth exploring is FontShop founder Mr Spiekermann’s idiosyncratic SpiekerBlog.

1240031880 · Christopher Murphy · Follow Us on Twitter


TypeNeu™ [Detail]

Typeneu, subtitled ‘An Odyssey in Typography’, “reports on the past, present and future of typographic culture,” offering a wealth of typographic inspiration along the way.

Founded by Emil Olsson and Andreas Pihlström - partners in the equally excellent (and eclectic) studio Suprb, whose clients include Diesel, Dropular and DesigningSounds™ - Typeneu is built on the popular Grid—A—Licious™ WordPress theme (another Suprb creation).

Recent favourites discovered via Typeneu include: Antonio Carusone’s 8 Ways to Improve Your Typography; Miriam Magdalena Tetzlaff’s No Hidden Message; and Morten Iveland’s Hugo.

1240030500 · Christopher Murphy · Follow Us on Twitter

iPhone UI Vector Elements

iPhone UI Vector Elements [Detail]

Unable to find iPhone UI vector elements when creating visuals for their beautifully designed USA TODAY iPhone App, Mercury Intermedia created their own.

In a spirit of openness, Mercury Intermedia are offering the resulting iPhone UI Vector Elements for free download in Adobe Illustrator format, stating:

We took it upon ourselves to recreate a large portion of the iPhone’s UI elements to have available for future projects. Obviously, we aren’t telling you all of this just to wave it in your face and tell you we have fancy tools that you don’t. We care so much about our fellow iPhone developers, we’re making our vector files available to you today.

In addition to the vector elements, and as a response to a number of the original post’s comments (“Why did you make this? Aren’t all of the iPhone elements going to be rasterized to 163 ppi?), Mercury Intermedia have posted an excellent article - Why build iPhone app mockups in vector format? - highlighting a number of advantages of using vector files for user interface projects which is also well worth reading.

1240026600 · Christopher Murphy · Follow Us on Twitter

Now in Paperback

Five Simple Steps [Detail]

Now available in paperback, Mark Boulton’s Designing for the Web is a comprehensive and considered introduction to the craft of graphic design as applied to the world of the web.

With only limited copies available in paperback, get yours now.

Coming soon: Designing Grid Systems for the Web by Mark Boulton and Designing the Invisible by Robert Mills.

1239683760 · Christopher Murphy · Follow Us on Twitter

DiggBar - Framing Redux

DiggBar [Recursive]

Since it’s recent launch, the DiggBar has caused quite a controversy and, with its approach to framing other sites’ content, it’s easy to see why. Daring Fireball’s Mr Gruber sums up the DiggBar’s problems neatly, it’s all about the URLs:

Framing breaks bookmarking, it breaks copy-and-paste from the location field, it breaks your browser history, it breaks bookmarklets. There’s nothing OK about it.

Put simply, the DiggBar hijacks other sites’ content.

Mr Gruber has done an excellent job at rounding up a variety of DiggBar blockers at Daring Fireball and serves his very own DiggBar greeting.

Let’s hope the DiggBar is short-lived.

1239556320 · Christopher Murphy · Follow Us on Twitter

Who is Max Kerning?

M A X K E R N I N G [Detail]

Max Kerning may seem like an enigma; but make no mistake, he is a designer of the highest order who sets high standards. His origins are mysterious, but one thing is certain, he is a fastidious and unyielding champion of type.

A Typography Master-at-Large, never hesitant to express an opinion, Max Kerning states:

When text is clean, well-spaced and organised it is then, and only then, that I find perfection. And that is why I always say, “Clean type is godly type.” Anyone who doesn’t see that is, well, how shall we say, “An idiot.”

Wise words indeed, all neatly summarised in his free-to-download masterwork Letters to Live By.

1239394560 · Christopher Murphy · Follow Us on Twitter

Made by Elephant

Elephant [Detail]

Made by Elephant - home of the super-talented Tim Van Damme (doppelganger of the mysterious Maxvoltar and pioneer of the beautifully crafted Business Card Web Site) - has had a makeover.

A solid foundation of finely crafted markup, coupled with some well written CSS, sprinkled with a modicum of JavaScript (courtesy of the jQuery library) has resulted in a minimal, yet very effective piece of interface design. In a word: lovely.

When Made by Elephant state, “We craft interfaces.” they mean it.

1239379680 · Christopher Murphy · Follow Us on Twitter

CSS Naked Day

function is_naked_day($)

If you’re fortunate enough to be looking at the Web Standardistas’ web site on 9 April, 2009 - affectionately known as CSS Naked Day - you’ll notice that our style sheets have been temporarily disabled.

Fear not, this isn’t an error, it’s intentional. CSS Naked Day is designed to draw attention to the markup that forms the basis of web sites the world over, encouraging the use of semantic and meaningful markup, sans CSS. (Meaningful markup is, after all, a part of the design process.)

Dustin Diaz, CSS Naked Day founder, states:

The idea behind this event is to promote web standards, plain and simple. This includes proper use of (X)HTML, semantic markup, a good hierarchy structure and, of course, a good ‘ol play on words. It’s time to show off your <body>.

As Web Standardistas we encourage a content-out approach - if your markup looks good naked, it proves you’ve considered the importance of structured markup as an essential part of the design process - removing the CSS simply serves to reveal this.

Today, for one day only, we encourage you to embrace CSS Naked Day. Remove your CSS for one day only and show us your well-formed, all too often hidden, markup physiques. We’re looking forward to seeing you all naked.

1239239580 · Nicklas Persson · Follow Us on Twitter


Give your domain search a happy ending. [Detail]

With the growing scarcity of top-level domains and the rise of popular services that creatively approach the domain naming process - last.fm, del.icio.us and chi.mp, to name but three - a .com suffix is no longer seen as de rigueur when tracking down a desirable domain name.

Domainr is a new web-based service, created by Woodside, California based nb.io, which enables you to creatively search for domain names with results returned in real time.

By querying 280 top-level domains and another 2,014 second-level domains for creative domain hacks, Domainr turns real English words into unique and memorable Web addresses. Domainr state:

There are a world of domain names out there, not all of them at the top-level. Inspired by jish.nu, burri.to and del.icio.us, Domainr helps you explore the entire domain name space beyond the ubiquitous - and crowded - .com, .net and .org.

Recently featured in WIRED, Six Revisions and LifeHacker, Domainr looks like a tool well worth bookmarking.

1238993820 · Christopher Murphy · Follow Us on Twitter


Twecipe [Detail]

A collaboration between the talented team at Contrast and Dragons’ Den survivor Niall Harbison, Twecipe is a wonderfully minimal recipe recommendation site built on the Twitter API.

Its secret lies in ease of use coupled with a beautifully illustrated web site which features an eye catching cast of ingredient-inspired cartoon characters. The Twecipe process is simple:

  1. Follow @twecipe;
  2. Send a list of ingredients, e.g. chicken, ginger, coriander via an @reply;
  3. Receive a DM with a link to a perfect recipe.

The above ingredients return Try Haute Habanero Chicken Curry. In Twecipe’s own words, “Yum Yum!”

1238698620 · Christopher Murphy · Follow Us on Twitter

@standardistas: Follow Web Standardistas on Twitter.