Cuelogic Blog Icon
Cuelogic Career Icon
Home > Blog > Product Development > Responsive designs

Responsive designs

Responsive design means, designing your website to adapt to the user's viewing environment (mobile, tablet, laptop etc.). It does this through the use of media queries, and other clever technology. Ethan Marcotte wrote the original article about it, and a pretty handy book.

It essentially indicates that a web site is crafted to use Cascading Style Sheets 3 media queries, an extension of the media rule, with fluid proportion-based grids (which use percentages and EMs instead of pixels), to adapt the layout to the viewing environment, and probably also use flexible images. As a result, users across a broad range of devices and browsers will have access to a single source of content, laid out so as to be easy to read and navigate with a minimum of resizing, panning, and scrolling.

Lib for creating responsive web design

Bootstrap, from Twitter

Simple and flexible HTML, CSS, and Javascript for popular user interface components and interactions.

via:twitter.github.com

Test your responsive website

The Responsinator

The responsinator is designed to test responsive websites on different device resolutions

via:www.responsinator.com

Examples

24 Excellent Examples of Responsive Web Design | Inspiration

With the ever increasing popularity and wide spread use of mobile devices like the iPhone and iPad, it’s difficult to ignore the fact that websites are being viewed across various screen sizes. And it looks like the days of designing a site for one minimum resolution are almost gone. That’s why “responsive web design” is such a hot topic lately.

via:webdesignledger.com