{"id":565,"date":"2013-10-13T22:14:36","date_gmt":"2013-10-14T05:14:36","guid":{"rendered":"http:\/\/www.jacksonleung.com\/blog\/?p=565"},"modified":"2013-10-13T22:14:55","modified_gmt":"2013-10-14T05:14:55","slug":"responsive-design-fixing-misconceptions","status":"publish","type":"post","link":"http:\/\/www.jacksonleung.com\/blog\/responsive-design-fixing-misconceptions\/","title":{"rendered":"Responsive Design: Fixing misconceptions"},"content":{"rendered":"<p>I&#8217;m exposed to more of the web than most people, not only on the usage front, but also from the development front. A lot of people employ a technique called &#8220;word salad&#8221;. Roughly, the spout a bunch of words, and pray that they have some sort of meaningful connotation.<\/p>\n<p>One of these words is &#8220;responsive design&#8221;. Truthfully, &#8220;responsive design&#8221; meaning should be closest to &#8220;fluid design&#8221;, which is to develop a site that look &#8220;right&#8221; on different browser sizes and resolution.<\/p>\n<p>One interpretation of responsive design seems to be, develop a webpage, that if the user switches from desktop, to tablet, to mobile, things will look the same, and the user will have the same experience.<\/p>\n<p>That interpretation is absolutely wrong. If anything, the better statement would be mobile-tablet-desktop-friendly-architecture-with-relevant-designs. Fact of the matter, if you&#8217;re website is image intensive, 5 megabytes of image intensive, even if you employed the most advance fluid layout techniques, it WILL NOT be a good mobile device experience.<\/p>\n<p>The main thing to take into consideration is bandwidth. Most likely the user is viewing the site using a 3G, 4G connection, and even then, not everyone has access to 25+ mbps wifi line.<\/p>\n<p>Instead of creating one design that will magically work for all 3, I say design 3 versions that are designed for a specific experience. If you design for desktop, tablet and mobile miss out. If you design for mobile, the tablet and pc version is lacking. If you design for tablet, you&#8217;re kind of stuck in the middle, with a mobile device that has a slow experience, and a desktop version that has an underwhelming experience, since it could&#8217;ve been so much more.<\/p>\n<p>I think if possible, we should stick to the terms &#8220;mobile design&#8221;, &#8220;tablet design&#8221;, and &#8220;desktop design&#8221;, and the &#8220;responsive&#8221; versions of each. If the web would adopt this, I&#8217;m sure a lot of people who do work in the web will be saved a lot of headaches, where requirements just seem to crawl out of nowhere, rendering existing architectures less effective at the very last stages of development.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>I&#8217;m exposed to more of the web than most people, not only on the usage front, but also from the development front. A lot of people employ a technique called &#8220;word salad&#8221;. Roughly, the spout a bunch of words, and pray that they have some sort of meaningful connotation. One of these words is &#8220;responsive &hellip; <\/p>\n<p class=\"link-more\"><a href=\"http:\/\/www.jacksonleung.com\/blog\/responsive-design-fixing-misconceptions\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Responsive Design: Fixing misconceptions&#8221;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3,6],"tags":[],"class_list":["post-565","post","type-post","status-publish","format-standard","hentry","category-programming","category-work","entry"],"_links":{"self":[{"href":"http:\/\/www.jacksonleung.com\/blog\/wp-json\/wp\/v2\/posts\/565","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/www.jacksonleung.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.jacksonleung.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.jacksonleung.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.jacksonleung.com\/blog\/wp-json\/wp\/v2\/comments?post=565"}],"version-history":[{"count":2,"href":"http:\/\/www.jacksonleung.com\/blog\/wp-json\/wp\/v2\/posts\/565\/revisions"}],"predecessor-version":[{"id":568,"href":"http:\/\/www.jacksonleung.com\/blog\/wp-json\/wp\/v2\/posts\/565\/revisions\/568"}],"wp:attachment":[{"href":"http:\/\/www.jacksonleung.com\/blog\/wp-json\/wp\/v2\/media?parent=565"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.jacksonleung.com\/blog\/wp-json\/wp\/v2\/categories?post=565"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.jacksonleung.com\/blog\/wp-json\/wp\/v2\/tags?post=565"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}