off original price!

The coupon code was not applied because it has already been redeemed or expired. Please click on "My Courses" to see if the course is already on your account.

off original price!

The coupon code was not applied because it has already been redeemed or expired. Please click on "My Courses" to see if the course is already on your account.

Building Responsive Websites with HTML 5 & CSS3

Build modern sites for any device

What's Inside

In this hands-on training course, award-winning veteran trainer Geoff Blake shows you, step-by-step, how to build beautifully designed, responsive websites that adjust and function perfectly on smartphones, tablets, and desktop displays. You'll begin with the fundamentals of responsive design, beginning with multiple style sheets, media queries and various expressions.

Next comes the fun part: you'll be guided through several in-depth chapters that walk you through the responsive design workflow, building HTML structure and CSS formatting for mobile and desktop displays; including tablets, desktop screens, and smartphones. Geoff shows you how to plan out your work, handle common issues that arise in a responsive layout, and how to handle various page components between device displays. Finally, the course closes with additional tricks, advanced techniques, and testing methods to ensure that your layout looks fantastic.

Course Curriculum

1.Introduction

Welcome - 0:48
Preview
A Look At What We'll Build - 1:35
Preview

2.Responsive Design Fundamentals

Key Aspects Of Responsive Design - 2:43
Start
Determining Device Resolutions To Target - 4:20
Start
Wireframing Responsive Layouts - 4:58
Preview

3.The Basics: Multiple Style Sheets & Media Queries

The Concept Of Using Multiple CSS Files - 10:49
Start
Media Queries & Multiple Style Sheets - 8:57
Start
Building Media Queries Into A Single CSS File - 7:38
Start
Using Media Query Expressions - 5:04
Start

4.Building HTML Structure & CSS For All Screens

Setting Up The HTML & CSS Files - 4:18
Start
Getting Started With The Header - 7:36
Start
Inserting The Main Nav Menu - 6:01
Start
Inserting The Search Field - 6:55
Start
Problems With Applying Floats - 4:19
Start
Integrating Google Fonts API - 3:25
Start
Building The Hero Section Structure - 4:25
Start
Formatting The Hero Section - 9:04
Start
Inserting & Formatting A Call To Action Button - 9:50
Start
Building The Features Section, Part One - 5:46
Start
Building The Features Section, Part Two - 4:56
Start
Inserting The Organize Section - 8:18
Start
Building The Share Section - 5:15
Start
Building The Call To Action Area - 6:36
Start
Inserting And Formatting The Footer - 3:47
Start
Finishing Touches For The High Resolution Layout - 4:06
Start

5.Building The Tablet Layout

Setting Up The Medium Resolution CSS & Testing The Media Query - 7:01
Start
Formatting The Medium Res Header - 4:08
Start
Formatting The Medium Res Hero Section - 6:08
Start
Formatting The Features Section - 2:13
Start
Formatting The Organize And Share Sections - 5:17
Start
Building The Get Section & Finishing Up The Medium Res Layout - 2:53
Start

6.Building The Smartphone Layout

Setting Up The Low Res CSS & Testing The Media Query - 4:40
Start
Formatting The Low Res Header - 2:52
Start
Resolving Problems Caused By Floats - 4:21
Start
Formatting The Low Res Hero Section - 3:17
Start
Formatting The Features Section - 1:46
Start
Formatting The Organize And Share Sections - 2:58
Start
Building The Get Section & Finishing Up The Low Res Layout - 3:06
Start

7.Advanced Techniques For Responsive Design

Disabling Device Smart Zoom - 5:59
Start
Testing Your Responsive Layouts - 4:27
Start
Setting Up Retina Display Graphics - 6:21
Start

8.Wrapping Up

Where To Go From Here - 0:28
Start

off original price!

The coupon code was not applied because it has already been redeemed or expired. Please click on "My Courses" to see if the course is already on your account.

Get started now!