The Native versus HTML conversation, to me, has been mostly dead for a while, but a recent article from Smashing Magazine covers building hybrids, testing, and even “mash-ups” like PhoneGap.
Building a Mobile-First, Responsive site, that works in IE8. A great walk-through from The Guardian!
And here’s another fine walk-through, this time for Style.com‘s new site, showcasing some of the variations they used when switching from device-to-device.
Okay, now let’s really take it to the upper limits, and then jump back down to Earth, with a POV video from Felix Baumgartner’s stratospheric jump…
What Each Country Leads the World In. Interesting to see things like: South America + Ostriches (I tend to think Australia + Ostriches); Chile + Staying Married (nice going, Chile!); Bolivia + Brasil Nuts (would have expected Brasil on that one); and had to laugh when I zoomed in and realized my initial reading of Australia + Deadly Animals and Melodrama was not correct… :-)
And for your viewing, and educational, pleasure, here are four talks given by Ilya Grigorik from Fluent 2013.
Oh animated GIF… You have gone from the darling of the early days of the Internet, to despised ugly duckling (for reminding us of those early days), to the princess at the ball again, and now we learn you’ve been taxing us behind our backs all this time… What are we to do with you??
I’ve been a big fan of Dudley Storey‘s site since I stumbled across it a few months ago, and here’s another fine example of a basic, clear, easy-to-follow tutorial, this time creating a CSS/JS fullscreen slideshow. One of the more interesting tidbits for me was the use of
position: relative for the first slideshow element to force the wrapper to the proper size. Hadn’t thought of this one myself, nice!
Not surprising coming from Microsoft, where naming conventions aren’t always the best, as this author tries to shove all the necessary keywords into the article title, don’t let that distract you for the magical two lines of CSS, and what they can bring to the web!
Using SVGs as sprites. Not exactly the implementation I expected, but I like it!
And once we have our SVGs neatly in place, let’s make them dance, with Snap.svg!
Anything that makes pages load faster is a good thing in my book, and
prerender are all good things in my book!
And layout boundaries are another good thing! Learn the “few small CSS tweaks” you can use to help minimize your page reflows!
Now that we have our pages loading faster, let’s get them reacting more quickly! Touche.js removes the 300ms delay, re-map clicks to “touchend” events, expose an “on” method, all for just 0.666kb. Looks simply devilish, no??
For you fellow WordPressers out there, a few clever bits:
- Clever technique to send emails to yourself anytime someone hits a
404page on your site
- Need a way to test your site on a bunch of devices, but don’t own a bunch of devices? Here are a few options.
- Something I’ve always wanted the time to do is customize the WP Admin site for clients, to make it feel more like their CMS, not WordPress’…
This is a very slick method for adding art-direction positioning to a single
<img>, sans-JS… It does mean that you’re serving the same-sized image to all devices, but it’s a nice middle-step. (And as I saw referenced elsewhere, if you were to couple this with Scott Jehl‘s
<picture> polyfill, you’d really have something!)