Responsive web design (RWD)

Vancouver Responsive web design

Responsive web design (RWD) is a web design approach aimed at crafting sites 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). RWD provides optimal viewing experience across a wide range of devices making the user's experience the best it can be ensuring that they will tell their friends and family, thereby, driving more traffic to your web site.

A site designed with RWD adapts the layout to the viewing environment by using fluid, proportion-based grids, flexible images, and CSS3 media queries, and an extension of the @media rule.

Technically speaking, a responsive web design employs the following:

  • A fluid grid concept that calls for page element sizing to be in relative units like percentages, rather than absolute units like pixels or points;
  • Flexible images are also sized in relative units, so as to prevent them from displaying outside their containing element;
  • Media queries allow the page to use different CSS style rules based on the characteristics of the device the site is being displayed on; and,
  • Server-Side Components (RESS) in conjunction with client side ones such as media queries can produce faster-loading sites for access over cellular networks and also deliver richer functionality/useability.

In the coming months, I will write about what web developers and customers should consider when determining if a Responsive Web Design is right for them. I will discuss such aspects as:

  1. Challenges, and other approaches;
  2. Adaptive (Multiple Fixed Width Layouts or Responsive Multiple Fluid Grid Layouts;
  3. Mixed Approach for large and medium - fluid width for small;
  4. Who Is Doing It?
  5. Corporate Websites versus Medium to Smaller Websites;
  6. When To Use It?;
  7. Things to Consider
  8. How?;
  9. Frameworks (save time) or Roll Your Own (more control);
  10. Best Practices; and,
  11. Where Can We Learn More?