Responsive Web Design

Definitions

Responsive web design: An approach that suggests the design and development should respond to the user's behavior and environment based on screen size, platform and orientation.

Why has responsive web design become so important? Responsive web design has became very important because it makes navigating through websites simple on any device, and allows the viewer to see the whole web site instead of zooming in and out.

Media Queries: It allows content rendering to adapt to conditions such as screen resolution.

Breakpoints: The point at which your sites content will respond to provide the user with the best possible layout to consume the information.

Responsive Websites

 On the wide responsive website, there is a sidebar with a column with 5 drop down options. The main message is centered on the web site with a gif of someone on an iPad working the website.  (desktop)

                 
 The medium responsive site brought the drop down menu to the bottom of the page and turned it into 5 different rows. The size of the main message gets bigger and the gif of the person on the iPad turns into a solid picture. (tablet)

The small responsive website pushed the menu 

further down the page, and shrunk the main 

picture. More news is posted the more the viewer

scrolls down.