The alphabet illustrated with CSS.
Nice! A Yeoman generator for scaffolding your own pattern primer.
(Those are just words, aren’t they? Y’know, as opposed to a sentence that would actually make sense to most right-thinking people.)
This fun-looking short film—funded by Brighton’s Lighthouse Arts—is screening at the Duke Of York’s Cinema on Saturday, March 1st followed by a panel discussion with the director and science-comedienne Helen Keen.
Another front-end style guide for the collection. This time it’s from A List Apart. Lovely stuff!
This tool for building ScrAPIs is an interesting development—the current trend for not providing a simple API (or even a simple RSS feed) is being interpreted as damage and routed around.
Some sensible thinking from Tim on measuring performance gains.
Expanding on an exercise from last year’s Hackfarm, Brian and Mike have written a deliciously dystopian near-future short story.
The video of my closing talk at this year’s Full Frontal conference, right here in Brighton.
I had a lot of fun with this, although I was surprisingly nervous before I started: I think it was because I didn’t want to let Remy down.
John shares his concerns about the increasing complexity involved in developing for the web.
This was my favourite moment from the Handheld conference in Cardiff.
This is handy: a version of my pattern primer that can be run with Grunt.
This is the talk I gave at the border:none event in Nuremberg last month. I really enjoyed it. This was a chance to gather together some thoughts I’ve been mulling over for a while about how we approach front-end development today …and tomorrow.
Warning: it does get quite ranty towards the end.
Also: it is only now that the video is released that I see I spent the entire talk looking like a dork with a loop of wire sticking out of the back of my head.
The markup for the patterns that Mailchimp use on their products. I love getting a glimpse of how companies handle this kind of stuff internally.
A superb piece of hypertext from The Guardian.
Have you tried turning it off and on again?
I heartily concur with Lyza’s mini-manifesto:
I think we need to try to do as little as possible when we build the future web …putting commonality first, approaching differentiation carefully.
It’s always surprised me how quickly developers will reach for complex, potentially over-engineered solutions, when—in my experience—that approach invariably creates more problems than it solves.
Simplicity is powerful.
A report from the BBC on this year’s Brighton Digital Festival including interviews with Honor, Timo, and Seb.
Iain M.Banks and dConstruct, together at last.
A timeline of technology.
Some examples to illustrate the UK Border Agency’s latest campaign.
Scenes from a future Sweden.
Alas, that clever SVG fallback trick I linked to a couple of days ago has some unexpected performance side-effects.
Improve your word power: here’s a timeline of terms used to describe male genitalia throughout history. And yes, there is a female equivalent.
A very, very clever hack to provide fallback images to browsers that don’t support SVG. Smart.
Surfin’ Safari - Blog Archive » Improved support for high-resolution displays with the srcset image attribute
WebKit nightlies now have support for
srcset. I’m pleased to see that it’s currently constrained to just handling the case of high-density displays; it doesn’t duplicate the media query functionality of
I’ve always maintained that the best solution to responsive images will be some combination of
picture: they each have their strengths and weaknesses. The “art direction” use case is better handled by
picture, but the “retina” use case is better handled by
Beautiful animated GIFs showing the lungs of our planet.
I like this theory!
Sit back, relax, and enjoy this classic documentary on graphic design, courtesy of its producer Edward Tufte.
The closing hot topics panel I moderated at this year’s Mobilism conference in Amsterdam, featuring Remy, Wilto, Jake, and Dan.
This is a really nice and simple idea: view photos from a specific place taken at a specific time. Voyeuristic fun.
The line-up for this year’s Improving Reality conference looks great (as always).
It’s the day before dConstruct so why not come on down to Brighton a day early and double your fun?
Oh, no! How horrid! Now Twitter won’t control the “user experience” of that widget!
Instead, the person who actually posted the tweets in the first place gets to decide how they should be displayed. Crazy idea, isn’t it?
A terrific case study in progressive enhancement: starting with a good ol’ form that works for everybody and then adding on features like Ajax, SVG, the History API …the sky’s the limit.
I gave the opening keynote at the Beyond Tellerand conference a few weeks back. I’m talked about the web from my own perspective, so expect excitement and anger in equal measure.
This was a new talk but it went down well, and I’m quite happy with it.
My presentation from the Industry conference in Newcastle a little while back, when I stepped in for John Allsopp to deliver the closing talk.
A terrific quiz about browser performance from Jake. I had the pleasure of watching him present this in a bar in Amsterdam—he was like a circus carny hoodwinking the assembled geeks.
I guarantee you won’t get all of this right, and that’s a good thing: you’ll learn something. If you do get them all right, either you are Jake or you are very, very sad.
Carousels are shit. Auto-animating carousels are really shit. Now proven with science!
A comprehensive look at the current state of things in the world of responsive design, with a look to possible future APIs.
A handy walkthrough of using icon fonts. The examples here use the excellent IcoMoon service
A lovely little highlight reel that Craig put together from the Responsive Day Out.
Some good thinking from Jason here. In a roundabout way, he’s saying that when it comes to responsive images—as with just about every other aspect of web development—the answer is …it depends.
A long-zoom data visualisation.
Some thoughts (and code) on responsive images.
A design fiction video depicting technology that helps and hinders in equal measure.
A beautiful short film on the amazing work being done at the Internet Archive, produced on the occasion of their 10 petabyte celebration.
Celebrating 125 years of National Geographic, this Tumblr blog is a curated collection of photography from the archives. Many of the pictures are being published for the first time.
Who knew? The reissue of the classic thirteen-part Star Wars radio series was the first appearance of a proto-Proxima Nova.
This powerful timeline illustrates how drone attacks have increased dramatically under Obama’s administration.
A really lovely piece on the repositories of information that aren’t catalogued—a fourth quadrant in the Rumsfeldian taxonomy, these dark archives are the unknown knowns.
Chris takes a look at all the different ways you can use SVG today.
Slides, videos, and links from Paul’s presentation at the Responsive Day Out.
A very hand tip from Ben on using SVG background images with a PNG fallback for IE8 and below.
Funny and painful in equal measure.
This is a pretty wacky experiment in altering font size based on the user’s distance from the screen (allow the page to access your camera and enable the “realtime” option for some real fun). I don’t know how much real-world application this has, but it’s a cute’n’fun exercise.
Everything you ever wanted to know about using SVG today.
A search engine for animated gifs. Oh, yes.
Communal satellite eyes. A Mac screensaver is also available.
I, for one, welcome our slime mould overlords.
The slime mould is being used to explore biological-inspired design, emergence theory, unconventional computing and robot controllers, much of which borders on the world of science fiction.
Spimify your household with these bluetooth location stickers. Now you can google your shoes.
Gorgeous colour-processed images from NASA probes. I could stare at the fountains of Enceladus all day.
Lauren talks about The Shining Girls and the tools she uses to write with.
A well-written white paper on time travel. Alas, it relies a bit too much on semantic nitpickery to offer any real insight.
This off-canvas demo is a great practical example of progressive enhancement from David. It’s also a lesson in why over-reliance on jQuery can sometimes be problematic.
The latest project from Zooniverse is, as you would expect, an extremely enjoyable and useful way to spend your time: classifying animals that have captured in camera trap images.
The opening tutorial is a lesson in how to do “on-boarding” right.
A beautiful timelapse visualisation of code commits to Flickr from 2004 to 2011.
A gorgeous collection of experiments that showcase just how much is possible in browsers today.
A cute little service for mocking up pictures of your site being used on different devices. Just drag and drop a screenshot on to an image.
Excellent journalism combined with excellent art direction into something that feels just right for the medium of the web.
A well-reasoned argument for tackling image optimisation on the server, using content-type negotiation.
A short film about interaction design.
A really nice interactive timeline of data from ten years of scrobbling music to Last.fm.
Gorgeous pictures from the Suomi satellite, just released by NASA
Ethan’s excellent talk from last year’s An Event Apart.
In this session Ethan reviews strategies for handling trickier elements that would make even the most seasoned designer quail: stuff like advertising, complex layouts, deep navigation patterns, third-party media, and, yes, actual, honest-to-goodness content.
Don’t do it. Don’t click that button just one more time. Don’t.
This is my opening talk from Smashing conference a few months back in Freiburg, where I used to live.
This is a great free service for generating small subsetted icon fonts. Launch the app and have a play around — you can choose from the icons provided or you can import your own SVG shapes.
Nice touch: you can get the resulting font (mapped to your choice of unicode characters) base-64 encoded for your stylesheet.
A great in-depth description by Paul of how he optimised his site. More of this please!
You’ve probably seen this already, but it’s really worth bearing in mind: when you’re scaling up JPGs for retina display you can safely reduce the image quality by quite a lot—to the point of getting the exact same file size as a higher quality image that’s half the size.
The state of the art in animated gifs: full-screen and scrubbable. Kiss your productivity goodbye.
Peter Saville talks about the enduring appeal of his cover for Unknown Pleasures.
I like to think of all the variations and mashups as not just tributes to Joy Division, but tributes to Jocelyn Bell Burnell too.
This is the talk I gave at the Webdagene conference in Norway a few weeks back. I called it Responsive Enhancement but I think the Norwegian title translates as “Improvements Through Responsive Design.”
A one-stop-shop for browser-compatibility information. This is MDN, HTML5 Rocks, and Quirksmode all rolled into one.
A well-executed sci-fi short film on augmented reality and gamification.
It might seem like an obvious point, but what Tim is talking about here happens over and over again: a technique is dismissed based on bad implementation.
A great in-depth explanation by Aarron on why Mailchimp dropped their Facebook and Twitter log-in options. Partly it was the NASCAR problem, but the data (provided by user testing with Silverback) also brought up some interesting issues.
At least one of these will probably drive you crazy.
The kickass articles just keep on comin’. This one from Dave is a great overview of options for dealing with images in responsive designs.
A really great article from Paul that simultaneously takes a high-level view of the web while also focusing on the details. A lot of work went into this.
This is right up my alley: a timeline of the history of hypertext, starting with Borges.
A great collection of layout, navigation, and interaction patterns for responsive sites, delivered by Brad.
Note’s from Joanne’s presentation at Improving Reality.
The opening keynote from Warren Ellis for this year’s Improving Reality. I’d like to walk into space with this man.
This is a rather lovely history of the first two years of Lanyrd, starting with that honeymoon-turned-startup.
I really like the way that Lanyrd’s communications reflect the personalities of Simon and Nat: utterly brilliant, but also a little bonkers, with far more animals than would be reasonably expected.
The not-so-new-but-hella-fun aesthetic.
Tom describes his Foursquare ghost.