Image sprites are a great, basic, performance win, especially when it comes to icons. But with some iconography moving to SVGs, what to do? Chris Coyier shows how SVG Fragment Identifiers work like SVG sprites!
With all the articles flying around about srcset and picture now arriving in modern browsers, here is a great walk-through on actually implementing these new features, in a real-life scenario, including which to choose, when, and why.
19 iPhone Tricks And Tips. The full title of the article is annoying link-bait, but these are actually all great tips for iPhone users!
So, the next time you have like a month of free time, have a look at this seemingly-never-ending list of CSS resources, from simple to advanced.
From Addy Osmani comes TMI. No, not that TMI. Addy’s is “Too Many Images“, a command-line utility that analyzes a URL for the number of images, compares that number to the HTTP Archive average (not sure if that’s really useful, or even helpful), then notifies you of any images that could be optimized further.
In my opinion, UX is still a field that has yet to be recognized, and implemented, everywhere it should be. But if you happen to be one of the lucky ones that has a chance to bake UX testing into your projects, here is a walk-through for mobile UX testing.
And speaking of UX, Luke Wroblewski talks about enhancing tap interfaces with Fluid Touch Gestures. TL;DR: Allow touch-interface users to tap-and-drag to the next “touch hotspot”, converting a bunch of tap-tap-taps into tap-drag-drags. Would take some learning I think, but the end result reminds me of the Swype keyboard, which is said to be much quicker than standard typing…
And speaking of Luke Wroblewski, his From the Front Lines of Multi-Device Web Design presentation from WordCamp SF 2014 starts off quite well, I especially like the “expando” chart at about 3:00, but then my laptop fan went nuts and everything nearly crashed, I imagine thanks to WordPress.tv having served this video via a Flash player… Who still does such things???
I imagine most devs today are quite familiar with console.log, but did you know there are lots of other features hidden under the console hood? Have a look at these five, to whet your appetite…
And if you are a developer, there’s a good chance you’re using Sublime Text. If you are, here are a few Sublime Text 3 shortcuts to help your dev-life a little faster…
One of the harder things for me, as a developer to deal with is when a certain feature, formerly known to be unusable because it is not supported well enough, finally comes of age. It often takes articles like Dudley Storey‘s article about CSS’s calc to goad me into checking CanIUse.com one more time and finally seeing the support in is really not bad!
Sticking with Dudley for one more quick one, he shows an easy method for responsively moving page elements around in the DOM to take your responsive designs beyond clear: left.
JavaScript: So hated, and yet so loved… Answering such questions as:
- Should JavaScript be used to replace browser functions like history, navigation and page rendering?
- Is the backend dying? Should I render HTML at all?
- Are Single Page Applications (SPAs) the future?
- Is JS supposed to augment pages for websites, but render pages in web apps?
- Should techniques like PJAX or TurboLinks be used?
- What’s the precise distinction between a website and a web application? Should there be one at all?
7 Principles of Rich Web Applications tries to help us understand the language, its pros and cons, and best uses-cases.
The Financial Times has built a Polyfill Service, which is basically what most of us thought Modernizr was going to do when it first came out: it modernizes the user’s browser for you, so you don’t have to worry about it! Read the article, it is a seriously brave undertaking, and will be fascinating to learn more about, I think!
Once again, Jeremy sums it up best, helping to properly define progressive enhancement. To me, this is yet another term, like responsive design, that should disappear from our vernacular; in both cases, it’s called web development… If you’re not building responsive sites, and you’re not building progressively, you’re not building websites.
I read every word on every page I could find on the Framote website, and still couldn’t understand what it did. So I tried it. And (mostly) love it! It is basically a remote control for remote devices, and would typically be used for testing cross-device. Here’s how it works: you enter a URL into their site, and they give you two URLs in return: 1) the “control” URL, and 2) the “reactive” URL; you load the “reactive” URL in all your test devices, and the “control” URL in, say, your desktop/laptop; when you make changes to the URL in the “control” browser, the “reactive” URLs will change to mimic it. Simple, easy-to-use, and (once you’ve tried it) easy-to-understand cross-device testing.
You down with TLS? Well, I’m not, yet, but hope to be soon, and so should you… And this article can help.
And while not ready yet, Let’s Encrypt.org is on its way to help with “free, automated, and open” certificates! Yeah!!
The Guardian describes the concept of content containers, how they chose to follow this method, and how and why they implemented it in their Beta site.
pseudo-element “alt”: New to Bruce Lawson, new to me… Would be nice, though!
And for Mac users, I just accidentally discovered this: Shift + Option + Delete deletes entire word to left with one click; Shift + Command + Delete deletes entire sentence to left with one click. Can’t wait to get to work and see if the typical Control-version works on a PC!
And finally, I go back-and-forth about whether I like the original version of this song, but I am all-in when it comes to this parody! :-)
Happy reading,
Atg