These days, we consider it a given that all websites we design build are responsive. The essential concept means that webpages adjust to the screen size web browser one is viewing with, as opposed to the older model of creating static screens. Clearly, as the number of devices and browsers continues to expand, the possibilities of maintaining an active web presence without a responsive website will decrease to the point of obsolescence.
What are the technical elements of responsive web design?
Here at barefoot, where advocates of the fluid grid concept in which design is laid out over a grid of conceptual stage, so that the resizing of vertical elements is an easy process has screens sizes reduce generally we work with percentages rather than absolute units like pixels. Images are constrained by containing elements, meaning images are also size the relative units. An intelligent use of CSS media queries is generally part of this process, facilitating the website to respond as a user changes from, say, his desktop to an iPad. For a period of web history, many businesses actually designed separate websites to be served at mobile view. After a while, Google made it clear that it did not appreciate this modus operandi, because it meant essentially that it would have to consider different results for mobile and desktop, considering the layouts makeup of the website could be entirely different. Interestingly, this may come again during 2017 as Google launches a specific mobile index, and encourages the use of AMP, or accelerated mobile pages, as they try to lower the processing costs.
I’ve heard the phrase adaptive design space- how is this different?
Responsive adapts to the size of the screen the matter what device the user chooses, (usually using CSS media queries), adaptive design uses static breakpoints. These don’t respond as fluidly as the initial page spring-loaded. Adaptive isn’t necessarily an inferior methodology, many designers use a combination of two. Adaptive is most often used when a designer has to retrofit an existing website to make it more mobile friendly. Developers working with adaptive design would commonly choose six resolutions, although by examining Google analytics you may come to a different conclusion.
Do we prefer responsive or adaptive from a development perspective?
We prefer adaptive design wherever possible, but it does take a huge amount of work to build what is essentially six websites. The beauty of adaptive is that it allows highly precise renderings of images, including aspect ratios, that allow them to really shine in a consistent way across multiple devices and technologies. Responsive actually takes less work and can certainly give percentages a more fluid feel when scaling. Responsive sites also tend to be sluggish loaders, which can be a problem with user experience (UX).