Web Essentials: Introduction to HTML5, CSS3, and Responsive Design

COURSE OUTLINE:

Description

In this course, you will learn how to use the latest web technologies and responsive design practices that are central to targeting the entire spectrum of user platforms and browsers. This course provides you with an in-depth introduction to and exploration of a variety of key cutting-edge technologies being used in modern web design. Working in a highly engaging hands-on format, you will learn the foundational technologies and skills needed necessary to design highly interactive, feature-rich and user-friendly websites and webpages. Topics and skills covered in this course are fast-changing and on the cutting edge of web development.

Audience

  • Experienced developers who need to extend their knowledge of web design and development or reinforce sound HTML and CSS coding practices

Prerequisites

Previous experience or working knowledge of developing software applications.  Real world programming experience is a must

Learning Objectives

  • Use the full range of HTML5 semantic and structural elements
  • Work with technologies such as web storage, application caching, and cross-domain messaging to improve performance and the user experience
  • Which features that CSS3 supports and how they can be effectively used with HTML5 and other technologies
  • Adapt to varying degrees of browser support for HTML5 and CSS3
  • Responsive web design (RWD) for effectively adapting to varying screen sizes and delivery channels

1. Introduction to HTML5

  • Essential HTML5
    • HTML5: Status and Support
    • Semantic Structure and Tags
    • Forms, Input Types, and Data Qualification
    • Handling Complex Media Options
    • Working with Legacy Browsers
  • HTML5 JavaScript API
    • Cross-Domain Messaging
    • Working with Web Storage
    • Offline with Application Cache
    • Geolocation: What, Why, and How

2. Introduction to CSS3

  • CSS3 Overview
    • CSS3: Status and Support
    • CSS3 Features
    • Reasons to Use CSS3
  • CSS3 Advanced Selectors
    • Selecting Using Attributes
    • Selecting Using DOM Structure
    • Complex Selecting using Pseudo-Classes
    • Selecting Using UI Components and State
  • CSS3 Visual Effects
    • Font Options, Opacity, and Color
    • Distributing Content Across Columns
    • Working with Borders and Boxes
    • Working with Vendor Prefixes
    • Functional Techniques

3. Advanced Topics

  • Responsive Web Design (RWD)
    • Adapting to Varying Screen Sizes
    • Scaling Page and Text Content
    • Scaling and Adapting for Media
    • Options for Adjusting Media