Would you look at this? Adaptive design has been a hot topic for the past year or so, and rightfully so. Web design is new industry, mobile Web design is younger than that. While everybody is shoehorning CSS into doing pretty much everything under the sun, I’m really excited to see something like this. Especially from someone like Nathan Smith.
To date, most responsive Web design is powered by media queries. The biggest fault to the system is that assets are downloaded in their entirety and then processed. That doesn’t do much for the mobile mantra of keeping things as lean as possible. Why not use JavaScript? Exactly.
Comments
To answer the “Why not use JavaScript?” question… I think a lot of designers just aren’t comfortable with the idea of making their designs rely on JS, or aren’t skilled enough themselves with JavaScript to pull it off. Which isn’t to say that’s a bad thing. Some of the best designers I know are proficient pretty much in just HTML/CSS.
Media queries seemed like a breath of fresh air when I first heard about them, but my heart sank when I realized they couldn’t be used to scope conditional downloads. Same with a print stylesheet. It’s downloaded whether or not a user ever prints the page.
I got to thinking: If we’re so worried about screen width, and want to test for screen width, why not… Um, I dunno: Test for screen width? Then I had the idea to revisit noscript in the document head, from *years* ago.
http://sonspring.com/journal/show-hide-solution
I checked the spec — Lo and behold, it’s now valid in HTML5. I mean, it always worked, just now it’s officially okay. So yeah, anyway, glad you liked my approach! 🙂