Code a Responsive Website Using HTML5 and CSS for Beginners

Course Curriculum

Chapter 1: Welcome

Lecture 1: Introduction

Lecture 2: How the Web Works

Chapter 2: Getting Started

Lecture 1: Planning a Website

Lecture 2: The Proposal

Lecture 3: Build a Wireframe

Chapter 3: Handcoding HTML5

Lecture 1: Downloads and Example Web Pages

Lecture 2: Markup Rules

Lecture 3: HTML Semantics

Lecture 4: Setting up your Workspace for Windows

Lecture 5: Setting up your Workspace for Macintosh

Lecture 6: Document Title

Lecture 7: Heading and Paragraph

Lecture 8: Block Quote and Break Tag

Lecture 9: HTML Comments

Lecture 10: Inline Tags

Lecture 11: HTML Lists

Lecture 12: HTML5 Entities

Lecture 13: Linking Documents

Lecture 14: Linking to Folders

Lecture 15: Four Parts of an HTML Page

Lecture 16: Build Example Site Part A

Lecture 17: Build Example Site Part B

Lecture 18: Build Example Site Part C

Lecture 19: Build Example Site Part D (INCLUDES subdomain for "sandbox")

Lecture 20: View the Completed Example Site

Chapter 4: Introduction to CSS

Lecture 1: Introduction to CSS

Lecture 2: Linking to an External Style Sheet

Lecture 3: CSS Reset

Lecture 4: Styling Built-in Selectors

Lecture 5: Styling Lists

Lecture 6: Styling Borders

Lecture 7: Setting Padding and Margin

Lecture 8: Color Theory

Lecture 9: Colors

Lecture 10: Adding a Google Font Family

Lecture 11: Navigation

Lecture 12: Build Example Site Part A

Lecture 13: Build Example Site Part B

Lecture 14: Build Example Site Part C

Lecture 15: Build Example Site Part D

Lecture 16: View the completed example site

Chapter 5: Adding Images

Lecture 1: Overview of Images for the Web

Lecture 2: Web Page Speed and Images

Lecture 3: Using Photoshop to Prepare Images

Lecture 4: Using PIXLR to Prepare Images

Lecture 5: Add an Image to a Web Page

Lecture 6: Using a PNG Image

Lecture 7: Creating an Image Gallery

Lecture 8: Image Gallery Using Flexbox

Lecture 9: Build the Example Site Part A

Lecture 10: Build the Example Site Part B

Lecture 11: Build the Example Site Part C

Lecture 12: Build the Example Site Part D

Lecture 13: View the completed example site

Chapter 6: HTML5 Forms for collecting user information

Lecture 1: Introduction to Forms

Lecture 2: Create a Basic Form

Lecture 3: New HTML5 Input Types

Lecture 4: Creating a Fieldset

Lecture 5: Adding Radio Buttons

Lecture 6: Adding Checkboxes

Lecture 7: Adding a Textarea for Comments

Lecture 8: Implementing a Select with Dropdowns

Lecture 9: Adding Hidden Inputs

Lecture 10: Using HTML5 Required and Pattern

Lecture 11: Styling Your Form with CSS

Lecture 12: Build the Example Site part A

Lecture 13: Build the Example Site part B

Lecture 14: Build the Example Site part C

Lecture 15: Build the Example Site part D

Lecture 16: Build the Example Site part E

Lecture 17: Build the Example Site part F

Lecture 18: View the completed example site

Chapter 7: Advanced CSS

Lecture 1: Overview of Advanced CSS

Lecture 2: Add a Gradient Image

Lecture 3: Add a Background Image

Lecture 4: Implement a CSS Gradient

Lecture 5: Add a Graphic for Lists

Lecture 6: Creating Drop Shadows

Lecture 7: Building Navigation using Media Queries

Lecture 8: Tell Phones Not to Lie

Lecture 9: Build the Example Site Part A

Lecture 10: Build the Example Site Part B

Lecture 11: Build the Example Site Part C

Lecture 12: Build the Example Site Part D

Lecture 13: View the completed example site

Chapter 8: Adding the final touches

Lecture 1: Overview of Media

Lecture 2: Implementing iFrames

Lecture 3: Recording with Audacity

Lecture 4: Adding an Audio File

Lecture 5: Add a Table

Lecture 6: Styling a Table with CSS

Lecture 7: Link to a PDF file