Vitaly calls them dirty tricks but this is a handy collection of front-end development techniques. They’re not really dirty …just slightly soiled.
An examination of how sites like The Session are meshing with older ideas of traditional Irish music:
There is a very interesting tension at play here – one that speaks directly to the design of new technologies. On the one hand, Irish musicians appear to be enthusiastically adopting digital media to establish a common repertoire of tunes, while on the other the actual performance of these tunes in a live session is governed by a strong etiquette that emphasizes the importance of playing by ear.
There’s an accompanying paper called Supporting Traditional Music-Making: Designing for Situated Discretion (PDF).
I love this. I really love this. Remy absolutely nails what makes the web so great.
There’s the ubiquity:
If the viewer is using the latest technology beefy desktop computer that’s great. Equally they could view the website from a work computer, something old and locked in using a browser called IE8.
Then there’s the low barrier to entry—yes, even today:
It’s the web’s simplicity. Born out of a need to connect documents. As much as that might have changed with the latest generation of developers who might tell you that it’s hard and complex (and they’re right), at the same time it is not complicated. It’s still beautifully simple.
Anyone can do it. Anyone can publish content to the web, be it as plain text, or simple HTML formed only of <p> tags or something more elaborate and refined. The web is unabashed of it’s content. Everything and anything goes.
I might just print this out and nail it to the wall.
If you sit back for a moment, and think about just how many lives you can touch simply by publishing something, anything, to the web, it’s utterly mind blowing.
When another company achieves success, there’s a lot of pressure to investigate what they did right and apply that to our own organizations.
But we still have a chance. As long as we run brave organizations made up of even braver souls who are willing to embrace expression, trust their intuition and experiences, and stand up when everyone else is sitting down, we will survive.
Some thoughts on progressive enhancement, although I disagree with the characterisation of progressive enhancement as being the opposite choice to making “something flashy that pushes the web to it’s limits”—it’s entirely possible to make the flashiest, limit-pushing sites using progressive enhancement. After all…
it’s much more a mindset than a particular development technique.
A really good introduction to front-end performance techniques. Most of this was already on my radar, but I still picked up a handy tip or two (particularly about DNS prefetching).
At this stage it should go without saying that you should be keeping up with this kind of thing: performance is really, really, really important.
A lovely bit of hypertext.
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.
Mark talks about design criticism. This makes a great companion piece to the Jon Kolko article on design criticism that I linked to last week.
Jon Kolko shares his advice on accepting design criticism.
See now, this is why liquid layouts are the way to go.
Emily walks us through a responsive design case study, stressing the importance using percentages for layout.
Luke catalogues layout patterns in responsive designs.
Here’s a geek advent calendar I missed. There are some great CSS techniques here.
A set of default styles to get started on a mobile-first responsive design.
On the importance of using fluid grids as part of responsive web design:
We do responsive web design, but we don’t do it for the sake of being trendy. We do it because we believe it’s the way websites should be made. This is an opportunity for us to finally embrace the dynamic medium we build for. The web is not fixed width.
Some good ideas for formatting tabular data for small screens.
A nice round-up of responsive design techniques, with a particular focus on content first.
More documentation of a responsive redesign, this time from Trent Walton. Be sure to check out the FitText jQuery plug-in that was created as a result.
Documenting the process of switching to a responsive design. I think there’s always insight to be gained from seeing how your peers are approaching these challenges.
Some nice drop-shadow effects. Generated content is the key.
Anna’s redesign is beautiful, no matter what browser or device you’re using.
A beautiful new responsive design from Mark.
37 Signals document their experiments with responsive web design. Looking good.
A beautiful reminder.
This is the way to do an adaptable liquid layout. Media queries are your friend. Oh, and the content's good too.
I'll take any excuse to watch the opening of Touch of Evil — I don't think it'll ever be topped.
How to draw a font with a car. With. A. Car.
Black ink meets water.
Ethan follows up his Fluid Grids article with an equally excellent piece on resizing images.
Superb article by Ethan on calculating percentages for liquid layouts. Read it. Do it.
A superb article by Bryan Rieger on designing for multiple screen sizes. The closing section makes it clear that if you care about mobile, you'd better get comfortable with liquid layouts fast.
Philip Ball (author of the excellent Critical Mass) is coming to Brighton to speak at the CafÃ© Scientifique on the third Thursday of November. Excellent!
A huffduffer plugin for Ubiquity: "This simple script allows you to huff duff any mp3 file simple by invoking Ubiquity and typing 'huff-duff-it'."
Just for the record, this is a superb example of a bulletproof liquid layout: Simon Wiffen, solo acoustic singer-songwriter from Leeds.
Ethan has redesigned. It's shiny and beautifully proportioned.
A wonderfully informative and useful look at paragraphs styles ...in history and in CSS.
Nice QR code patches (I don't mean something that patches code, I mean a patch that you sew).
Here's a very handy CSS technique for floating a group of objects edge to edge. I've been in this situation quite a few times in the past.
Good typography + stylish grid + liquid layout = WIN!
Check out the redesigned site for the podcast from Jon and John. Acknowledge the divinity in its gloriously liquid splendour. Smashing work, chaps!
Did you notice that Upcoming recently switched from liquid to fixed? Have your say about that here.
Christian talks to Aral and Niqui about Flash and accessibility.
Dave redesigns. And before I could bash him for his wide fixed width layout, he went and added a Jeremy Keith Button® on his about page that toggles between liquid and fixed. Cheeky bugger.
Roger hits the nail on the head: "fixed widths are used for the wrong reason - designer vanity. Come on, you’re designing for the Web, which means it’s your job to let things be flexible when you can."
Me? I'm just pee-shy. From The Meaning of Liff: KETTLENESS (adj.) The quality of not being able to pee while being watched.
The devil can cite scripture for his own purpose... and now I can cite Nielsen: "...use a liquid layout that stretches well for any resolution, from 800x600 to 1280x1024."
Andy Rutledge proposes a new design for Amazon, saying "Many of these issues can be fixed and/or addressed by adopting a fixed layout." What a load of bollocks. Try doing a liquid layout right.
Design review by Jay Small.
This is something I always meant to do but never got around to: a gallery site for good liquid design.
Slides from Ben Hammersley's talk at Reboot 7 in Copenhagen. I can't wait for the MP3.
I've been suckered into another debate on fixed width layouts: "Discussing whether 800 is better than 1024 is like discussing whether Coke is better than Pepsi when all you really want is a nice drink of water."
Roger Johansson details his elastic design.