Workflow, mobile and SVG icons.
debugging mobile
For those of you who are distracted by four letter words, that's a pity, you're going to miss the important parts of this great presentation by Brian Leroux about mobile programming. Summary: it's a fucking mess, but Brian's got some great tips and links.
BDConf: Stephen Hay presents Responsive Design Workflow | Brad Frost Web
I really wished I was in Florida last week. Not because of the good weather – well, not only – but because I wanted to see this presentation by Stephen Hay. I think he will do a similar talk on Mobilism in a few weeks. Tickets are still available (and you'll get a 10% discount when you use this link)
Value created vs. time spent - Wolf's Little Store
A great article by Johan Ronsse about productivity and hierarchy in an office environment. I have to agree: when I'm at the office I can only be productive if I listen to music on my headphones but when I'm at home – especially when I'm working in my hammock – I get things done in a fraction of the time. If I lived in Antwerp I would definitely be talking to Johan right now.
Future Friendly Style Guides // Speaker Deck
The responsive workflow can be hard, especially in bigger teams of specialists. Some parts of the workflow are getting clear: we need sketches, prototypes, style tyles, and, according to this excellent presentation by Luke Brooker, we need style guides.
A New Experimental Feature: scoped stylesheets - HTML5Rocks Updates
Scoped stylesheets can be very handy for widgets or components that should be styled but can be placed on all sorts of sites. Alex Danilo explains how it works and how you can use it right now.
Twitter / @drewm: Browser web dev tools need ...
Here's a nice idea by Drew McLellan for a developer plugin. Let me know when you made it.
CSS3 Box Shadow Builder
Here's a handy tool to create CSS box-shadows, and this one does not try to mimic Photoshop, which is good, because you can do much more with CSS box-shadows. Designers should bookmark this.
Scaling with EM units
Some designs just look great, all parts are in proportion and all elements are in balance with each other. In those cases you might want to use ems to scale your design, as Viljami Salminen explains. I actually use this exact technique on my own site but I was just too lazy to write about it. If you ever meet somebody who doesn't understand why you should use ems and never use px, point them to this article.
Mobile users don’t do that | Stephanie Rieger
Absolutely brilliant post by Stephanie Rieger about the often heard remark: Mobile users don’t do that
, to which Stephanie answers: This is true, except when it’s not.
. Must read, and you must recommend this article to people who don't get it yet, saves you a lot of discussion.
A responsive experience begins on the server... [Legends of the Sun Pig - Martin Sutherland's Blog]
Device detection on the server can be a start for websites but it's not enough, explains Martin Sutherland, there are just too many things you can't assume.
Fighting the Space Between Inline Block Elements | CSS-Tricks
Chris Coyier shows us the different ways to eliminate white space when using display:inline-block. I commented about a complex solution I came up with a while ago.
Skip links on mobile and tablets | » Henny Swan's blog
Henny Swan says you should not use the classical skip links, not on the desktop and not on desknots, there are better ways to make your content accessible. I agree, even though I want to point out that she also gives the excellent advice to use visible anchored links on small screens.
Bruce Lawson’s personal site : Reading List
If you need more stuff to read – hey, it's Monday, don't hurry – here's an excellent as always reading list by Bruce Lawson.
Triangle With Shadow | CSS-Tricks
How to create a triangle with a shadow in CSS. Chris Coyier shows us three ways to do that.
Can Assistive Technology Make a Website Accessible? | Karl Groves
Even in the best case scenario, assistive technologies can only render information to the user that is available from the system
even if some companies claim their product can do magic. Karl Groves explains.
Adactio: Journal—AudioGO
A copyright troll has asked Jeremy Keith's host to remove a page that links to… a 404-page! He rightly reminds the troll – Robert Nichol – that it is illegal to abuse the DMCA. Crazy.
Bruce Lawson’s personal site : What Users Want from Mobile, and what we can re-learn from them
Bruce Lawson explains why we should really test our sites on as many mobile browsers as possible, not just the usual webkit based browsers. Another thing he urges us to do is to focus on performance.
Link Dump
A very good eclectic collection of links by Blair Millen with performance tools, an article about designing in the browser, and much much more. You should click.
CSS Compatibility and Internet Explorer
Here's the official overview of CSS compatibility in different versions of Internet Explorer. So if you ever wonder what pseudo-elements are supported in IE8 and what selectors work in IE7, here's the page to look at.
CSS image replacement with pseudo-elements (NIR) – Nicolas Gallagher
I thought a technique like image replacement was perfected by now but Nicolas Gallagher shows us that all along we were doing it wrong. Here's how to do it.
Bret Victors “Inventing on principle” – and a few things it inspired ✩ Mozilla Hacks – the Web developer blog
One of the best talks I saw lately is the talk inventing on principle by Bret Victor. If you haven't seen it you should. Here are a few videos of projects that were inspired by this talk.
Opera Developer News - How media queries allow you to optimize SVG icons for several sizes
A while ago people were tweeting about SVG and that it's not the right format for icons because everything scales, including strokes and outlines. Andreas Bovens shows us in this amazing presentation (it gets good after a while, really good) that you can use mediaqueries in SVG and he has some excellent news about the viewport-size of SVG images. A must see. The examples can be found right here (and they only seem to work in Opera, the slider does not work in Chrome or fall back well for Firefox). Enjoy!
The 501 Developer Manifesto
If you read all these blogs and linklists you might get the impression that everybody in our business is a complete workaholic. We're not. I might seem to be one but I certainly recognize myself in this 501 Developer Manifesto.
Adactio: Journal—Pattern primer
A handy little tool for component based development by Jeremy Keith