Web Standardistas - HTML and CSS Web Standards Solutions

August 2011 Archives

August Typefaces

Union Sq. [Detail]

Dan Mall rounds up his August Tyepfaces. You can’t argue with his executive summary:

Be adventurous and experiment with new faces, but don’t forget about the classics.

With some real gems – not least Gotham and Clarendon – in the August selection, all with links to further information on foundries and further reading, this looks set to be an inspiring typographic resource and a great insight into real world, real use typography.

As a side note, if you haven’t taken a look at Mr Mall’s redesign, launched way back in May, you should take a look (and read his article on the redesign). It’s a no CMS, no RSS affair which has inspired a number of others to go down the same ‘built lovingly by hand’ route…

Most recently Yaron Schoen.

1314849240 · Christopher Murphy · Follow Us on Twitter

Always read…

The Manual I [Detail]

Should you have missed the opportunity to back The Manual via Kickstarter, fear not, Issue I is now available to buy now.

The inaugural issue is not only beautifully designed by Jez Burrows (with illustrations from a host talented individuals) it also features a wealth of interesting content. With articles by: Simon Collison, Frank Chimero, Liz Danzico, Dan Rubin, Jon Tan and – of course – our good selves, we feel truly privileged to have been invited to contribute to the first issue.

As Mr McMillan, the mind behind The Manual, puts it:

We recognise, along with you, that web design is a distinct discipline, its roots firmly in graphic design yet now adding its own principles, tools, and visual language. You won’t find markup and code, tutorials, and galleries inside these pages. Rather, we archive the insights of some of the best thinkers and writers in our field as they explore and define this serious discipline and more effectively tell the story of our work.

Every issue features six brilliant authors who each present a substantial article in addition to a personal essay. A talented illustrator is assigned to each article to create a stunning work to reflect the meaning of the author’s message. The Manual is published three times a year.

The resulting tome certainly delivers on this promise and we’d encourage you to pick up a copy before they sell out, as they surely will.

1314817260 · Christopher Murphy · Follow Us on Twitter

HTML for Babies

Web Design for Babies [Detail]

If you have a baby, know a baby or are a baby, you need HTML for Babies, a board book of, “bold col­our­ful, pos­i­tive words wrapped in lov­ing HTML markup tags for imag­i­na­tive code geeks in train­ing.”

At a mere $8.99, the first ever web design book for babies is a bit of a bargain. Get your copy now.

1314762120 · Nicklas Persson · Follow Us on Twitter

Sharing Is Caring

The Post-Personal iPad [Detail]

In The Post-Personal iPad, Khoi Vinh argues that the Apple’t tablet is heralding a new era in computing due to its non-personal nature. Being a device that is often shared between family members or even co-workers, the iPad is almost the antithesis of the highly personal iPhone (or other devices available). Lifting someone’s phone off a desk and starting to pinch and zoom and switch between applications is a clear invasion of their personal space, whereas the iPad equivalent of doing this appears quite acceptable. Mr Vinh states:

…our phones are the devices that reflect us as individuals, while iPads seem to be the devices that reflect our closest relationships. This is where I think it’s more accurate to think of the iPad as not just a post-PC device, but as harbinger of a post-personal flavour of computing, one that is more perhaps co-operative, and more open as a user experience.


It would be fascinating to see Apple and third-party software developers fully embrace this concept: a photos app that grabs photos from all the iPhones in a family; a browser that reflects favorites and cookies based not on who is logged into the device at the moment, but who is holding the device at the moment; an address book that can be a true replacement for the family address book my mother used to keep in our kitchen drawer so that everyone could find the neighbour’s number.

Opening up fascinating new challenges for designers and developers, this possible new paradigm in computing is worth our consideration, and Mr Vinh’s article proves to be an excellent primer.

1314648000 · Nicklas Persson · Follow Us on Twitter


[REDACTED] is a piteously petty sycophant and a horribly atrocious small-minded cesspool of putrid effluvium. [Detail]

Tired and frustrated with a !¥$£% who refuses to see the voice of reason? Great news, simply enter the afroementioned irritant’s name and Intellisult, courtesy of Matt Hofstadt, will take care of the rest, conjuring up an intelligent insult on your behalf.

We conjured this little beauty for a recent irritant up earlier:

[REDACTED] is a lamentably myopic microphallus and a vapid internet-addicted delinquent who has delusions of adequacy.

According to Mr Hofstadt: “While other insult generators use limited lists of preformed insults, Intellisult is able to generate millions of unique insults by using magic… errr, geeky algorithm stuff.” We can only comment on the algorithm’s effectiveness in our case, but the Intellisult above suits our needs just fine.

1314646320 · Christopher Murphy · Follow Us on Twitter

Visual Proportions

Visual Proportions in iOS [Detail]

