Add More Responsive Tricks to Your Toolbelt

 13 Reviews Add a review

Published July 2017

No longer cutting edge, it's the norm

Responsive web design techniques have graduated from being the fancy cutting edge of web development and design to becoming the norm, the standard which most new website and application constructions must measure. Because of that, though, there are still tips and helpful techniques that can be earned by even experienced web developers.

In this course, you will be taught how to create elements with responsive background videos, how to use the picture tag to display responsive images, and how to use CSS to create scalable backgrounds. Getting backgrounds right, especially complex video backgrounds and images that need to be displayed correctly to the user can be a tricky endeavor, and this course will take you through all of that, giving you a few more tools in your responsive web design arsenal to create awesome responsive layouts for future projects!

Learn more about responsive web techniques through our courses. Flexbox, is a great short course diving into the Flexbox model for responsive web. For a comprehensive and intermediate deep dive into a responsive whole front-end workflow, take our project-driven course Responsive Web Development. It’s tricky but it will give you complete guided lessons into building responsive websites with a fully-functional front-end workflow, using Node.js, Gulp, Sass and more.

Oh yeah, and the whole SitePoint library! Learn More.

What you'll learn

  • Responsive techniques for videos
  • Responsive background techniques
  • Closed captions available
Meet your instructor
Russ Weakley

Russ is a world-renowned author, speaker and CSS expert. Russ has a detailed knowledge of Design and development. His expertise covers graphic design, interface design, site architecture and standards based development.

Meet your instructor
Guilherme Muller

Guilherme is a freelance full-stack developer with over 10 years of experience working with websites. With a passion for HTML and CSS, he specializes in the intricacies of building and structuring web pages and layouts.

Lesson 1: Responsive Tips and Tricks
Creating Fullscreen Responsive Background Videos 6:43
Web Elements with Responsive Background Videos 5:17
Making Responsive Images with the Picture Tag and Picturefill.js 8:45
Create Scalable Backgrounds with CSS 5:36
Responsive Elements with calc() 6:42

Leave a Review