Responsive Web Design: Advancing your Design to the Modern Web [Video]

Responsive Web Design: Advancing your Design to the Modern Web [Video]

Ben Fhala

2 customer reviews
A fascinating journey into the world of responsive web design
Mapt Subscription
FREE
€29.98/m after trial
Video
€69.36
RRP €81.58
Save 14%
What do I get with a Mapt Pro subscription?
  • Unlimited access to all Packt’s 5,000+ eBooks and Videos
  • Early Access content, Progress Tracking, and Assessments
  • 1 Free eBook or Video to download and keep every month after trial
What do I get with an eBook?
  • Download this book in EPUB, PDF, MOBI formats
  • DRM FREE - read and interact with your content when you want, where you want, and how you want
  • Access this title in the Mapt reader
What do I get with Print & eBook?
  • Get a paperback copy of the book delivered to you
  • Download this book in EPUB, PDF, MOBI formats
  • DRM FREE - read and interact with your content when you want, where you want, and how you want
  • Access this title in the Mapt reader
What do I get with a Video?
  • Download this Video course in MP4 format
  • DRM FREE - read and interact with your content when you want, where you want, and how you want
  • Access this title in the Mapt reader
€0.00
€69.36
€29.98p/m after trial
RRP €81.58
Subscription
Video
Start 30 Day Trial
Subscribe and access every Packt eBook & Video.
 
  • 5,000+ eBooks & Videos
  • 50+ New titles a month
  • 1 Free eBook/Video to keep every month
Start Free Trial
 
Preview in Mapt

Video Details

ISBN 139781785888212
Course Length2 hours and 31 minutes

Video Description

The modern web puts the user at the center of all activities. With 100s of different devices out there, web designers must up their game and develop sites that work for TV, mobile, and print, and large as well as small screens. The modern web is based on responsive websites that adapt to the user and their needs. Today websites reach far and wide from computers, TVs, printers, and e-books to mobile devices. The old way of building websites doesn't work anymore and we need to move to a responsive web design strategy to keep up with the changing world.

This video course walks you through all the steps involved in building responsive designs with ease and will upgrade your skills as a web designer.

We will start off with the basics of media queries, which are the key to responsive design, and creating custom layouts based on output type. You’ll get a deeper understanding of responsive design, how to plan for it, and how to work with various media query expressions and features. You’ll learn how to design for multiple devices and resolutions, and optimize for media types including print, screen, mobile, desktop, and more. In addition, you will also become familiar with central responsive frameworks, such as Bootstrap, and will become able to tackle responsive design challenges using effective design strategies.

Finally, we will look at the future of web design and discuss CSS4 media queries, which were still in the planning stages when this course was being developed. These are not supported yet by browsers, but will give us a glimpse of what lies ahead to help us understand the possible future for media queries.

This video course is the ultimate guide to responsive web design that will give you all the knowledge and skills needed to create fully responsive designs for the modern web!

Style and Approach

This video course conveys the design concepts used to quickly and effectively build responsive websites through practical and easy-to-understand examples.

Table of Contents

Getting Started with Media Queries
The Course Overview
What Are Media Queries?
Media Queries "Hello World"
Media Queries Within a CSS File with the @media Rule
Media Query Rule Combination
Moving into Responsive Design with Media Query Expressions
What Is Responsive Design?
Optimizing for a Specific Device
Creating Responsive Designs with Size Ranges
Mobile Responsiveness
Backward Compatibility
Advanced Design Strategies
Thinking Fluid
Creating a Site That Responds to Itself
Optimizing Based on Device Resolution
Designing by Aspect Ratio
Talking about Color and Grids
Working with Responsive Frameworks
What Are Responsive Frameworks?
The Twitter Bootstrap
Understanding the Twitter Bootstrap CSS Rules
Adding Components
An Example of a Grid Layout
Changing Themes with LESS
Media Queries Level 4
The Future of Media Types
Moving into Media Features
Creating Custom Media Queries
Media Query Operators
Working with Media Query Ranges

What You Will Learn

  • Get an in-depth knowledge of media queries—the heart of responsive web design
  • Create advanced design strategies for different devices, aspect ratios, and resolutions
  • Work with the Twitter Bootstrap framework to build effective designs
  • Make your design backward-compatible and expand support to IE9 with HTML5shim
  • Enhance the user experience using relative measurement types
  • Stay up to date with all the future developments in web design and discover CSS4 media queries

Authors

Table of Contents

Getting Started with Media Queries
The Course Overview
What Are Media Queries?
Media Queries "Hello World"
Media Queries Within a CSS File with the @media Rule
Media Query Rule Combination
Moving into Responsive Design with Media Query Expressions
What Is Responsive Design?
Optimizing for a Specific Device
Creating Responsive Designs with Size Ranges
Mobile Responsiveness
Backward Compatibility
Advanced Design Strategies
Thinking Fluid
Creating a Site That Responds to Itself
Optimizing Based on Device Resolution
Designing by Aspect Ratio
Talking about Color and Grids
Working with Responsive Frameworks
What Are Responsive Frameworks?
The Twitter Bootstrap
Understanding the Twitter Bootstrap CSS Rules
Adding Components
An Example of a Grid Layout
Changing Themes with LESS
Media Queries Level 4
The Future of Media Types
Moving into Media Features
Creating Custom Media Queries
Media Query Operators
Working with Media Query Ranges

Video Details

ISBN 139781785888212
Course Length2 hours and 31 minutes
Read More
From 2 reviews

Read More Reviews

Recommended for You

Getting started with Shiny [Video] Book Cover
Getting started with Shiny [Video]
€ 142.78
€ 121.38
Getting Started with Spring 5.0 [Video] Book Cover
Getting Started with Spring 5.0 [Video]
€ 142.78
€ 121.38
Fundamentals of Continuous Delivery Pipeline [Video] Book Cover
Fundamentals of Continuous Delivery Pipeline [Video]
€ 142.78
€ 121.38
Mastering Your Web Application Using Functional Javascript [Video] Book Cover
Mastering Your Web Application Using Functional Javascript [Video]
€ 142.78
€ 121.38
Responsive Web Development with HTML5, CSS3, and JavaScript [Video] Book Cover
Responsive Web Development with HTML5, CSS3, and JavaScript [Video]
€ 142.78
€ 121.38
Vue.js 2 Recipes [Video] Book Cover
Vue.js 2 Recipes [Video]
€ 142.78
€ 121.38