In his excellent piece, New Visual Proportions for the iOS User Interface, Aen Tan provides a comprehensive and detailed analysis of the problems inherent in the iOS user interface reliance on a 44 pixel grid.

It’s a thorough and constructive review and one that’s well worth reading, even if you don’t happen to design for iOS, for an understanding of how grid systems can be applied in a digital context.

1314397620 · Christopher Murphy · Follow Us on Twitter

Sweating the iA Details

iA Writer [Detail]

Oliver Reichenstein on, “a solution for the iA Writer icon that works in every form on every platform … on OSX it even writes itself when you scale it up.” Nice work, sweating the details.

1313443740 · Christopher Murphy · Follow Us on Twitter

Hand Written Book

DR [Detail]

We wrote about Craig Oldham’s Hand Written Letter Project in July. Our limited edition books arrived today (timed to perfection for Mr Persson’s birthday) and they’re very nice indeed. As Mr Oldham puts it:

The book has been achieved with experimental production methods and presents the letters as leaves, as close to the originals as possible. It incorporates the actual letterheads from many of the contributors alongside printed reproductions on a multitude of stocks, finishes, inserts, on UK A4, USA A4 and bespoke sizes in a case-bound, hard-back book.

Now able to hold the finished result in our hands, we can attest to the fact that the book is a truly unique and highly desirable piece of design. If they’re not already sold out, we’d urge you to pick one up before they all go. Truly, great work.

1313439960 · Christopher Murphy · Follow Us on Twitter

8-Bit Fashion

Hussein Chalayan [Detail]

Though our wardrobe is resolutely tweed-focused, we couldn’t help but admire Fashionary’s take on 8-Bit Fashion. If Givenchy, Comme des Garçons and Hussein Chalayan are more your bag, you might like to take a look.

1313438940 · Christopher Murphy · Follow Us on Twitter

Bonjour Converse

Bonjour Converse [Detail]

Converse – von unseren alten Freunden Kember, Simpson und Davis (alias Riot) – ist ein Übersetzer für den iPad, der in Echtzeit Gespräche über ein einzigartiges ‘Dual-Keybord Layout’ ermöglicht. Converse ist die ideale App zur Unterstützung Deiner interkulturellen Übersetzungen auf Englisch, Französisch, Spanisch, Portugiesisch, Italienisch und Holländisch.

1313417400 · Christopher Murphy · Follow Us on Twitter

Vote Young Mr Henderson

Vote Young Mr Henderson [Detail]

In April we wrote a short note on the enterprising activities of young Jack Henderson. At just six years old and with the assistance of his dad, Ed Henderson (henceforth known as ‘Jack’s Dad’), he established Jack Draws Anything.

His goal at the time was to help his younger brother, Noah who - at the age of two - was unwell and, as Jack put it, “At the hospital lots,” (the same hospital that’s also looked after Jack’s other brother Toby, age three). An enterprising young gentleman, Jack put his talents with a sketchbook to good use to raise money for the Sick Kids Hospital in Edinburgh. His initial goal was modest, to raise £100. He swiftly broke that barrier, along with a few others on the way, and is now on his way to raising £30,000 for the Sick Kids Friends Foundation.

Thirty. Thousand. Pounds.

We’re sure you’ll agree that’s an impressive figure for a six year old. Along the way, Young Mr Henderson has been nominated for ‘Child of the Year 2011’, courtesy of Bighearted Scotland, and been singled out as a Charity Champion at the Scottish Charity Awards, 2011. As if this weren’t achievement enough, Jack’s also publishing a book with Hodder Children’s Books. (He’s a talented young chap.)

Why are we refreshing your memory? Jack Draws Anything has been shortlisted in the 2011 .net Magazine Awards in the ‘Social Campaign of the Year’ category and we’d like to rally the troops to support him in this good cause. As .net put it:

Nominees in this category have captured the imagination of the internet with a fresh and innovative campaign. We honour the campaigns that got everyone talking, with a sticky concept people find difficult to forget.

Jack’s up against some stiff competition, not to mention The Muppets, Barbie and Ken. Between them The Muppets, Barbie and Ken combine 159 years of experience. Jack has just six.

We’d like to urge you to take a few minutes out of your time to support this enterprising young gentleman. We’ve nothing against The Muppets (or Barbie and Ken), but we think you’ll agree, a six year old raising £30,000 to help sick kids is the very definition of a campaign that’s “captured the imagination”.

Please, vote for Young Mr Henderson now, we think he deserves this one.

1313180220 · Christopher Murphy · Follow Us on Twitter

Mr Conde

Mr Conde – Creative Designer [Detail]

Mr Conde is a talented chap indeed (and he’s sharply dressed, to boot).

1313165280 · Christopher Murphy · Follow Us on Twitter

