Good design and good markup provide structure to content. Good markup is a fundamental part of good design: beautiful on the inside, beautiful on the outside. HTML and CSS give another venue to provide structure to content in the native language of the web, and learning these guides decisions by surfacing the affordances of the medium.
Tuesday, August 30th, 2011
Monday, August 29th, 2011
Hacking science: the intersection of web geeks and science geeks | Guest Blog, Scientific American Blog Network
Ariel pens a guest post for Scientific American all about Science Hack Day.
We played at the bottom of the art-deco staircase in Bexhill’s De La Warr Pavilion. Sounds pretty good, if I do say so myself.
The first book by this publisher is “HTML For Babies.”
A wonderful reminder by Kevin Kelly of the amazing interconnected world we live in, thanks to network effects.
I wonder if it’s the use of class names or jQuery that allows it to work here?
Sunday, August 28th, 2011
A superb post by David that ties together multiple strands of personal digital preservation through homesteading instead of sharecropping.
Friday, August 26th, 2011
A nice Huffduffer-style mad libs form gives this registration form a friendly quality.
Thursday, August 25th, 2011
If you’re trying to retrofit an existing desktop-centric site for small screens, this server-side image-resizing technique might be useful but is definitely not the right tool for a content-out, small-screen-first approach.
In a break with tradition, Paul posts something sensible and smart (I kid, I kid): using media queries to detect height rather than just width and adjust content accordingly to make sure that your most important content is visible in the viewport.
Stewart Brand wrote this twelve years ago: it’s more relevant than ever in today’s cloud-worshipping climate.
I’d like to think that it’s ironic that I’m linking to The Wayback Machine because the original URL for this essay is dead. But it isn’t ironic, it’s horrific.
Amber documents her attempt to turn physical objects imbued with meaning into digital artefacts.
This is something we’ve previously had to build from scratch at Clearleft so it’s nice to see an off-the-shelf solution.
Wednesday, August 24th, 2011
A truly impressive achievement by Archive.org: all the television footage from September 11th, 2001 gathered in one place on the web.
Tuesday, August 23rd, 2011
A great idea from Jessica Hische: find a good printer in your area. It’s beautifully designed and executed, with a lovely dollop of responsiveness.
This abuse of the !important declaration in Firefox’s user-agent stylesheet was driving me crazy recently. Roger proposes a CSS patch, but this is really something that needs to be fixed in the browser.
Those lovely BERG chaps profiled in the New York Times.
Sunday, August 21st, 2011
If you’re going to have a photo-shoot for your engagement, this is the way to do it.
A joint effort by the Tau Zero Foundation and the British Interplanetary Society to research the design of an interstellar spacecraft.
I, for one, welcome our autonomous swarming robot overlords.
Accidental camera drops serve a purpose as part of a larger narrative.
Saturday, August 20th, 2011
Once again I’m getting all my CSS3 information from Jonathan. This time he’s discovered the vw and vh units which allow you to specify sizes relative to the size of the viewport.
Jake’s talk at DIBI earlier this year was absolutely fantastic. It features a rape reference, a story about pissing, and a Human Centipede metaphor.
It’s also very, very informative. Watch this.
Samantha gives the rundown of a hands-on use of Style Tiles.
Bootstrap is Twitter’s CSS and markup style guide—very similar to the pattern portfolios that we often provide as deliverables at Clearleft.
Dan gives his pragmatic perspective on making Dribbble more adaptive. Baby steps.
When time, resources and funds are more abundant, I’d love us to rethink things in a more holistic manner, but for now incremental improvements will keep us moving.
Friday, August 19th, 2011
The video of my talk/rant at the DIBI conference in Newcastle/Gateshead earlier this year, for your viewing pleasure.
A crowd-funded, creative commons licensed sci-fi film currently in production.
Thursday, August 18th, 2011
A valiant attempt to polyfill support for hyphenation in browsers other than the latest Safari and Firefox.
A very clever and tricksy way to sync up multiple devices so that when you refresh a URL or follow a link on one, it happens on all of them. It uses OS X’s Internet Sharing feature combined with locally-hosted Node.js. It’s positively McGyverian!
Wednesday, August 17th, 2011
I’m usually not a fan of CSS “frameworks” but I like the thinking that’s gone into this fluid, responsive system. I particularly like this advice:
Take it apart, steal the parts that you like, and adapt them to your own way of working.
A truly lovely responsive design from Tiffany Duening and co.
Finally. Hyphenation on the web.
Pretty much the only forms of Western literature that don’t use hyphenation are children’s books and websites. Until now.
Insanely in-depth look at how browsers work, right down to the nitty gritty. You’d think there’d be a lot of engineering talk, but actually a lot of it is more about linguistics and language parsing.
Tuesday, August 16th, 2011
A brave attempt to explain the new outline algorithm in HTML (although it inaccurately states that no browsers have support for it—Firefox shipped with it a while back).
You can safely skip the comments: most of them are discouraging, ignorant, and frankly, just plain stupid.
This is a thoroughly enjoyable, frustratingly addictive two-player game for the iPad.
Monday, August 15th, 2011
An alternative to showoff.io for sharing your locally-hosted sites.
Jessica Hische has redesigned her site in a lovely and responsive manner.
A handy one-page cheatsheet for using HTML5’s appcache manifest file for offline storage.
A gorgeous adaptive (though not quite responsive) design …and it’s all about food.
Sunday, August 14th, 2011
I recommend you look through all of Paul’s presentation …because they’re all excellent.
Saturday, August 13th, 2011
Friday, August 12th, 2011
A documentary about the weekly session in Dempsey’s pub in Manhattan.
A cute idea: see how signs (mostly in Brazil) would look if they were set in Helvetica.
In an attempt to “optimise” performance, T-Mobile and Orange are actually breaking jQuery.
This is a match made in heaven: the brilliant Jake Archibald is joining the brilliant Lanyrd.
So that’s what they were filming when I came out of band practice the other day. This is my neighbourhood.
Wednesday, August 10th, 2011
There are some inaccuracies and misrepresentations in here, but on the whole this is a pretty good round-up of your options when dealing with responsive design in older browsers.
Tuesday, August 9th, 2011
Humour through noun permutations. The results are all-too believable.
I know this is probably inappropriate (comedy is tragedy plus time) but I am getting quiet a giggle out of this. I know, I know: too soon.
A rallying cry from Russell, urging us not to rely too much on the intangible.
This is not as linkbaity as the title might suggest.
I’ve suggested the term “exploitationware” as a more accurate name for gamification’s true purpose…
Monday, August 8th, 2011
A lovely little social experiment: you can buy a Starbucks coffee with Jonathan Stark’s card; you can also top up the card. You can track the card balance on Twitter.
Now this looks like a fascinating project …and there’s a symposium happening in Florida at the end of September with Jill Tartar, Stewart Brand and more. I want to go to there.
Facebook will destroy your children’s brains | by Martin Robbins @mjrobbins | Science | guardian.co.uk
A pitch-perfect parody of people that peeve.
Tantek’s braindump of research he and Erin have been doing on web actions—verbs for the web, specifically interactions across sites: sharing, liking, and so on. I agree with him that this terminology feels better than “web intents.”
Some great, considered thoughts from Mark on how CSS Grid Layout could work as part of a larger tradition in design.
Erin documents the next step after web intents.
A lovely little ode to the manicule.
Sunday, August 7th, 2011
A really nice little primer on getting started with HTML5.
This is wonderful. A web server powered by people. Change the URL and a person will manually fetch the corresponding resource.
You can be part of the server team too.
Saturday, August 6th, 2011
So long, Juno. Call me when you get to Jupiter.
Friday, August 5th, 2011
A great reminder from Bruce that we need to remember to use cutting-edge web technology responsibly.
A quick overview and explanation of web intents.
- Can I bookmark this information? (stable URIs)
- Can I go from here to there with a click? (hyperlinks)
- Can I save the content locally? (open accessible formats)
John tells you everything you need to know about CSS animations and transitions, and then he gives you a tool to help you get started.
Thursday, August 4th, 2011
The importance of structured content for longevity and responsiveness.
Listen to Josh explain a genuinely useful example of HTML5’s local storage that he’s added to Fontdeck.
Just when you thought it couldn’t get any worse than “webinar.”
Wednesday, August 3rd, 2011
Wonderful musings from Matt on meeting the emerging machine intelligence halfway.
Tuesday, August 2nd, 2011
Journal of Emerging Investigators | JEI is a scientific journal for middle and high school scientists.
A great responsive design from Scott Jehl for a publication aimed at young science hackers. Notice how the interactions change according to available screen real-estate.
I wholeheartedly agree with this summation of what professional web design and development entails.
What a great way to sell a book with “explorations” in the title—play around with the font size, leading, alignment (and browser window size).
Monday, August 1st, 2011
Some great thoughts on the language of the web.
I really like this proposal to allow for more nuanced linking using CSS selectors in fragment identifiers (though I worry about the overloading of the # symbol in URLs).