What is Responsive Web Design?

what-is-responsve-design-header

Video

 

1. Examples of Responsive Design

There are scores of examples of responsive design online, which you can get a look at by running a Google search and browsing some of the beautiful designs that are listed. Open any one of these sites and simply drag your browser window back and forth to see a living example of responsive design in action.

what-is-responsive-design-1

2. What is Responsive Design?

From a designer/developer standpoint, responsive design is building a website which constantly re-sizes and restructures itself to best fit the screen size, resolution, device, and environment of the website user. Responsive websites are easier to build than may be apparent at first glance and are so useful for your clients and site users.

what-is-responsive-design-2

3. Mobile User’s Needs

Because of the constantly changing nature of a mobile user (Note: The word “mobile”), both the device through which he/she is accessing your site as well as the network/environment through which they are accessing your site is continually changing and in flux. By exercising options for your site such as larger buttons and faster loading images, you can very quickly use responsive design to load a version of your website that is much more friendly to people who use mobile devices to access the web.

what-is-responsive-design-3

4. One Thumb, One Eye

Out in the world and on the go, the website user has but a moment to access your website and find the information that they need; often times while carrying something or being distracted. If you follow the simple principle that a website on a mobile device should be able to be navigated using one eye and one thumb, you can rest assured your site will both function well and be very usable in a real life situation on the go.

what-is-responsive-design-4

5. The End Is Just The Beginning: Keep Exploring

If you’ve watched the video above and are interested in learning more about this exciting (somewhat new) wave of web design, check out these leaders in the responsive design community that I’ve listed below!

what-is-responsive-design-5

Topic: Responsive Design »

Luke Wroblewski

Ethan Marcotte

Brad Frost (Twitter)