HTML5 for Responsive Web Design

From ETC Public Wiki
Jump to: navigation, search

Responsive web design is all about considering the user and making his or her experience effective (can perform the task), efficient (can do it quickly), and satisfying (willing/eager to do it again) accounting for the limits of the user/device in presenting the information. In the web's early days, designers made specific pages for different browser sizes. Now, with countless resolution and device options, it is far too challenging to pinpoint specific browser and resolution capabilities. Rather, HTML5 and CSS3 allow for tuning presentation based on min and max widths and heights and other options. See Ethan Marcotte's Responsive Web Design 2010 article for context. Note its importance in a 2013 eWeek article on the future of HTML5. Check out how to account for mobile specifics with mobile-first responsive web design tutorial.

There are tools to help with the new style of web development, of course the Adobe stack and perhaps others reviewed at 2012 .Net Magazine quick review. One tool listed there with perhaps some value for responsive design: Electric Mobile Studio.

Additional Reading

  • An MSDN article on Responsive Web Design builds off of Ethan Marcotte's seminal article on the subject with a Visual Studio developer's perspective.
  • Media Queries is a collection of inspirational websites using media queries and responsive web design. Curated by Eivind Uggedal.

Apple/iOS Specific