Thursday 1: The Web Standardistas, "Designing the Sustainable Web"


Surveying the landscape; what's the secret formula?


Book recommendations:

HTML5 for Web Designers

Grid systems Mueller-Brockman

Ordering Disorder Khoi Vinh


Sustainable web - developing for the future

Landscape: high-traffic. Big changes - proliferating devices: we go deeper into content when we consume on desktops. Timescale of content you're delivering has to shift. Content shifting - bandwidth varies. Content consumed differently throughout lifetime: read at work; read on phone; tablet on bus; maybe even print out


Sustainable web: content with longevity. Secret formula: beautiful markup and correct design. It's not *just* sprinkles on top


Iterative design, implementing every CSS3 thing you can think of in turn. This shows you care, but where did the fundamental principles go?

Establish a hierarchy of the page: composition; grid systems, ratios, typography. Add meaning to the page with semantic markup; device independence was once a founding principle!

Iceberg metaphor - what you eventually see on the page is above the water


1991 - First ever webpage. 24 days later - more progress than in 21 years since

2000 - Jeffrey Zeldman web standards project - back to where it should be, away from proprietary extensions. Remember: this was the time of the DANCING BABY. But also the time of the Web Standards Project (WaSP). If a high traffic site like Wired can use CSS1, then why can't the rest of us? Laying down the gauntlet of device independence

2001? - Dave Shea, CSS Zen Garden - "this is what can be done when we separate content from layout"]

Next decade: Chairman Hickson; W3C identified HTML5; Fancy logo and everything.


HTML is semantic, but it's also a design element. Semantics are design elements; they provide hierarchy. So back to design


1930? - Jan Tschichold - clean systems of design. The New Type (die neue typographie) [Exists out of time? Really? It looks a bit like a Penguin edition of Aldous Huxley...!] Still learn from principles - golden section & other composition. Limited palettes.

1958 - Muller-Brockmann - Grid Systems

2000 Khoi Vinh

1950 - clear hierarchy; 2011 - TypeKit blog Frank Camiro - very similar in layout


Marriage made in heaven, of the old and the new, the semantics and the composition. Great markup; adaptive layouts. Grid systems, but intelligently used. Restrained colours. Think about more than just the looks or the content alone.