{"id":2651,"date":"2016-01-04T05:57:24","date_gmt":"2016-01-04T05:57:24","guid":{"rendered":"https:\/\/www.branex.ae\/blog\/?p=2651"},"modified":"2016-01-19T08:42:13","modified_gmt":"2016-01-19T08:42:13","slug":"adaptive-or-responsive-design-what-works-best-for-designers","status":"publish","type":"post","link":"https:\/\/www.branex.ae\/blog\/adaptive-or-responsive-design-what-works-best-for-designers\/","title":{"rendered":"Adaptive or Responsive Design: What Works Best for Designers?"},"content":{"rendered":"<p><span style=\"font-weight: 400;\">Responsive web design is like the new fad \u2013 everybody\u2019s doing it! As the mobile web came through and became widely used, a debate on choosing responsive, adaptive or standalone mobile site has started. Standalone mobile sites are not really a good idea, overall so let\u2019s just skip them for now. The upfront and maintenance cost will have the company run out of business soon if this standalone mobile sites are chosen as a go-to option.<\/span><\/p>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_83 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\"><p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<\/div><nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.branex.ae\/blog\/adaptive-or-responsive-design-what-works-best-for-designers\/#The_difference_between_the_two\" >The difference between the two<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.branex.ae\/blog\/adaptive-or-responsive-design-what-works-best-for-designers\/#When_Creating_Adaptive\" >When Creating Adaptive<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.branex.ae\/blog\/adaptive-or-responsive-design-what-works-best-for-designers\/#When_Creating_Responsive\" >When Creating Responsive<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.branex.ae\/blog\/adaptive-or-responsive-design-what-works-best-for-designers\/#The_BIG_Decision\" >The BIG Decision<\/a><\/li><\/ul><\/nav><\/div>\n<h3><span class=\"ez-toc-section\" id=\"The_difference_between_the_two\"><\/span>The difference between the two<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><span style=\"font-weight: 400;\">A responsive web design is quite fluid and is flexible in so many ways. It adapts well to the screen size of the target device as it uses CSS media queries.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Adaptive design, however, makes use of static layouts. They are breakpoints-based and don\u2019t respond when loaded first time. It is usually designed for 6 common screen widths that tend to detect them gradually as they load.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Adaptive may seem like a complicated version but <a href=\"https:\/\/www.branex.ae\/blog\/a-brief-guide-to-your-responsive-web-design\/\" target=\"_blank\">responsive web design<\/a> is more complex as improper use of media queries can create performance issues.<\/span><\/p>\n<h3><span class=\"ez-toc-section\" id=\"When_Creating_Adaptive\"><\/span>When Creating Adaptive<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><span style=\"font-weight: 400;\">Adaptive web design can be used for an existing site as it helps in making it more mobile friendly. Multiple, specific, viewports can be made out of this.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Apart from that, if you are looking forward to creating an adaptive site right from the beginning, media queries can be used in expanding the layout. It allows the web design to be viewed for higher resolution viewports.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">To create a site that needs to be used for retrofitting, it seems like a lot of work for designing and developing a site and that too for multiple viewports.<\/span><\/p>\n<h3><span class=\"ez-toc-section\" id=\"When_Creating_Responsive\"><\/span>When Creating Responsive<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><span style=\"font-weight: 400;\">Perhaps the best thing about responsive designs is that even the less experienced designers and developers can create it, easily. It has been made possible due to ready-made themes via CMS systems like WordPress, Drupal and others.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">The control is not as good as Adaptive but it requires minimum effort in building as well as maintaining a Responsive web design.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Since its all layouts to be designed as one, this can make the process somewhat complex. Mid-resolution is what you should aim at and then adjust it for high or low res with the help of media queries.<\/span><\/p>\n<h3><span class=\"ez-toc-section\" id=\"The_BIG_Decision\"><\/span>The BIG Decision<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><span style=\"font-weight: 400;\">When making a decision as to which one to use, Adaptive or Responsive, a tip is to take your audience into account. Getting a customer insight is important for you\u00a0to know what kind of devices they have got handy and will be using to access the site. Content and everything else also comes to you easily once you have collected the very insight on your target market.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Another factor to be taken into account is whether it\u2019s a completely new thing that you are developing or simply revamping. Responsive works better when you are starting from the scratch which is why everybody is using it.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Responsive is mostly used today due to the heavy maintenance that Adaptive demands. The latter hasn\u2019t died on us, yet, even if the world has fallen in love with the Responsive design. If there are solutions to making Adaptive web design all the more better, it eventually will become the number 1 choice as it lingers for glory. <\/span><\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Responsive web design is like the new fad \u2013 everybody\u2019s doing it! As the mobile web came through and became widely used, a debate on choosing&#8230;<\/p>\n","protected":false},"author":16,"featured_media":2652,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[50],"tags":[88,90,86,87,89],"class_list":["post-2651","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-web-design","tag-adaptive-web-designs","tag-responsive-design","tag-responsive-web-design","tag-responsive-web-designing","tag-static-web-designs"],"_links":{"self":[{"href":"https:\/\/www.branex.ae\/blog\/wp-json\/wp\/v2\/posts\/2651","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.branex.ae\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.branex.ae\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.branex.ae\/blog\/wp-json\/wp\/v2\/users\/16"}],"replies":[{"embeddable":true,"href":"https:\/\/www.branex.ae\/blog\/wp-json\/wp\/v2\/comments?post=2651"}],"version-history":[{"count":0,"href":"https:\/\/www.branex.ae\/blog\/wp-json\/wp\/v2\/posts\/2651\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.branex.ae\/blog\/wp-json\/wp\/v2\/media\/2652"}],"wp:attachment":[{"href":"https:\/\/www.branex.ae\/blog\/wp-json\/wp\/v2\/media?parent=2651"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.branex.ae\/blog\/wp-json\/wp\/v2\/categories?post=2651"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.branex.ae\/blog\/wp-json\/wp\/v2\/tags?post=2651"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}