responsive Web design


Also found in: Dictionary, Acronyms.

responsive Web design

Creating a website that renders well on smartphone screens as well as the larger screens on tablets, laptop and desktop computers. There are two solutions. The first is to switch to a separate, dedicated site upon detection of a small screen (see mobile website). The second, which is the true responsive design, is to make all the pages on the same website flexible and dynamically adjustable to the device and browser that requested them. The use of variable-sized fonts and images and multiple style sheets are basic approaches.

Responsive Means the Same Programming Skills
Whether using separate desktop and mobile websites or a single responsive website, the Web pages are coded and maintained by people with the same Web programming expertise. When a website and separate mobile apps are maintained, developers must be experienced in Web, Apple (iOS) and Android programming. This often requires more human resources because each environment is very different and barely resembles the others (see IDE). It takes a very talented programmer to be equally proficient in three coding platforms. See mobile emulator and Media Queries.


A Great Example
Both top and bottom browser renderings came from the same BitTorrent.com website and automatically conformed to the two dramatically different window widths.
Copyright © 1981-2019 by The Computer Language Company Inc. All Rights reserved. THIS DEFINITION IS FOR PERSONAL USE ONLY. All other reproduction is strictly prohibited without permission from the publisher.
References in periodicals archive ?
KFH-Bahrain implemented the Responsive Web Design to provide clients with easy navigation and access to corporate information, provide the bank's staff with easy maintenance and to provide clients one of the most advanced technologies available.
With responsive web design, a website will automatically detect the screen size of the device accessing it and triggering content to adjust accordingly.
The solution is responsive web design, which improves the website's view on the smaller screens of mobile devices.
Since 67 percent of users claim they are more likely to purchase from a mobile-friendly website, companies that rely on SE0 are wise to begin making the transition to mobile-friendly websites, and responsive web design specifically ...
Responsive web design is when your web site looks the same regardless of what platform you view it on...
To him, responsive web design means "fluid grids, fluid images/media &media queries." Adaptive web design "is about creating interfaces that adapt to the user's capabilities (in terms of both form and function)." Gustafson continues, "'adaptive web design' is just another term for 'progressive enhancement' of which responsive web design can (an[d] often should) be an integral part, but is a more holistic approach to web design in that it also takes into account varying levels of markup, CSS, JavaScript and assistive technology support" (http://blog.easy-designs.net/archives/ 2011/11/16/on-adaptive-vs-responsive-web-design).
Technology such as cloud computing allows content to be accessed from any device, while responsive web design can adapt according to the screen size and device.
Let's look at an Introduction to Responsive Web Design Posted on www.themobilewebdesignblog.com on 18 June 2012.
"I kind of feel like responsive Web design is a new name for some old thinking about designing more flexibly for a medium that works really well when you're thinking about trying to design for these devices and screen sizes."
In the summer of last year, Ethan Marcotte (a Boston-based and world-renowned designer, speaker and author) coined the phrase "responsive web design" in his seminal article published on A List Apart, explaining a new, forward-thinking approach to designing and building websites.
Just like the GIS websites built by SuperGIS Server 10, Supergeo's new website uses responsive web design, which means the webpages will automatically detect the screen size of visitors and adjust its layout to fit them.