{"id":2120,"date":"2013-03-16T15:15:07","date_gmt":"2013-03-16T15:15:07","guid":{"rendered":"https:\/\/2013.atlanta.wordcamp.org\/?p=2120"},"modified":"2013-03-18T17:55:39","modified_gmt":"2013-03-18T17:55:39","slug":"live-blogging-what-you-should-know-about-responsive-web-design","status":"publish","type":"post","link":"https:\/\/atlanta.wordcamp.org\/2013\/live-blogging-what-you-should-know-about-responsive-web-design\/","title":{"rendered":"What You Should Know About Responsive Web Design"},"content":{"rendered":"<p><strong>Speaker:<\/strong> Matt Haff<br \/>\n<strong>Twitter:<\/strong> <a href=\"http:\/\/www.twitter.com\/CWSites\" target=\"_blank\">@CWSites<\/a><br \/>\n<strong>Presentation Slides:<\/strong> <a href=\"http:\/\/www.churchandwebdesign.com\/wp-content\/uploads\/WhatYouShouldKnowAboutRWD.pdf\" target=\"_blank\">Download PDF<\/a><br \/>\n<strong>Original Post:<\/strong> <a href=\"http:\/\/www.churchandwebdesign.com\/2013\/what-you-should-know-about-rwd\/\" target=\"_blank\">What You Should Know About Responsive Web Design<\/a><\/p>\n<h3>What is Responsive Web Design?<\/h3>\n<blockquote><p>\u2026 an evolutionary milestone in the development of web and interaction design as a practice and as an industry.<\/p>\n<p style=\"text-align: right\">Jeffery Zeldman<\/p>\n<p>\u201c[The web] should be accessible from any kind of\u00a0hardware that can connect to the Internet:\u00a0stationary or mobile, small screen or large.\u201d<\/p>\n<p style=\"text-align: right\">Tim Berners-Lee<\/p>\n<p>\u201cIf you don\u2019t embrace the inherent fluidity of the\u00a0web, you\u2019re not a web designer, you\u2019re something\u00a0else. Web design is responsive design, Responsive\u00a0Web Design is web design, done right.\u201d<\/p>\n<p style=\"text-align: right\">Andy Clarke<\/p>\n<\/blockquote>\n<h3>Doing It Right<\/h3>\n<ul>\n<li>Accessibility<\/li>\n<li>Web Standards<\/li>\n<li>User Interaction<\/li>\n<li>Meet the user where they are &#8211; mobile or stationary<\/li>\n<li>Allow for consumption of content<\/li>\n<li>Keep in mind there is no silver bullet<\/li>\n<\/ul>\n<h3>What To Tell Your Boss<\/h3>\n<ul>\n<li><strong>SEO<\/strong> &#8211; Google has specifically said that responsive design \u201cis\u00a0Google\u2019s recommended configuration.\u201d<\/li>\n<li><b><\/b><strong>Easier to Maintain<\/strong> &#8211; you only write content once and it is\u00a0published across every platform, not to mention it\u2019s future friendly<\/li>\n<li><b><\/b><strong>Content Consumption<\/strong> &#8211; make it easier for the customer to get\u00a0to the content that they\u2019re looking for.<\/li>\n<\/ul>\n<h3>Design With The User In Mind<\/h3>\n<h4><strong>Reading Experience<\/strong><\/h4>\n<ul>\n<li>What is the user trying to accomplish?<\/li>\n<li>Content should fit the screen<\/li>\n<li>Change the navigation to make it easier for the user<\/li>\n<li>Don\u2019t strip content, the same information should be accessible\u00a0across all devices, just change how they access it<\/li>\n<\/ul>\n<blockquote><p>\u201cMobile users will do anything &amp; everything that\u00a0desktop users will do provided it\u2019s presented in a\u00a0usable way. Assuming people on mobile \u201cwon\u2019t do\u00a0that\u201d is a losing proposition. Don\u2019t penalize users\u00a0with missing content &amp; features just because they\u00a0aren\u2019t on a full screen.\u201d<\/p>\n<p style=\"text-align: right\">Brad Frost<\/p>\n<p>\u201cDesign is thinking about content and how to put\u00a0it together. you need to focus on the whole. layout\u00a0does not equal design.\u201d<\/p>\n<p style=\"text-align: right\">Luke Wrobleski<\/p>\n<\/blockquote>\n<h4><strong>User Experience<\/strong><\/h4>\n<ul>\n<li>Is what you\u2019re doing common practice or do different devices\u00a0have different user experiences?<\/li>\n<li>Attention to details &#8211; size of links for touch<\/li>\n<li>Is it necessary? Everything should have a purpose.<\/li>\n<li>What is \u201cabove the fold\u201d on different devices.<\/li>\n<li>Cursor vs. Touch &#8211; some blackberries still use cursors.<\/li>\n<\/ul>\n<h4><strong>Navigation<\/strong><\/h4>\n<ul>\n<li>Commonly accepted main navigation is a slide-down menu<\/li>\n<li>Must be accessible, intuitive, common practice<\/li>\n<li>Does it work on the smallest screen?<\/li>\n<li>Don\u2019t make it so long that a user is forced to scroll.<\/li>\n<\/ul>\n<h3>The Way It Was Meant To Be<\/h3>\n<ul>\n<li>RWD = WDDR<\/li>\n<li>HTML &amp; CSS has always been responsive.<\/li>\n<li>UX is about meeting the needs of the user.<\/li>\n<li>Creating websites that adjust to different screens and devices\u00a0is just the beginning.<\/li>\n<\/ul>\n<h3>Sources<\/h3>\n<ul>\n<li><a href=\"http:\/\/stuffandnonsense.co.uk\/blog\/about\/i_dont_care_about_responsive_web_design\/\" target=\"_blank\">http:\/\/stuffandnonsense.co.uk\/blog\/about\/i_dont_care_about_responsive_web_design\/<\/a><\/li>\n<li><a href=\"http:\/\/www.scientificamerican.com\/article.cfm?id=long-live-the-web\" target=\"_blank\">http:\/\/www.scientificamerican.com\/article.cfm?id=long-live-the-web<\/a><\/li>\n<li><a href=\"http:\/\/www.copyblogger.com\/mobile-responsive-design-benefits\/\" target=\"_blank\">http:\/\/www.copyblogger.com\/mobile-responsive-design-benefits\/<\/a><\/li>\n<li><a href=\"http:\/\/www.lukew.com\/ff\/entry.asp?1304\" target=\"_blank\">http:\/\/www.lukew.com\/ff\/entry.asp?1304<\/a><\/li>\n<li><a href=\"http:\/\/bradfrostweb.com\/\" target=\"_blank\">http:\/\/bradfrostweb.com\/<\/a><\/li>\n<li><a href=\"http:\/\/www.webdesignerdepot.com\/2013\/01\/the-new-rules-of-the-responsive-web\/\" target=\"_blank\">http:\/\/www.webdesignerdepot.com\/2013\/01\/the-new-rules-of-the-responsive-web\/<\/a><\/li>\n<\/ul>\n<h3>Stay Hungry My Friends!<\/h3>\n<ul>\n<li><a href=\"http:\/\/www.smashingmagazine.com\/2013\/03\/01\/logical-breakpoints-responsive-design\/\" target=\"_blank\">http:\/\/www.smashingmagazine.com\/2013\/03\/01\/logical-breakpoints-responsive-design\/<\/a><\/li>\n<li><a href=\"http:\/\/designshack.net\/articles\/css\/responsive-design-why-youre-doing-it-wrong\/\" target=\"_blank\">http:\/\/designshack.net\/articles\/css\/responsive-design-why-youre-doing-it-wrong\/<\/a><\/li>\n<li><a href=\"http:\/\/www.smashingmagazine.com\/2013\/02\/25\/there-is-no-mobile-internet\/\" target=\"_blank\">http:\/\/www.smashingmagazine.com\/2013\/02\/25\/there-is-no-mobile-internet\/<\/a><\/li>\n<li><a href=\"http:\/\/coding.smashingmagazine.com\/2011\/01\/12\/guidelines-for-responsive-web-design\/\" target=\"_blank\">http:\/\/coding.smashingmagazine.com\/2011\/01\/12\/guidelines-for-responsive-web-design\/<\/a><\/li>\n<li><a href=\"http:\/\/www.getfinch.com\/2011\/08\/its-not-responsive-web-building-its-responsive-web-design\/\" target=\"_blank\">http:\/\/www.getfinch.com\/2011\/08\/its-not-responsive-web-building-its-responsive-web-design\/<\/a><\/li>\n<li><a href=\"http:\/\/www.hongkiat.com\/blog\/free-responsive-wordpress-themes\/\" target=\"_blank\">http:\/\/www.hongkiat.com\/blog\/free-responsive-wordpress-themes\/<\/a><\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Speaker: Matt Haff Twitter: @CWSites Presentation Slides: Download PDF Original Post: What You Should Know About Responsive Web Design What is Responsive Web Design? \u2026 an evolutionary milestone in the development of web and interaction design as a practice and as an industry. Jeffery Zeldman \u201c[The web] should be accessible from any kind of\u00a0hardware that [&hellip;]<\/p>\n","protected":false},"author":8480538,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[126376],"tags":[],"class_list":["post-2120","post","type-post","status-publish","format-standard","hentry","category-live-blogging"],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p2YmVp-yc","_links":{"self":[{"href":"https:\/\/atlanta.wordcamp.org\/2013\/wp-json\/wp\/v2\/posts\/2120","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/atlanta.wordcamp.org\/2013\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/atlanta.wordcamp.org\/2013\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/atlanta.wordcamp.org\/2013\/wp-json\/wp\/v2\/users\/8480538"}],"replies":[{"embeddable":true,"href":"https:\/\/atlanta.wordcamp.org\/2013\/wp-json\/wp\/v2\/comments?post=2120"}],"version-history":[{"count":12,"href":"https:\/\/atlanta.wordcamp.org\/2013\/wp-json\/wp\/v2\/posts\/2120\/revisions"}],"predecessor-version":[{"id":2197,"href":"https:\/\/atlanta.wordcamp.org\/2013\/wp-json\/wp\/v2\/posts\/2120\/revisions\/2197"}],"wp:attachment":[{"href":"https:\/\/atlanta.wordcamp.org\/2013\/wp-json\/wp\/v2\/media?parent=2120"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/atlanta.wordcamp.org\/2013\/wp-json\/wp\/v2\/categories?post=2120"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/atlanta.wordcamp.org\/2013\/wp-json\/wp\/v2\/tags?post=2120"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}