Responsive Web Design

Sites that work well on mobile devices and desktop displays.

Mobile First

This is a common strategy designers and developers use to efficiently create systems that work on both desktop and mobile.

Mobile layouts are more constrained and will often be a single column. Since there is less real estate to work with, you have to be more judicious about your priorities. This is good for creating designs that work.

Essentially this just means making components stacked vertically by default, and flow horizontally at larger screen sizes using breakpoints.

Screen sizes

Your website will be displayed on desktops, laptops, tablets, and phones.

It's important to test your work by changing the browser size and ensuring content is visible and works properly.

Take a look at popular screen sizes and make sure there are no issues.

https://gs.statcounter.com/screen-resolution-stats

Level
Topics