Responsive Design
Responsive websites are built on a fluid grid and use media queries not to target specific device resolutions, but rather to adjust the design and content as it reaches various breakpoints.
5 videos • 2 quizzes • 2 code challenges
-
Play
Watch
Intro to Responsive Web Design
2 minutes 8 seconds
-
ABC
Preview
Quiz: Intro to Responsive Design
5 questions
-
Play
Preview
Content Defined Breakpoints
2 minutes 59 seconds
-
Code Challenge
Preview
Code Challenge: Content Defined Breakpoints
3 objectives
-
Play
Preview
Flexible Images Part One: Vector Graphics
5 minutes 3 seconds
-
Code Challenge
Preview
Code Challenge: Flexible Images Part One: Vector Graphics
2 objectives
-
Play
Preview
Tools and Testing
2 minutes 38 seconds
-
Play
Preview
Flexible Images Part Two: Raster Images
3 minutes 55 seconds
-
ABC
Preview
Quiz: Flexible Images Part Two: Raster Images
5 questions
Extra Credit
Scalable Vector Graphics (SVGs)
Replace the logo and illustration SVGs in the Smells Like Bakin' website with your own vector graphics. Remember to save out a GIF or PNG as a fallback for older browsers.
