Text

3.0 Design philosophy

Text

Mobile-first and responsive

The patterns in this library were developed with a mobile-first and responsive web design approach to help deliver the right experience for the right screen.

Text

What is mobile-first?

This is the ideology that mobile design, as the hardest, should be done first. Once the mobile design questions are answered, designing for other devices will be easier.

The most important piece of content is on top, followed by the next. Unlike a desktop approach where you can put two pieces of content side by side for equal footing, a mobile approach means one is above the other.

Text

What is responsive web design (RWD)

This design approach allows the layout to respond (reflow) to the needs of the users and the devices they're using. The layout reflows based on the size and capabilities of the device.

For example, on a phone, users would see content shown in a single column view; a tablet might show the same content in two columns and desktop would see the content in three columns.

Text

Updated: 4/1/2020 - KM