learn-co-curriculum / fewd-teacher-guide-day-6-responsive-css Goto Github PK

• Students learn how to use responsive media queries to make sites that look good on screens as well as their phones

• Students should have an understanding of how web pages dynamically change to accomodate users on mobile phones, tablets and personal computers, regardless of the size of their browser window
• Students should be able to use CSS to respond to changes in viewport
• Students should be able to write conditional CSS media queries to trigger changes in layout based on user device type and screen size

• Some group discussion to preface this content may be useful. Pick a responsive website that looks fundamentally different on the phone compared to a student's laptop
• It should be emphasized that creating responsive sites can be a complex process that takes considerable time to test. This may be a good time to introduce the device toolbar within the Chrome inspector, where it is possible to mimic the displays of a variety of phones.

View FEWD-Teacher-Guide-Day-6-Responsive-CSS on Learn.co and start learning to code for free.