Win a Free Class!

Join our email list for a chance to win

Course Workbook


Html5 css3 2x
eBook $49
Print $65
Print + eBook $75
Teacher Discounts

In this book you'll be taken step-by-step through a variety of exercises that teach you what's new in HTML5 and CSS3. Learn how to better structure your page content with new semantic elements, including native audio and video. Create drop shadows, text shadows, rounded corners, semi-transparent elements, and gradient backgrounds purely with CSS. New CSS Transforms, CSS Transitions, and CSS Keyframe Animations let you produce simple animated effects without JavaScript or Flash. Please note that we do not cover Canvas or SVG which can be used to create complex animations (akin to Adobe Flash).

Includes Downloadable Class Files (works on Mac & PC)
ISBN: 978-1-934624-91-3

Download Sample Exercise
Setup & Introduction
Downloading the Class Files
Introducing HTML5
Before You Begin
  • Required software
  • Recommended software
Section 1
Setting Up: Do This Before Other Exercises!
  • Setting up your class files
Intro to HTML5 Semantic Elements
  • HTML5’s streamlined doctype
  • The outline algorithm
  • The header, nav, aside, & footer elements
  • Article vs. section
  • The main element
  • The figure & figcaption elements
  • Validation
Styling the New Elements
  • The simplified style tag
  • The child selector
HTML5 Enabling Script (Shiv)
  • X-UA-compatible meta tag
  • Using the HTML5 enabling script (shiv) for Internet Explorer
  • Setting new semantic elements’ display to block
Section 2
Setting Up SolarFlare
  • HTML5 sectioning overview
  • Using HTML5 Boilerplate
  • Using divs for presentation
Getting Started with CSS3
  • Rounded corners with border-radius
  • Drop shadows with box-shadow
  • The CSS3 gradient stack
  • Using the IE filter for gradients
CSS3 Multiple Backgrounds
  • Working with multiple backgrounds
  • Combining CSS3 gradients with multiple backgrounds
  • Using HTML5 Boilerplate’s helper class .oldie
Using the RGBA Color Model & Modernizr
  • Using RGBA for backgrounds
  • Using Modernizr
Section 3
RGBA for Gradients & Shadows
  • RGBA for gradients
  • RGBA for box shadow & text shadow
CSS Opacity Rollovers
  • Setting the opacity of elements
  • Changing opacity on hover
  • Refining styles for navigation
CSS Transitions
  • Transition-property
  • Transition-duration
  • Transition shorthand & the transition stack
CSS Transforms & Transitions
  • The scale transform
  • The rotation transform
  • Modifying the transform origin
  • Transitioning transforms
  • Using CSS @keyframes
  • Animation-name
  • Animation-duration
  • Animation-timing-function
  • Hail, Ceaser! a CSS easing animation tool
Section 4
HTML5 Forms
  • The placeholder attribute
  • The required attribute
  • New input types: email
  • Using attribute selectors
  • The pattern attribute & regular expressions
  • Client side validation—no JavaScript necessary
Adding Rich Media: Audio
  • The audio element
  • Autoplay & controls
  • The source attribute
  • MP3 vs. Ogg Vorbis
  • Using a JavaScript polyfill for IE 8
Adding Rich Media: Video
  • The video element
  • Autoplay & controls
  • The source attribute
  • Theora Video vs. H.264 encoding
  • Using a JavaScript polyfill for IE 8
Bonus Material
CSS Columns & CSS Reflections
  • The column-count property
  • The column-gap & column-rules
  • Column-span support
  • CSS reflections for Webkit browsers
  • Modernizr fallbacks
Advanced CSS Selectors
  • Adjacent sibling selectors
  • Pseudo-class selectors
  • Attribute selectors
