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.
A short piece on the experiment that James conducted with Lighthouse in the foyer of the Cleareft office building, trying to show some kind of physical representation of coding.
A great article by Hannah, focusing on the Long Web—it isn’t about the quantity of data you’re publishing; it’s the quality. This builds nicely on the article I linked to recently about digital scarcity.
A nice visualisation of Apple’s transition From desktop to mobile over ten years, one Daring Fireball article at a time.
Oh, and happy birthday, Daring Fireball.
I’m going to be attending Seb’s CreativeJS and HTML5 course in Brighton on September 13th and 14th …and I strongly suspect that it’s going to be great.
A thoroughly addictive use of the Instagram API (along with Node.js and Socket.io): see a montage of images being taken in a city right now.
A little something to whet your appetite for dConstruct: Scott’s superb talk from this year’s Mobilism conference in Amsterdam.
Another beautiful timelapse video made from photographs taken from the International Space Station.
The music from Sunshine gets me every time.
This looks like a really handy tool for reducing the file size of JPEGs without any perceptible loss of quality (in much the same way that ImageOptim works for PNGs)—available as a Mac app or an installable web service.
A great talk on the nature of the web that Paul gave in Copenhagen recently.
Yet another brilliant technique from Dave. The only caveat is that it uses background images rather than img elements, but it’s still very powerful (and very clever).
The Old Aesthetic. It’s eighties-tastic!
This is how London looked on my birthday, as recorded by the stationary meatspace protrusion of James’s Ship Adrift.
Here’s a brainbuster for ya: a single file that renders both as HTML and as a JPEG. As an HTML page, it even contains an img element with a src of …itself!
Compare the “view source” output with the generated source output to see it’s being interpreted.
Aegir’s portfolio is a thing of a beauty on every screen size.
Aegir is doing some very smart image enhancement in his (responsive) portfolio. Here’s the explanation.
A nice timeline visualisation of recent history.
A beautiful short film about The Long Now Foundation’s Rosetta Project.
This resonates deeply with me. It is worth your heartbeats.
I didn’t count how many heartbeats it took to read this, but it was worth every single one.
I love Tim Bray’s idea for naming the response code for censored content on the internet in honour of Ray Bradbury.
This is sooo nifty: Chloe’s obsessive Summer music visualisation is a lesson in responsive design and progressive enhancement. It’s also pretty fascinating.
Wilto does an excellent job of summarising the current state of responsive images, highlighting Florian Rivoal’s compromise proposal that combines the best of the picture element with the best of srcset.
Some good practical advice on improving performance. This should all be familiar to you, but it’s always worth repeating.
This is rather wonderful: a DevFort project for navigating interweaving strands of history, James Burke style.
A nice round-up of the issues around responsive images and their potential solutions.
Some of these hacks created at the Science Hack Day in Eindhoven are seriously nuts. That’s “nuts” as in “brilliant”.
Beautiful time-lapse photography from Don “we’ve got a Dragon by the tail” Pettit, taken from the International Space Station.
If you’re adding some noise texture to your backgrounds, this little service might be handy. I usually base-64 encode these kinds of background images: it would be nice to see that added as an option here.
The way that Chloe has catalogued her music over time is fascinating. It’s like the Long Now opposite of This Is My Jam.
A fascinating insight into the psychological implications of animated progress indicators.
The lovely (and responsive) Great Discontent site has a lovely interview with Dan, who is lovely.
A run-down of the various approaches to the responsive images problem, concluding that this is something that needs to be solved in the image format.
Jason outlines the real challenge to every proposed solution for responsive images: they just don’t jibe with the way that browsers (quite rightly) pre-fetch images.
A well thought-out evaluation on responsive images from Bridget.
Trent offers some excellent advice for dealing with the effects of the iPad’s retina display on your websites. That advice is: don’t panic.
An idea for handling responsive images not with a new format, but with an existing one: progressive JPGs.
An in-depth analysis (graphs! data!) of how popular sites are using—or not using—compression.
Some practical advice for optimising your images on the web.
The Old Aesthetic.