Table of Index - Lesson Plan for Web Authoring 5N1910
A manual to teach the QQI Level 5 Web Authoring Module:
Introduction and the context for Students' Guide to Responsive Web Design
Lesson 1 Webpage Design: Managing Your Web Documents
How to Use this Webpage Design Manual
Chapter 1 - Introduction to Webpage Design
Lesson 2 Reviewing Web Terminology
Lesson 3 A Guide to Web Browsers
Chapter 2 - Using Web Authoring Software - Downloading, installing, configuring Notepad++
Lesson 4 A Guide to the two core web languages: HTML and CSS
Lesson 5 A Guide to structural Mark-up of a webpage: HTML - Hypertext Mark-up Language
Assignment 1
Chapter 3 - Structuring HTML w/Headings and Adding Style
Lesson 6 A Guide to font: typography for the web - choosing a font-family
Lesson 7 A Guide to font: Typographic units
Lesson 8 A Guide to presentation of a webpage: Cascading Style Sheets - CSS
Lesson 9 A Guide to HTML Semantics: Headings h1 to h6
Lesson 10 A Guide to font and line-height CSS properties
Webpage Design Basic Template - Create a HTMl template: structural mark-up
Assignment 2: Adding Headings and style
Exercises for Chapter 3
Chapter 4 - CSS Colour and Background Properties
Lesson 11 Primary colours, colours for the web pages, SVG 1.0 recognised colour keywords, web safe colours.
Lesson 12 Pixel colour depth, pixel make-up
Lesson 13 A Guide to colour: CSS colour and background properties
Assignment 3: Styling w/colour and background properties
Exercises for Chapter 4
Chapter 5 - HTML Elements for Text and CSS Text Properties
Lesson 14 A Guide to Text: HTML Elements for Text
Lesson 15 A Guide to Text:: CSS Properties: aligning, decorating, spacing, indenting
Assignment 4.1: HTML Elements for Text
Assignment 4.2: CSS Properties for Text
Exercises for Chapter 5
Chapter 6 - CSS Box Properties
Lesson 16 A Guide to spacing and placing: CSS box properties: margin, padding, border, width, height, float, clear
Assignment 5.1: CSS Box properties: float, clear, width, height
Assignment 5.2: CSS Box properties: padding, border, margin
Exercises for Chapter 6
Chapter 7 - Inline CSS and HTML Documents Validation
Lesson 17 A Guide to the World Wide Web Consortium
Lesson 18 A Guide to HTML: Origins and History
Lesson 19 A Guide to HTML Versions
Lesson 20 A Guide to HTML Elements
Lesson 21 A Guide to HTML Attributes
Lesson 22 A Guide to Inline Cascading Style Sheets
Lesson 23 A Guide to HTML Document Tree
Lesson 24 A Guide to CSS Selectors - combinators
Lesson 25 A Guide to Validating web documents (HTML and CSS) by direct input
Assignment 6: Inline CSS for all assignments and exercises
Exercises for Chapter 7
Chapter 8 - Working with inline images for the webpage
Lesson 26 A Guide to Graphics: Vector & Raster Graphics
Lesson 27 A Guide to Images: Alpha Transparency and Images File Formats
Lesson 28 A Guide to Good Practise for the use of Images/ Illustrations in web pages
Lesson 29 A Guide to Using Images in a Webpage
Lesson 30 A Guide to Images: HTML Element for Embedded Content
Lesson 31 A Guide to CSS for Images: Placing Images using CSS Box Properties
Lesson 32 A Guide to Viewing Image Information
Lesson 33 A Guide to re-sizing Images and Saving for Web
Assignment 7: Adding inline images to a webpage
Exercises for Chapter 8
Chapter 9 - HTML Grouping Elements and Classification Properties
Lesson 34 A Guide to lists: HTML Grouping Elements
Lesson 35 A Guide to lists; CSS Classification Properties
Assignment 8: HTML Grouping Elements: Ordered and unordered lists
Assignment 9: CSS Classification Properties: display and list-style
Exercises for Chapter 9
Assignment 10: (Un)ordered lists, images and div
Exercises for Chapter 9
Assignment 11: HTML Grouping Elements for Definition lists
Exercises for Chapter 9
Chapter 10 - HTML5 and CSS3
Lesson 36 A Guide to HTML5: Technology
Lesson 37 HTML5 Document Template
Exercises for Chapter 10.1
Lesson 38 A Guide to hyperlinks: HTML Elements for hyperlinks and image maps
Lesson 39 A Guide to CSS: Separate Style Sheet
Lesson 40 A Guide to CSS: Pseudo-Classes
Assignment 12: Template 1: Creating a liquid webpage layout
Exercises for chapter 10.2
Assignment 13: Template 2: Creating a fixed layout with relative positioning
Exercises for chapter 10.3
CSS Worksheets to photocopy
Chapter 11 - Creating and Publishing a Website
Lesson 41 A Guide to CSS: Visual formatting properties: position, top, right, bottom, left
Assignment 14: CSS Visual formatting
Lesson 42 A Guide to Websites: Types of websites, folder / file structure
Lesson 43 A Guide to Websites: Creating a website
Website Project Proposal Form
Lesson 44 A Guide to Websites: Publishing a website
Lesson 45 A Guide to Creating an online portfolio
Lesson 46 Creating a thumbnail from a print screen
Lesson 47 Webpage Design Portfolio: Web Upload Preparation
Exercises for Chapter 11
Project 1: A Personal Website: A blog
Project Worksheets 1- 7 (to photocopy)
Chapter 12 - HTML Tables, Forms and Media
Lesson 48 A Guide to Tables: HTML Elements for tables
Lesson 49 A Guide to Tables: CSS properties for tables
Assignment 15: HTMl and CSS Tables
Exercises for Tables
Lesson 50 A Guide to Forms: HTML Elements and attributes for forms
Assignment 16: A Contact Form
Lesson 51 A Guide to Placing HTML Elements figure and figcaption
Exercises for figure and figcaption
Exercises for Chapter 12-1
Assignment 19: A Photo Gallery with a jQuery Lightbox
Lesson 52 A Guide to Creating Video and Audio Content for a webpage
Lesson 53 A Guide to Audio & Video: HTML Elements, attributes for embedded media content
Assignment 20: Media: Creating & Inserting audio & video in a webpage
Project 2: A Portfolio Website
Exercises for Chapter 12
Chapter 13 - Responsive Web Design
Lesson 54 A Guide to Responsive Web Design
Lesson 55 A Guide to Using an Opensource Blogging Tool (CMS) - WordPress
Project 3: Creating a wordPress blog