Kindle Cloud Reader

Kindle Cloud Reader [Detail]

At first sight, Kindle Cloud Reader looks like it hits the sweet spot nicely.

If you’re making the transition to digital books, the HTML5 web app will allow you to “buy once and read everywhere”. The Kindle Cloud Reader offers instant access to your Kindle library across a range of devices natively in the (Chrome or Safari) browser.

Looking closer, the devices and platforms served by the Kindle Cloud Reader already, with some notable exceptions, have native apps available. So why the need for a web app?

A paragraph in from the Lendle blog comes pretty close to offering an answer to the question “Why use Cloud Reader instead of Amazon’s native app?”:

There’s an integrated Kindle store, and it’s way better than using Mobile Safari to browse the Kindle store on an iPad, because it’s “optimized” for tablets. That’s it, really.

Circumventing Apple’s decree on in-app purchases, what Amazon actually built is an HTML5 Kindle book store with a reader attached, rather than a reader with easy access to the book store. Clever.

1313160960 · Nicklas Persson · Follow Us on Twitter

Black and White

Shiro to Kuro [Extreme, Black and White Detail]

Shiro to Kuro is, apparently, a shortened form of ‘shiroi to kuroi’ which is Japanese for ‘black and white’; it’s also a curated gallery of exquisitely crafted design, honed from the purest monochrome. If you’re looking for pure, black and white inspiration, look no further.

Proof that the black and white palette can be a bountiful one indeed.

1313095680 · Christopher Murphy · Follow Us on Twitter

Making Technology Indistinguishable From Magic

Edwin Land [Detail]

Harry McCracken’s exhaustive article on the creation of the Polaroid SX-70, The Art and Science of the Nearly Impossible makes fascinating reading. Drawing parallels with recent technological innovations like the iPad, the story of one of the greatest scientific visionaries of the 20th century paints Edwin Land as a Steve Jobsian character, a determined genius with absolute attention to detail.

At several thousand words spread over 5 densely worded pages, the article proves that the long-form reading is alive and well, and, when done right, infinitely more rewarding than the snippets we usually associate with writing for the web.

[ Via Yaili. ]

1313093700 · Nicklas Persson · Follow Us on Twitter



For the dogged luddite in your life, why not give Postcardly a whirl? As the site puts it, the process is simple: create a Postcardly email address; send an email with an attached photo; and Postcardly send Grandma (or the aforementioned luddite) a postcard. We’re suckers for this kind of online and offline integration and nothing beats a little something in the post.

[Via Swiss Miss.]

1313093280 · Christopher Murphy · Follow Us on Twitter

Try Helvetica

Try Helvetica

The premise behind Try Helvetica is simple, yet elegantly executed: rework the world using just Helvetica in a series of lovingly crafted before and after images. Somewhere in the world Massimo Vignelli is smiling.

1313082480 · Christopher Murphy · Follow Us on Twitter


INDIANA [Detail]

If geography’s not your strong point you might like to pick up an American Flags Map, courtesy of These Are Things (home of some wonderful map-related merchandise). Silkscreened by hand in five colours with overprints and in a limited edition of 100, it’s tempting indeed and sure to sell out fast.

If you’ve a map lover in lover in your life, you might also like to point them in the direction of These Are Things, it’s a veritable cartographer’s cornucopia.

1313080680 · Christopher Murphy · Follow Us on Twitter

Daily Ampersand

& [Detail]

In a project reminiscent of Jessica Hische’s Daily Drop Cap, Jola Pez is creating an Ampersand a Day. Nice.

1312993800 · Christopher Murphy · Follow Us on Twitter

10,000 Brands

10,000 Lakes [Detail]

In a not inconsiderable effort to flex her branding muscle, Nicole Meyer is Branding 10,000 Lakes. One at a time, one a day, she’s branding Minnesota’s magnificent multitude of lakes (Minnesota, in case you weren’t aware is known as The Land of 10,000 Lakes (though the official count apparently puts it at 11,842)).

As she puts it: “It should only take a little over 27 years to hit ‘em all. Stay tuned and enjoy!”

The results to date are very nice indeed and, assuming Ms Meyer can maintain the pace for the full 27 years, will undoubtedly result in a fascinating body of work. This is definitely one to watch.

1312992900 · Christopher Murphy · Follow Us on Twitter

The 10K Apart Process

We started by having Reagan guide us… [Detail]

We’ve always found process posts to be both insightful and inspiring (as such we make a point of signposting them to our students to offer an insight into the design process). So, hot on the heels of our last post, we were delighted to discover a veritable cornucopia of process posts offering a behind the scenes look at the design of the latest 10K Apart – The Responsive Edition web site.

