Hands-on Responsive Web Design 4: Navigation

This course will teach you how to build and deploy responsive apps for several different kinds of phone, tablet, and desktop navigation schemes with HTML5, CSS3, Sass, and even a little JavaScript.
Course info
Rating
(16)
Level
Intermediate
Updated
Jan 22, 2018
Duration
1h 37m
Table of contents
Description
Course info
Rating
(16)
Level
Intermediate
Updated
Jan 22, 2018
Duration
1h 37m
Description

At the heart of developing any responsive website is a thorough knowledge of how to use HTML5, CSS3, and Sass. In this course, Hands-on Responsive Web Design 4: Navigation, you will learn the skills you need to build responsive navigation for single level and two level deep navigation for small screens, medium screens, and large desktops. You will use jQuery, JavaScript, icons, and Sass as you work your way through each example. You will discover the appropriate use and limitations for each navigation type. You will also explore browser support and how far back each approach will work. By the end of this course you will know how to build navigation for simple toggle, multilevel toggle, footer anchors, and icons with popups.

About the author
About the author

Paul Cheney is a professor of Web Design and Development at Utah Valley University, where he teaches Responsive Design. He also owns his own web design company, which allows him to keep current in the field and share the latest technology with his students.

More from the author
Hands-on JavaScript Project: JSON
Beginner
1h 16m
Oct 26, 2018
Best Practices for Responsive Web-forms
Beginner
1h 10m
May 31, 2018
More courses by Paul Cheney
Section Introduction Transcripts
Section Introduction Transcripts

Course Overview
Hello. My name is Paul Cheney. Let me tell you about this fourth in the series of Hands-on Responsive Design courses. At the heart of developing any responsive website is a thorough knowledge of how to use HTML5, CSS3, Sass, and even a little JavaScript. In Responsive Web Design 4, Responsive Navigation, you will gain the skills you need to build and deploy several different kinds of small screen navigation options including the simple toggle, multilevel toggle, footer anchors, and icons with pop-ups. Some of our projects will rely on JavaScript, and others will be completely Javascript free. Some will use graphics, and other will use font icons. In addition, we will learn to build Suckerfish drop-down menus for large screens. At the end of each module, we will look at the browser support and how far back each approach will work. We'll also build one navigation project using only the latest technology of flexbox and CSS grids. Then, just for fun, we'll explore Sass include when we build our hamburger icon. All of these modules will be built using Sass and ready to include in your next project. Please join me as we explore responsive navigation for small, medium, and large screens in this, the last of four Hands-on Responsive Design courses from Pluralsight.