Responsive Overview

Responsive web design it’s building a website suitable to work on every device and every screen size.

• Responsive generally means to react quickly and positively to any change.
  • With responsive design websites continually and fluidly change based on different factors, such as viewport width.
• adaptive means to be easily modified for a new purpose or situation.
  • adaptive websites are built to a group of preset factors.
    • Mobile, on the other hand, generally means to build a separate website commonly on a new domain solely for mobile users.
  • Mobile websites.

Flexible Layouts

• Responsive web design is broken down into three main components:
  1. flexible layouts:
     • flexible layouts, is the practice of building the layout of a website with a flexible grid, capable of dynamically resizing to any width. Flexible grids are built using relative length units, most commonly percentages or em units.
     • Flexible layouts do not advocate the use of fixed measurement units, such as pixels or inches. Reason being, the viewport height and width continually change from device to device.
  2. media queries.
     • Media queries provide the ability to specify different styles for individual browser and device circumstances, the width of the viewport or device orientation.
     • There are a couple different ways to use media queries, using the @media rule inside of an existing style sheet, importing a new style sheet using the @import rule
  3. flexible media.