Make your media as responsive as your site's layout. Learn to prepare video, fonts, and images to display correctly on a wide variety of devices.
- [Voiceover] Hi, I'm Christopher Schmitt, and welcome to Responsive Media. In this course, we'll look at the basics of responsible design. Followed by how to influence type, video, vector and raster images to better take advantage of this new multi-device web. We'll start by showing you the basics of responsible design. First, we'll convert a fixed width layout into a fluid grid layout, so it can adapt to different devices and their screens. To complement that approach, we'll talk about how mini-queries can be used to pinpoint custom design experiences, for the different sizes of the user screen. After that, we'll work on how to adjust native html5 video and third-party players for better presentation and a responsive design.
Then, we'll focus on familiar web image formats like ping and jpeg, along with newer vector image format, svg. In the context of responsive web design, and how to prepare and serve them. Because the web does not stop at our desktop computers, we'll be covering all these features, plus tools and techniques, to get the most out of our videos, fonts and images for our web pages for this new multi-device web. Now, let's get started with Responsive Media.
- Using percentage-based values for scaling
- Resizing typography
- Using icon fonts
- Embedding HTML5 video content
- Resizing and compressing raster images
- Compressing vector images