Click me
Transcribed

INFOGRAPHIC: 2013 The Year of Responsive Design

Galaxy S3, iPad Mini, Nexus 7, Microsoft Surface - with the never-ending parade of new mobile devices hitting the market, what's a marketer to do to engage with their audience on devices with varying screen sizes and capabilities? 2013 The Year Of Responsive Design The answer is simple: Responsive Design. Here is a look at what marketers need to know about this approach to web and mobile design. Consumers use a varetiy of devices to reach different goals Most popular cross-device activities 90% of people use multiple screens sequentially 81% 67% 46% 43% Browsing the Internet Shopping Online Managing Finances Planning a Trip (1) What is Responsive Design? Responsive design is a 'write once, run every- where' style of design- ing websites. Rather than building separate sites for each web and mobile device, respon- sive design uses CSS3 media queries to create a single website that intelligently adjusts its layout and features based on how it's being viewed. (2) Key Benefits Cross Platform Responds to audience device and consumption habits Content Focused Device specific elements become secondary Cost Effective Less need for standalone sites and apps Easy To Manage Content editing through a single CMS L SEO friendly Links are cleaner and used across platforms Future Proof Design that is fluid to adapt to new technology (3) Success Cases Publishers, arguably the kings of content, are already on the responsive design bandwagon: BBC The Boston Globe theguardian "We could have just built a "We believe Responsive Design is one of the most innovative and largest scale uses of a new approach to "A key focus of the new site is that it offers best in class smartphone version, but that wouldn't have helped us with the rise of tablets. There are so creating Web applications. It many different screen sizes enables us to deliver a better proliferating now that we BBC News experience." - Chris Russell performance, taking into account a user's connection speed and adapting accord- ingly. We want to ensure our readers have the best possi- ble experience." - Tanya Cordrey wanted to make sure we didn't miss out on future opportunities." - Jeff Moriarty VP of Digital Products Head of Product, BBC News Online Chief Digital Officer (4) (5) (6) the Bocian Clabe eguardian The lostan late NEWS David Cameron attaks Ed HIltand'simmieration plans wie ad Patten eaffirms BBC ndependenoe At least one dead in hoetingat Cons, ementary wehoal The Trars hai realfee Te cepaiors. Aasad'agees ta created and sponsored by 4 überflip www.uberflip.com Sources (1) http://services.google.com/fh/files/misc/multi-screen_infographic.pdf (2) http://www.forrester.com/Understanding+Responsive+Design/fulltext/-/E-RES74481 (3) http://www.theglobeandmail.com/report-on-busi- ness/small-business/sb-digital/web-strategy/responsive-design-one-site-fits-all/article4101084/ (4) http://econsultancy.com/ca/blog/10956-bbc-news-embraces-responsive-design-for-new-mobile-site (5) http://www.digiday.com/publishers/is-responsive-web-design-the-future-of-ross-device-publishing/ (6) http://www.guardian.co.uk/gnm-press-office/guardian-rolls-out-new-responsive-mobile-site-following-beta-trial Galaxy S3, iPad Mini, Nexus 7, Microsoft Surface - with the never-ending parade of new mobile devices hitting the market, what's a marketer to do to engage with their audience on devices with varying screen sizes and capabilities? 2013 The Year Of Responsive Design The answer is simple: Responsive Design. Here is a look at what marketers need to know about this approach to web and mobile design. Consumers use a varetiy of devices to reach different goals Most popular cross-device activities 90% of people use multiple screens sequentially 81% 67% 46% 43% Browsing the Internet Shopping Online Managing Finances Planning a Trip (1) What is Responsive Design? Responsive design is a 'write once, run every- where' style of design- ing websites. Rather than building separate sites for each web and mobile device, respon- sive design uses CSS3 media queries to create a single website that intelligently adjusts its layout and features based on how it's being viewed. (2) Key Benefits Cross Platform Responds to audience device and consumption habits Content Focused Device specific elements become secondary Cost Effective Less need for standalone sites and apps Easy To Manage Content editing through a single CMS L SEO friendly Links are cleaner and used across platforms Future Proof Design that is fluid to adapt to new technology (3) Success Cases Publishers, arguably the kings of content, are already on the responsive design bandwagon: BBC The Boston Globe theguardian "We could have just built a "We believe Responsive Design is one of the most innovative and largest scale uses of a new approach to "A key focus of the new site is that it offers best in class smartphone version, but that wouldn't have helped us with the rise of tablets. There are so creating Web applications. It many different screen sizes enables us to deliver a better proliferating now that we BBC News experience." - Chris Russell performance, taking into account a user's connection speed and adapting accord- ingly. We want to ensure our readers have the best possi- ble experience." - Tanya Cordrey wanted to make sure we didn't miss out on future opportunities." - Jeff Moriarty VP of Digital Products Head of Product, BBC News Online Chief Digital Officer (4) (5) (6) the Bocian Clabe eguardian The lostan late NEWS David Cameron attaks Ed HIltand'simmieration plans wie ad Patten eaffirms BBC ndependenoe At least one dead in hoetingat Cons, ementary wehoal The Trars hai realfee Te cepaiors. Aasad'agees ta created and sponsored by 4 überflip www.uberflip.com Sources (1) http://services.google.com/fh/files/misc/multi-screen_infographic.pdf (2) http://www.forrester.com/Understanding+Responsive+Design/fulltext/-/E-RES74481 (3) http://www.theglobeandmail.com/report-on-busi- ness/small-business/sb-digital/web-strategy/responsive-design-one-site-fits-all/article4101084/ (4) http://econsultancy.com/ca/blog/10956-bbc-news-embraces-responsive-design-for-new-mobile-site (5) http://www.digiday.com/publishers/is-responsive-web-design-the-future-of-ross-device-publishing/ (6) http://www.guardian.co.uk/gnm-press-office/guardian-rolls-out-new-responsive-mobile-site-following-beta-trial

INFOGRAPHIC: 2013 The Year of Responsive Design

shared by uberflip on Dec 19
3,071 views
3 shares
0 comments
With a multitude of mobile devices coming out almost every week, how can marketers ensure that their content is optimized for different device types, screen sizes, and capabilities? According to Uberf...

Publisher

Uberflip

Category

Technology
Did you work on this visual? Claim credit!

Get a Quote

Embed Code

For hosted site:

Click the code to copy

For wordpress.com:

Click the code to copy
Customize size