Why Digital Media News

Responsive Web Design

A responsive web design is one which changes it's appearance to suit the screen size or device on which it's viewed. In the past, this would mean creating two (or more) completely different websites. One for desktop and one for each of the other screen sizes you wish to support. 

With the huge rise in popularity of smart phones, tablets, and small screened netbooks, catering for all of the possible screen resolutions would be a nightmare. Thankfully we can now avoid many of these headaches with the use of the new media-queries available in CSS 3.

Media-queries give us access to certain valuable pieces of information from the browser such as height, width and even what type of device the browser is running on. This then allows us to load a stylesheet specifically designed for the screen size of the device.

www.yiibu.com is a great example of this technique and shows how the same website can be scaled down from a full desktop browser right down to a mobile device. You can even test it yourself by resizing your browser window.

With media queries we can resize images to perfectly suit the device on which they are viewed, move elements around the page, stack them or remove them completely to avoid costly data charges and slow loading times for mobile users. 

We can perfectly tailor a web design for any device or screen size cutting development time, costs and greatly improving the overall user experience on a variety of devices. 

At Why Digital Media we are taking full advantage of the cutting edge features of CSS 3 to create responsive, flexible web designs that look great from phone to widescreen, eliminating the need for costly mobile web site design and development.