March 15, 2012

Adaptive vrs Responsive Design vrs Mobile/Tablet Templates

Presenter: Ben Klocek with Jared White and Michael Slater

Some people say there is a difference between adaptive and responsive Web design (see: Aaron Gustafson's Easy Designs Blog). Some folks think it is just different names for the same thing.

There are also many people who feel it is just too much work for not enough return.

At our March meeting, Ben Klocek will lead a roundtable discussion to hash out what is the best approach to take.

Ben has put together a "live" workflow outline for this discussion at: http://bit.ly/ytChTJ. He will be updating it as we get closer to the meeting. It is worthwhile to review this page prior to the meeting.

Also joining in to share their expertise and opinions are:

  • Jared White who will focus on developing for Mobile first (opportunity, focus, innovation), the challenges of developing a layout for tablets/iPad and then work backwards to enable that to work on desktop browsers.
  • Michael Slater who might cause some controversy (we hope!) with his subtopic: Buliding separate mobile pages: why mobile first is generally impractical and responsive design is often sub-optimal.

It is loads of fun seeing a Web page re-render itself for the different size screens. But this isn't just the old standard HTML shrinking itself down for smaller/larger desktop screens sizes and resolutions and browser window widths.

Adaptive/responsive Web design throws away content when displaying for smaller screens or browser widths — all to accommodate the best and most readable experience for the viewer.

One particular site with good examples of this is from Designmodo:
Responsive Web Design: 50 Examples and Best Practices
designmodo.com/responsive-design-examples

Try this page on A LIST apart:
alistapart.com/d/responsive-web-design/ex/ex-site-mini.html
On a desktop computer, make the width of your browser window as wide as you can then as narrow as you can and see what happens to the content.

We who are developing Websites are now being required, in many cases, to design for all sorts of screens. But, will the client pay for this extra cost whether it is using responsive design or special templates for each device?


About Ben Klocek
Ben has been building Websites since 1994. He spent a few years in the corporate world as the Web Creative Director for Meyer Sound in Berkeley.

Ben now is a freelance consultant with a wide variety of expertise in Web strategy, development, SEO on several CMSs including WordPress and Drupal. To read more about Ben, go to his site at bracia.com. He is also a terrific designer. While at his site, check out his portfolio (bracia.com/portfolio).

Twitter: @benklocek
Email: ben@bracia.com


About Jared White
Jared White is the Owner and Creative Director of Siteshine, a digital media agency based in Santa Rosa, CA. He helps Siteshine’s customers create fantastic online experiences. He brings 14 years of experience to the table, from his extensive work in graphical UI/UX to backend technologies such as PHP, Ruby on Rails, Python, and JSP.

Jared has worked with a variety of SMB clients and large corporate accounts, from DJs, psychologists and iOS app developers, to book publishers, networking companies and the largest parenting resource site in America, BabyCenter. He is also a public speaker and has presented at many technology and business groups. Jared was a featured speaker at the North Bay Web Design Conference in 2011.

Currently Jared is hard at work on his new startup: Mariposta, an iPad-to-iPad publishing platform based on HTML5. With gorgeous, magazine-quality themes right out of the box and integration with popular photo sharing services, Mariposta is “Storytelling at Your Fingertips.” It will launch in public beta this summer.

When he’s not wearing his business hat, you’ll find Jared on a hiking adventure up in the mountains, composing and listening to light ambient music, planting a missional house church, and spending quality time at home with his wife Rosemary, his new baby girl Glorianna, and his cat Jasmine.

Twitter: @WebDevJared
Mariposta.com
jared@siteshine.com
707-515-7416


About Michael Slater
Michael Slater is the cofounder and CEO of Webvanta, which provides website development services for graphic designers, mobile website and app development services, a hosted CMS with powerful database capabilities, and web solutions for restaurants. He is also the proprietor of BoatingSF.com, coproduced the Learning Rails podcast, and creates monthly webinars for Webvanta. He is the founder of the North Bay Internet Society and the North Bay Web Design Conference.

Prior to cofounding Webvanta, he was cofounder and chairman of Fotiva, a digital photography software company acquired by Adobe in 2001; was founder and editorial director of the Microprocessor Report newsletter, now in its 25th year; and produced the Microprocessor Forum conference, which had a 19-year run. Long ago, he worked at Hewlett-Packard.

North Bay Internet Society

Meetings: Third Thursday of Every Month
2012 Schedule:
No Meetings in Aug. & Dec.

We usually meet in the Tarsier room at O'Reilly's buildings at the north end of Sebastopol

Doors open for socializing at 6:30 PM, "formal" meeting begins at 7:00 PM. Pot-luck refreshments.