Applied Responsive Design

with James Williamson
please wait ...
Applied Responsive Design
Video duration: 0s 6h 1m Intermediate


Following the concepts introduced in Responsive Design Fundamentals, senior author James Williamson demonstrates the practical applications of responsive design and shows how to enrich the appearance and behavior of your website across multiple devices. First, discover how to plan your design and take advantage of CSS media queries to create multiple layouts. Then make your site navigation respond to changing screen sizes with CSS and jQuery, and display media like images and video fluidly. Plus, discover how to take advantage of mobile capabilities like touch events and HTML5 forms to enhance the experience of mobile visitors. James also shows how to effectively manage resources and optimize the performance of your site.

Topics include:
  • Creating mockups
  • Structuring page regions
  • Defining default styles and media queries
  • Building desktop, tablet, and mobile layouts
  • Structuring and styling menus
  • Dynamically replacing menus
  • Creating a responsive image gallery
  • Adding phone functionality
  • Testing responsive sites
Developer Web


- [Voiceover] Hi, I'm James Williamson, senior author here at and I wanna welcome you to Applied Responsive Design. In this course we're gonna explore many of the strategies and techniques that are being employed to control the appearance and behavior of sites across multiple screen sizes and devices. As we explore responsive design we'll see how it affects the entire process of building sites, from the early planning stages, to site development, and even in terms of how we test and deploy our sites. We'll cover the planning aspects of responsive sites, how to craft responsive layouts and media, how to handle site navigation across devices and screen sizes, and how you can use mobile capabilities to enhance your sites overall experience.

We'll also talk about properly managing resources for responsive sites and what you can do to help improve performance. Responsive design is not just another fad, it's a reaction to the reality of designing for users who expect to experience your site across multiple devices and screen sizes. So, open up your favorite code editor and let's get started crafting responsive designs.

please wait ...