Course
Skills Expanded
Hands On Responsive Web Design
This course provides a hands-on experience where you will build several responsive HTML5 web pages ready to use on your next project.
What you'll learn
This is a hands-on, project-based course where you follow along as Paul Cheney demonstrates how to build responsive web pages. You will learn about media queries, mobile navigation, responsive images, sprite icons, font icons, partials, and importing with a CSS preprocessor. At the end of the course, you will have several templates ready to use in your next web project.
Table of contents
Building a Responsive Start File
36mins
Navigation Using Pure CSS
26mins
Navigation Using jQuery Show/Hide
21mins
Navigation Using Option/Select and Suckerfish for Desktop
20mins
Navigation Using an Expanding Navigation Button
21mins
Responsive Columns Using a 12-column Grid
32mins
Responsive Images
45mins
Icons
49mins
- Introduction 1m
- Setup 2m
- Building a Single Column Sprite Sheet in Photoshop 7m
- Building a Double Column Sprite Sheet in Photoshop 7m
- Coding the Social Icons in the Phone Header 11m
- Coding the Social Icons in the Tablet and Desktop Header 5m
- Coding the Social Icons in the Footer 7m
- Importing and Using a Font for Icons 7m
- Testing 2m
- Summary 0m
CSS Preprocessor
15mins