Responsive design
Also called: responsive web design(rwd) or responsive
Responsive web design is a form of designing and building websites that takes into account different types of devices. Separate websites are not designed for computers, tablets and smartphones. Instead, the design of the site adapts to the size of the screen (also referred to as viewport) and the capabilities of the visitor's browser, among other things.
Benefits of responsive design
Separate mobile Web sites are also developed for phones. These have a simplified design and often contain less information and functionality than the full-fledged site.
However, by making one overall website responsive, most (if not all) of the content remains accessible even on mobile devices and only one website needs to be developed and maintained. Increasingly, therefore, a responsive website is chosen instead of a separate mobile version.
When applied properly, responsive design still provides an optimal user experience on very different devices. This applies not only to small screens, but also to high resolutions.
As with mobile Web sites, responsive Web design can choose to leave out certain less relevant content for mobile visitors. Think heavy images and font files. Large images and videos can be replaced with a lower resolution if necessary. This will make the pages load faster and also takes into account any mobile data traffic costs.
Development of a responsive website
With a responsive Web site, all devices share the same HTML file for each Web page. By working with different style sheets and/or media queries, the display can be tailored to the user. An existing full website design can be made suitable for use on mobile devices, or a mobile first approach can be chosen.
Typically, responsive websites use a fluid design. This means that the page fills the visitor's entire screen. Another important feature of responsive design is the use of progressive enhancement. Technically advanced techniques can be used, but the functioning of the website should not depend on them. Thus, the site remains usable and accessible on any device. This principle is referred to as progressive enhancement.
