Why restrict yourself to inline images and static text, especially in our multidevice, multiplatform era? Responsive media allows you to share more content with more people. Learn what you need to know to build image- and typography-rich pages (with HTML5 video!) that display correctly on a wide variety of devices. Christopher Schmitt will also show you how to convert fixed-width layouts into fluid grid layouts that adapt to different screen sizes, use media queries to deliver custom design experiences, and prepare and retrieve PNG, JPEG, and SVG images so that they look their best.
- Using percentage-based values for scaling
- Resizing typography
- Using icon fonts
- Embedding HTML5 video content
- Resizing and compressing raster images
- Compressing vector images
- [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.
Dreamweaver CS6 and WordPress 3.8: Core Concepts96,101 Views
Photoshop Insider Training: Optimizing Photoshop's Performance51,583 Views
Sculpting and Painting a Head in CINEMA 4D35,724 Views
Mograph Techniques: Movie Trailer Titles in CINEMA 4D and After Effects35,998 Views
Motion 2 Essential Training195,352 Views
Illustrator CC 2013 One-on-One: Fundamentals1,676,368 Views
PHP with MySQL Essential Training4,259,922 Views
Illustrator CC 2013 One-on-One: Mastery301,789 Views
Edge Animate Essential Training630,358 Views