"responsive design" entries
CSS Grid Layout: The modern way of doing layout on the Web
The O'Reilly Radar Podcast: Rachel Andrew on modern Web layout, and Kyle Simpson defends JavaScript Coercion.
Subscribe to the O’Reilly Radar Podcast to track the technologies and people that will shape our world in the years to come.
In this week’s episode of the Radar Podcast, O’Reilly’s Mac Slocum chats with Rachel Andrew, founder of edgeofmyseat.com, about CSS Grid Layout and the role responsive design is playing in emerging Web technologies.
In 2004, Andrew published The CSS Anthology: 101 Essential Tips, Tricks & Hacks. Through the years of revisions, she noted in the interview, not that much has changed; sure, we’ve moved on from Netscape 4, she said, but “the [layout] methods we’re using haven’t moved on much since I wrote that book, which is kind of terrifying.” This is why Andrew is so excited about CSS Grid Layout, which she sees as bringing Web layout into the modern day:
CSS Grid Layout is a new spec, an emerging spec. It originally came from Microsoft. In fact, there’s an early implementation of it in IE 10 and 11. It’s kind of moved on now. It’s really a specification for laying out Web pages and/or applications. It’s something that we haven’t really had up to now. The specs and the sort of things that we’re using for layout, things like float and so on, really are quite like hacks to get them to work. Developers have been working around this stuff for years. Grid, I’m quite excited about because it’s sort of the first time it feels like a really modern way of doing layout on the Web.
Radar gets a refresh
Radar is rolling out a new editorial approach and a responsive design.
Today we’re excited to roll out a number of important updates that refine Radar’s content and freshen up the site’s design.
A new approach
The most notable change is also the least obvious.
In the months ahead, Radar’s editorial mission will evolve through our exploration of new topics and new techniques. Of particular note is our theme structure, which helps us interpret important ideas and developments and, in turn, share how we believe they’ll affect you and your world. You’ll soon see insightful posts from all of our content leads that put our best thinking into these essential areas.
There’s also things you won’t find here at Radar. Generic tech news and flavor-of-the-moment coverage don’t have a place, nor are we interested in bombast or drive-by attention.
What we’re really looking to do is create and nurture a dialogue; a true give-and-take that challenges our assumptions and shapes our perspectives. To pull that off we need your help. So consider this an open invitation to take us to task and point us in new directions. Read more…
The altar of shiny
Web design trends often carry hefty performance costs
Web and mobile users continue to expect faster sites and apps–especially when it comes to mobile–and this year I’d like to see people who work on the web spend more time focusing on performance as a user experience priority instead of chasing trends.
I recently ran across this article in Forbes, which lists a number of web design goals/trends that Steve Cooper is eyeing for a site redesign of online magazine Hitched. My intention is not to pick on Hitched or Cooper per se, but the list is a molotov cocktail of potential performance woes:
- Continuous scrolling
- Responsive design
- Parallax sites
You can use most of those techniques without creating performance nightmares, but it is unfortunately rare. I feel like I’m living in an alternate reality where I’m hearing that users want simpler, faster sites, and yet the trends in web design are marching in the opposite direction.
Optimizing Your Websites for Smartphones, Tablets, and More
How to "future-proof" your sites
Users expect to be able to use and bookmark a website by name—always the same name, regardless of the device used to reach and view the site. From a user’s standpoint, a site is a site regardless of which device is being used to reach it. The code that backs up the site should be smart enough to detect the requesting device and intelligently serve the most appropriate markup.
There are several ways to achieve this goal, and at least three realistic scenarios.
Distinct Sites for Mobile and Desktop
Modern websites are built around the typical size of a desktop or laptop monitor. In fact, until the advent of iPhones, web developers rarely considered the need to fit web content into different sizes. Now, however, establishing an effective presence on mobile devices is a necessity. Just because your websites can be accessed by smartphones and tablets doesn’t make them effective. To provide an effective experience, you must optimize your sites for specific classes of devices—typically, smartphones and tablets. For quite some time, it seemed that distinct “m”-sites were a good-enough solution. For example, the website at www.somecompany.com was available in mobile-optimized form using the URL m.somecompany.com. In terms of development, the two sites are completely different; they were projects that simply shared some portions of the back end.
Read more…
Big, open and more networked than ever: 10 trends from 2012
Social media, open source in government, open mapping and other trends that mattered this year.
In 2012, technology-accelerated change around the world was accelerated by the wave of social media, data and mobile devices. In this year in review, I look back at some of the stories that mattered here at Radar and look ahead to what’s in store for 2013.
Below, you’ll find 10 trends that held my interest in 2012. This is by no means a comprehensive account of “everything that mattered in the past year” — try The Economist’s account of the world in 2012 or The Atlantic’s 2012 in review or Popular Science’s “year in ideas” if you’re hungry for that perspective — but I hope you’ll find something new to think about as 2013 draws near. Read more…
Responsive design works for websites, why not for digital comic books?
Pablo Defendini on employing adaptive web design in comic books.
In a keynote address, Open Road Media's Pablo Defendini explored what HTML and CSS can offer to digital comic book design.