Generous to a fault, the team at Paravel have individually reflected on their processes, offering their unique insights into the project. Trent Walton, Dave Rupert and Reagan Ray all offer different viewpoints on the approach taken, however, collectively they present the different facets of a well-oiled studio working in beautiful harmony.

It’s great to see mood boards playing such a central role in the project – though it’s hardly a surprise to hear us saying that 1, 2 – and the real world inspiration the Paravel team draw from underlines the case for getting away from the computer occasionally. (As Reagan puts it: “Whether it’s a 1967 Mustang, a parts box for an old distributor or an owner’s manual for a 1965 Cadillac, we’re all over it.”)

Offering an additional perspective, Nishant Kothary – the project’s creative director (and information-architect-with-a-fascinating-belief-in-delightfully-unpredictable wireframes) – reflects upon the 10K Apart process in Back to the Future of Wireframes. Kothary’s post not only encompasses a wider array of themes, offering insight from a different angle, but – generously – makes the full functional wireframe deck for the project available to download as a PDF.

We’d urge you to download Kothary’s PDF, it offers a crystal clear insight into how wireframes need to evolve in a responsive, seemingly unwireframeable world. (We’d link to the wireframes here, but it’s better to read Kothary’s post first for context.)

Writing an opinion piece for MIX Online, Kothary offers additional insight in the last piece of the process jigsaw, containing further reflection on the Holy Responsiveness, Batman! process this year’s 10K Apart undertook.

Taken collectively, the various team members’ posts offer a real – and, dare we say it, unprecedented – insight into how multiple team members evolve an idea and execute a design from start to finish.

We’d urge you to set aside an hour and take a look at this year’s 10K Apart web site and, once you’ve had a chance to put the web site through its paces across a range of devices, read the various process posts linked to here, on its creation. We guarantee you, you won’t be disappointed and you’ll learn a great deal en route.

We’d like to thank the entire team involved for their comprehensive reflection upon the project. It’s precisely this kind of generosity that fuels our industry and enables it to move forward and grow. A heartfelt thanks is in order. Great work.

1312512000 · Christopher Murphy · Follow Us on Twitter

10K Apart – The Responsive Edition

10K Apart [Detail]

For the second year running, Microsoft’s MIX Online and An Event Apart bring back the spirit of the good old 5K challenge, last run in 2002. Doubling the number of kilobytes at your disposal, and introducing the allowance of a select number of sanctioned libraries, the 10K Challenge still looks like a worthy quest.

The first entry of the year Colorrrs, an exploration of Dribble through random colour selection, sets the tone nicely. Designed by the fine folks at Paravel, who also designed this year’s 10K Apart site, its a great idea delivered in a small package.

In an age of seemingly abundant bandwidth, it’s still worth remembering that you can do a lot with a little.

1312505280 · Nicklas Persson · Follow Us on Twitter

Domus Titling

Domus Titling [Detail]

Regular readers will be well aware we’re partial to a touch of rounded sans-serif typographic nourishment from time to time. Domus Titling, from Just Another Foundry (and now available on Typekit), satisfies the occasional craving nicely.

Tim Brown has, helpful as ever, put together some suggested pairings over at The Typekit Blog. (Domus with Rooney look particularly pleasing paired.)

1312502220 · Christopher Murphy · Follow Us on Twitter

See You at DrupalCon!

DrupalCon [Detail]

We’re delighted to be playing a big part of DrupalCon London 2011, taking place in the fine city of London between 22 and 26 August.

We’re honoured to have been invited to deliver one of the conference’s three keynotes, alongside Drupal’s original creator and project lead Dries Buytaert and prolific writer and journalist Tom Standage. Put simply, we’re in truly stupendous company (and also in the privileged position of getting to know more of the devoted Drupal community, after the pleasure of attending one of Drupal Belfast’s recent meetups.)

Our keynote is titled Designing the Sustainable Web and considers strategies designers and developers need to embrace to deliver a sustainable web that exists beyond the here and now.

In keeping with a theme we’ve been developing for some time through our teaching, we’ll focus on how, by marrying fundamental web standards with timeless design principles, we can create beautifully designed user experiences that embrace the full range of emerging technologies at our disposal.

We’ll consider how HTML5 and CSS3 offer today’s designers and developers a platform on which to build sustainable web presences for tomorrow. In short, to create a sustainable web - one that exists across a growing number of devices - that is designed not with short term goals in mind, but that is built from the ground up with longevity as its driving force.

If you had the good fortune to snap up one of the conference’s rapidly-sold-out tickets we’ll see you for our keynote on 25 August. We’ll be arriving the day before, so do come and say hello and ask us for some of our good ol’ fashioned Standardistas’ Schwag™.

1312488600 · Nicklas Persson · Follow Us on Twitter

@standardistas: Follow Web Standardistas on Twitter.