Modern web design incorporates responsive web design—a form of design that adjusts depending on how a website is accessed. Much of the responsiveness in a design can be handled by percentages and media queries.

When creating a design that is responsive, it is best to set the base design with smartphone displays in mind. This is commonly referred to as the “mobile first” approach. It ensures that your content is thoughtfully planned to be viewed on a device that has the least amount of visual space. From there, you can add features and advanced styling as the viewport size increases.

In this lesson, you will learn more about responsive design areas of focus for different device sizes and display properties, which can help you build a web page that is laid out gracefully, regardless of its viewing platform.