Responsive Web Design (RWD) is an approach to web design in which a site is crafted to provide an optimal viewing experience—easy reading and navigation with a minimum of resizing, panning, and scrolling—across a wide range of devices (from desktop computer monitors to mobile phones).
Elements of Responsive Web Design
A site designed with RWD uses CSS3 media queries an extension of the
@media
rule, to adapt the layout to the viewing environment—along with fluid proportion-based gridsand flexible images:- Media queries allow the page to use different CSS style rules based on characteristics of the device the site is being displayed on, most commonly the width of the browser.
- The fluid grid concept calls for page element sizing to be in relative units like percentages or EMs, rather than absolute units like points (which are typically for print media).Note that pixels are relative units.
- Flexible images are also sized in relative units (other than pixels), such as to prevent them from displaying outside their containing element.
Reference Links
Comments
Post a Comment