Reference Material
HTML5 & CSS3 Reference Links
Features of Noble Desktop eBooks
  • Searchable.
  • Printable.
  • Live text that you can copy and paste.
  • eBook graphics are in color (printed books are black and white).
  • Widely compatible: We provide the most common eBook formats (EPUB, MOBI, & PDF) so you can load them onto the device or app you choose; such as Mac, PC, iPhone, iPad, Kindle, Android, and more.
  • Free updates for the edition you buy. When we make major changes to a book (requiring a new edition), an affordable upgrade option will be available.
  • DRM-free: Files are subtly watermarked with your name and email, but we do not restrict the devices or apps you can use to view our eBooks.
  • Lifetime access to downloads from your account page.
The Best Way to Enjoy Our Books

Our workbooks are meant to be used while you work on your computer. They typically contain step-by-step exercises that walk you through doing tasks on your computer. An ideal setup would be to have the eBook loaded onto a device (like a tablet/smartphone) or on a second computer monitor, so you can read the book as you work on your computer. You can also print the PDF if you prefer.

Which File Format Is Right for You?
  • Ideal for printing.
  • An exact match to the printed book. If the text reflow of an EPUB or MOBI file is confusing please refer to the PDF.
  • PDF is compatible with most devices, but it’s not optimized for small screens. If using a smaller screen you’ll likely want to use the EPUB or MOBI files.
  • The industry standard eBook format which works with all devices, except for the Amazon Kindle. EPUB can be read on Mac, PC, iPhone, iPad, iPod Touch, Nook, Sony Reader, Kobo, Android, and many more.
  • Ideal for smaller screens as the layout reflows to fit the current device (at the type size of your choice).
MOBI (Kindle)
  • Amazon’s format for Kindle devices and Kindle app.
  • Ideal for smaller screens as the layout reflows to fit the current device (at the type size of your choice).
  • Using an iOS Device such as iPhone & iPad? The Kindle app for Apple iOS devices requires a specialized format which we do not support. While our MOBI will work in the Kindle app, it will not render well on iOS devices. We recommend using the EPUB format with Apple’s iBooks app if reading on an iOS device.
Recommended Reading Apps
iPhone, iPad
  • iBooks (EPUB)
Windows PC
Can You Share the eBook or Printouts?

Noble Desktop books are intended for use by you, the owner. They are not intended to be loaned or given to others. The files are subtly watermarked with your name and email, but we do not apply any DRM. You can copy your eBooks to any of your own devices without restriction. You can print the PDF files for your own use, but not to give to others. You cannot sell used eBooks. Ownership is solely yours and cannot be transferred.

Teachers and training centers wishing to print copies for students should email for licensing options and pricing.

How It Works
  • When you buy an eBook for yourself, it will be added into your account. It will be watermarked with your information and is intended for use only by you.
  • You can also purchase eBooks for someone else, such as a friend or colleague. Schools and training centers can purchase eBooks for their students (be sure to apply for educational pricing).
  • When buying eBooks for someone else, you will receive an eBook voucher code to share with them. Send that code to the recipient and they will be able to redeem it. An eBook voucher code can be redeemed once, for the specific book you purchase for them.
  • The recipient of the eBook voucher code will need to log into their Noble Desktop account, or create a free account. In their account they will enter the code (in the My eBooks tab) and the eBook will be added immediately into their account.
  • The recipient receives all the same benefits of Noble Desktop eBooks, which includes lifetime access to download their eBook, as well as free updates to that edition. When the next edition is released, an affordable upgrade option will be available to them.

Examples of What You Learn

  • Flow text between columns, and create reflections with CSS3.

  • Use new HTML5 form tag elements to automatically add client-side validation without JavaScript.

  • Create beautiful pages with multiple backgrounds.

  • Learn when and how to use native HTML5 video tags with appropriate fallbacks.

  • HTML5 adds many new semantic tags to help keep your content organized.

Why Our Books Are Unique

Our books are packed with step-by-step exercises that walk you through projects. You’ll learn by doing exercises, not reading long explanations commonly found in user manuals. The goal is to give you hands-on practice with the program, getting you started quickly with the things that are most important for real life work. Our books are not a replacement for the manual, but manuals aren’t how you learn an app!

eBook $49
Print $65
Print + eBook $75
Teacher Discounts