Web Development Program: Year 9 Information Technology
This course introduces web designers to the nuts and bolts of HTML (HyperText Markup Language), the programming language used to create web pages. The course covers what
HTML is, how it's structured, and presents the major tags and features of the language. Students discover how to format text and lists, add images and flow text around them,
link to other pages and sites, embed audio and video, and create HTML forms. Additional tutorials cover the new elements in HTML5, the latest version of HTML, and prepare
students to start working with Cascading Style Sheets (CSS).The lessons are about skill-building in using Khan Academy and allow students to apply their knowledge.
Overview
Target learner:
This course has been designed for year 9 group students.
Version/Length: Length: 10 lessons (could be spreads across more)
Outcomes:
See lesson plan grid
Equipment and Software:
Tutorial ideas:
Access to PC (students can work in pair on a workstation). Google Chrome web Browser, Microsoft Office Apps to record progress.
http://www.khanacademy.org/computing/computer-programming/html-css
Prerequisites
Learners may be familiar with some basic image manipulation tools. They should have an understanding of basic binary. Students should be able to:
 Manage folders and files
 Use Word to edit and save files
o Editing the ‘header’ of a Word document
 Take screen prints and crop them.
 Level 3 in reading and writing skills.
Parameters of the Learning Program
Reviewing the learning program
Teachers review the Learning Program after each session. Teaching resources are reviewed, improved and customised to suit learners’ needs. Learner achievements are analysed
to improve the delivery of the learning program and develop learning strategies. ICT teachers continually monitor, review and improve/adjust the materials as required.
Assessment
Learners are assessed based on the completion of tutorials, exercises and project diary file. Students update their project diary at the end of every lesson that shows evidence of
their work using screenshots of their work. Students explain the skills they have learned and what they could improve in their learning and skills.
LLN support
Learning: The tutorials are designed to be ‘visual’, however, help students with reading difficulties to work through them.
Reading: Video tutorials “Show Me” have been provided to cater literacy difficulties (reading comprehension) and learning.
Writing: Allow mainly use of screenshots and bullet points in the project diary.
Web Development Program
Week
Learning Objectives
LESSON 1





Understanding the
Internet and the
World Wide Web
How the Internet
works
Understand the
ways in which the
Internet is used to
communicate
Understand IP
addresses and URLs
Understand what
the terms http,
HTML, hyperlink
and navigation
mean
1
Teaching
Activities and
Resources
Refer to
PowerPoint,
notes and
lesson plan
Differentiation
(SEN & G&T)
SEN – Might need support to create
folders and initially locate the
required documents.
Expected Pupils’ Outcomes:
By the end of the lesson pupils
should have learnt to:
The tutorials are designed to be
‘visual’, however, help students
with reading difficulties to work
through them.

Video tutorials and Teacher live
demo to cater literacy difficulties
(reading comprehension) and
learning.
Allow mainly use of screenshots
and bullet points in the project
diary.
G&T – encourage to complete
challenge exercises
These lessons are primarily
differentiated by outcome.
Less able learners should still be
able to access all lessons although
the rate of progress may be slower
than that of other learners.
Teachers may exceed the projected
duration if they feel this would be
more suitable for the classes they
are teaching.
Extension activities have been
embedded, where appropriate, to
enable more able learners to be
pushed within their skills and
knowledge. Many of the activities
require practice to achieve
adequate results so in this case
learners should be given additional
activities to complete, perhaps
following online tutorials.
Web Development Program
Learning Outcomes/
Final Project
How computers connect to
the Internet, and the different
hardware and software
required
Assessment Opportunities (!) &
Resources ()
!
Student electronic
worksheets
 Worksheet completed
 Students maintain project
diary
 Thumbs up/down to gauge
how well students took to lesson.
 Interactive activities allow
self-assessment
Criteria being assessed
Key vocabulary
Self Assessment



Create and save a
markup language
document
Use a markup
language without the
automated generation
of code
Student validated
markup code results in
commonly used
browsers
HTML skeleton
HTML tags for text,
links, lists
HTML tags and web
standards for
images (graphics)
Simple layouts
Complex layouts
HTML tags for
layout
HTML tags for
tables
HTML tags for styles
Internal CSS style
sheets
External CSS style
sheets
WWW
Tags
Web pages
Web site
Browser
ISP
Internet
Protocol
TCP/IP
FTP
SMTP
HTTP
HTML
Hypertext Markup
language
Address bar
Week
Learning Objectives
LESSON 2
Intro to HTML

Learn what HTML is
and how to make a
webpage with
marked up text and
images.

Using headings and
font markup
elements

HTML basics

HTML: Text
emphasis
Teaching
Activities and
Resources
Refer to Khan
Academy
Differentiation
(SEN & G&T)
SEN – Might need support to create
folders and initially locate the
required documents.
The tutorials are designed to be
‘visual’, however, help students
with reading difficulties to work
through them.
Video tutorials and Teacher live
demo to cater literacy difficulties
(reading comprehension) and
learning.
Allow mainly use of screenshots
and bullet points in the project
diary.
G&T – encourage to complete
challenge exercises
2
Less able learners should still be
able to access all lessons although
the rate of progress may be slower
than that of other learners.
Teachers may exceed the projected
duration if they feel this would be
more suitable for the classes they
are teaching.
Extension activities have been
embedded, where appropriate, to
enable more able learners to be
pushed within their skills and
knowledge. Many of the activities
require practice to achieve
adequate results so in this case
learners should be given additional
activities to complete, perhaps
following online tutorials.
Web Development Program
Learning Outcomes/
Final Project
Expected Pupils’ Outcomes:
By the end of the lesson pupils
should have learnt to:
 Create and debug local
HTML pages
 Design and develop basic
web pages using HTML and
CSS.
 Use graphics in Web pages.
 Use tables in Web pages.
 Link pages so that they
create a Web site.
 Design and develop web
pages using CSS styles,
internal and/or external
style sheets.
 Design and develop web
pages using CSS for layout.
Assessment Opportunities (!) &
Resources ()
!
Student electronic
worksheets
 Worksheet completed
 Students maintain project
diary
 Thumbs up/down to gauge
how well students took to lesson.
 Interactive activities allow
self-assessment


Challenge: Write a Poem
Challenge: You can learn
text tags
Criteria being assessed
Self Assessment

Create and save a
markup language
document

Use a markup
language without the
automated generation
of code.

Students validate
markup code results in
commonly used
browsers
Key vocabulary
HTML skeleton
HTML tags for text,
links, lists
HTML tags and web
standards for
images (graphics)
Simple layouts
Complex layouts
HTML tags for
layout
HTML tags for
tables
HTML tags for styles
Internal CSS style
sheets
External CSS style
sheets
WWW
Tags
Web pages
Web site
Browser
ISP
Internet
Protocol
TCP/IP
FTP
SMTP
HTTP
HTML
Hypertext Markup
language
Address bar
Week
Learning Objectives
Teaching
Activities and
Resources
LESSON 3
Intro to HTML

Learn what HTML is
and how to make a
webpage with
marked up text and
images.

HTML: Lists

HTML: Images
Refer to Khan
Academy
Differentiation
(SEN & G&T)
SEN – Might need support to create
folders and initially locate the
required documents.
The tutorials are designed to be
‘visual’, however, help students
with reading difficulties to work
through them.
Video tutorials and Teacher live
demo to cater literacy difficulties
(reading comprehension) and
learning.
Allow mainly use of screenshots
and bullet points in the project
diary.
G&T – encourage to complete
challenge exercises
3
Less able learners should still be
able to access all lessons although
the rate of progress may be slower
than that of other learners.
Teachers may exceed the projected
duration if they feel this would be
more suitable for the classes they
are teaching.
Extension activities have been
embedded, where appropriate, to
enable more able learners to be
pushed within their skills and
knowledge. Many of the activities
require practice to achieve
adequate results so in this case
learners should be given additional
activities to complete, perhaps
following online tutorials.
Web Development Program
Learning Outcomes/
Final Project
Expected Pupils’ Outcomes:
By the end of the lesson pupils
should have learnt to:
 Create and debug local
HTML pages
 Design and develop basic
web pages using HTML and
CSS.
 Use graphics in Web pages.
 Use tables in Web pages.
 Link pages so that they
create a Web site.
 Design and develop web
pages using CSS styles,
internal and/or external
style sheets.
 Design and develop web
pages using CSS for layout.
Assessment Opportunities (!) &
Resources ()
!
Student electronic
worksheets
 Worksheet completed
 Students maintain project
diary
 Thumbs up/down to gauge
how well students took to lesson.
 Interactive activities allow
self-assessment


Challenge: Your learning list
Challenge: A picture-perfect
trip
Criteria being assessed
Self Assessment

Create and save a
markup language
document

Use a markup
language without the
automated generation
of code.

Students validate
markup code results in
commonly used
browsers
Key vocabulary
HTML skeleton
HTML tags for text,
links, lists
HTML tags and web
standards for
images (graphics)
Simple layouts
Complex layouts
HTML tags for
layout
HTML tags for
tables
HTML tags for styles
Internal CSS style
sheets
External CSS style
sheets
WWW
Tags
Web pages
Web site
Browser
ISP
Internet
Protocol
TCP/IP
FTP
SMTP
HTTP
HTML
Hypertext Markup
language
Address bar
Week
Learning Objectives
LESSON 4
Intro to CSS

Learn how to write
simple CSS rules, to
select based on
element, class, or
ID, and change the
colors of your page.

CSS Basics

CSS: Selecting by id
Teaching
Activities and
Resources
Refer to Khan
Academy
Differentiation
(SEN & G&T)
SEN – Might need support to create
folders and initially locate the
required documents.
The tutorials are designed to be
‘visual’, however, help students
with reading difficulties to work
through them.
Video tutorials and Teacher live
demo to cater literacy difficulties
(reading comprehension) and
learning.
Allow mainly use of screenshots
and bullet points in the project
diary.
G&T – encourage to complete
challenge exercises
4
Less able learners should still be
able to access all lessons although
the rate of progress may be slower
than that of other learners.
Teachers may exceed the projected
duration if they feel this would be
more suitable for the classes they
are teaching.
Extension activities have been
embedded, where appropriate, to
enable more able learners to be
pushed within their skills and
knowledge. Many of the activities
require practice to achieve
adequate results so in this case
learners should be given additional
activities to complete, perhaps
following online tutorials.
Web Development Program
Learning Outcomes/
Final Project
Expected Pupils’ Outcomes:
By the end of the lesson pupils
should have learnt to:
 Create and debug local
HTML pages
 Design and develop basic
web pages using HTML and
CSS.
 Use graphics in Web pages.
 Use tables in Web pages.
 Link pages so that they
create a Web site.
 Design and develop web
pages using CSS styles,
internal and/or external
style sheets.
 Design and develop web
pages using CSS for layout.
Assessment Opportunities (!) &
Resources ()
!
Student electronic
worksheets
 Worksheet completed
 Students maintain project
diary
 Thumbs up/down to gauge
how well students took to lesson.
 Interactive activities allow
self-assessment


Challenge: Colorful creature
Challenge: Seasonal ids
Criteria being assessed
Self Assessment

Create and save a
markup language
document

Use a markup
language without the
automated generation
of code.

Students validate
markup code results in
commonly used
browsers
Key vocabulary
HTML skeleton
HTML tags for text,
links, lists
HTML tags and web
standards for
images (graphics)
Simple layouts
Complex layouts
HTML tags for
layout
HTML tags for
tables
HTML tags for styles
Internal CSS style
sheets
External CSS style
sheets
WWW
Tags
Web pages
Web site
Browser
ISP
Internet
Protocol
TCP/IP
FTP
SMTP
HTTP
HTML
Hypertext Markup
language
Address bar
Week
Learning Objectives
LESSON 5
More HTML tags

Learn how to make
links, tables, and
comments.

HTML links

HTML internal links
Teaching
Activities and
Resources
Refer to Khan
Academy
Differentiation
(SEN & G&T)
SEN – Might need support to create
folders and initially locate the
required documents.
The tutorials are designed to be
‘visual’, however, help students
with reading difficulties to work
through them.
Video tutorials and Teacher live
demo to cater literacy difficulties
(reading comprehension) and
learning.
Allow mainly use of screenshots
and bullet points in the project
diary.
G&T – encourage to complete
challenge exercises
5
Less able learners should still be
able to access all lessons although
the rate of progress may be slower
than that of other learners.
Teachers may exceed the projected
duration if they feel this would be
more suitable for the classes they
are teaching.
Extension activities have been
embedded, where appropriate, to
enable more able learners to be
pushed within their skills and
knowledge. Many of the activities
require practice to achieve
adequate results so in this case
learners should be given additional
activities to complete, perhaps
following online tutorials.
Web Development Program
Learning Outcomes/
Final Project
Expected Pupils’ Outcomes:
By the end of the lesson pupils
should have learnt to:
 Create and debug local
HTML pages
 Design and develop basic
web pages using HTML and
CSS.
 Use graphics in Web pages.
 Use tables in Web pages.
 Link pages so that they
create a Web site.
 Design and develop web
pages using CSS styles,
internal and/or external
style sheets.
 Design and develop web
pages using CSS for layout.
Assessment Opportunities (!) &
Resources ()
!
Student electronic
worksheets
 Worksheet completed
 Students maintain project
diary
 Thumbs up/down to gauge
how well students took to lesson.
 Interactive activities allow
self-assessment


Challenge: Links you love
Challenge: Jump around
Criteria being assessed
Self Assessment

Create and save a
markup language
document

Use a markup
language without the
automated generation
of code.

Students validate
markup code results in
commonly used
browsers
Key vocabulary
HTML skeleton
HTML tags for text,
links, lists
HTML tags and web
standards for
images (graphics)
Simple layouts
Complex layouts
HTML tags for
layout
HTML tags for
tables
HTML tags for styles
Internal CSS style
sheets
External CSS style
sheets
WWW
Tags
Web pages
Web site
Browser
ISP
Internet
Protocol
TCP/IP
FTP
SMTP
HTTP
HTML
Hypertext Markup
language
Address bar
Week
Learning Objectives
LESSON 6
More HTML tags

Learn how to make
links, tables, and
comments.

HTML tables

HTML comments
Teaching
Activities and
Resources
Refer to Khan
Academy
Differentiation
(SEN & G&T)
SEN – Might need support to create
folders and initially locate the
required documents.
The tutorials are designed to be
‘visual’, however, help students
with reading difficulties to work
through them.
Video tutorials and Teacher live
demo to cater literacy difficulties
(reading comprehension) and
learning.
Allow mainly use of screenshots
and bullet points in the project
diary.
G&T – encourage to complete
challenge exercises
6
Less able learners should still be
able to access all lessons although
the rate of progress may be slower
than that of other learners.
Teachers may exceed the projected
duration if they feel this would be
more suitable for the classes they
are teaching.
Extension activities have been
embedded, where appropriate, to
enable more able learners to be
pushed within their skills and
knowledge. Many of the activities
require practice to achieve
adequate results so in this case
learners should be given additional
activities to complete, perhaps
following online tutorials.
Web Development Program
Learning Outcomes/
Final Project
Expected Pupils’ Outcomes:
By the end of the lesson pupils
should have learnt to:
 Create and debug local
HTML pages
 Design and develop basic
web pages using HTML and
CSS.
 Use graphics in Web pages.
 Use tables in Web pages.
 Link pages so that they
create a Web site.
 Design and develop web
pages using CSS styles,
internal and/or external
style sheets.
 Design and develop web
pages using CSS for layout.
Assessment Opportunities (!) &
Resources ()
!
Student electronic
worksheets
 Worksheet completed
 Students maintain project
diary
 Thumbs up/down to gauge
how well students took to lesson.
 Interactive activities allow
self-assessment


Challenge: The dinner table
Project: Recipe book
Criteria being assessed
Self Assessment

Create and save a
markup language
document

Use a markup
language without the
automated generation
of code.

Students validate
markup code results in
commonly used
browsers
Key vocabulary
HTML skeleton
HTML tags for text,
links, lists
HTML tags and web
standards for
images (graphics)
Simple layouts
Complex layouts
HTML tags for
layout
HTML tags for
tables
HTML tags for styles
Internal CSS style
sheets
External CSS style
sheets
WWW
Tags
Web pages
Web site
Browser
ISP
Internet
Protocol
TCP/IP
FTP
SMTP
HTTP
HTML
Hypertext Markup
language
Address bar
Week
Learning Objectives
LESSON 7
CSS text properties

Learn how to style
your text, like font
families, size,
spacing, and
alignment.

CSS Zen Garden

CSS font-family
property

CSS font-size
property
Teaching
Activities and
Resources
Refer to Khan
Academy
Differentiation
(SEN & G&T)
SEN – Might need support to create
folders and initially locate the
required documents.
The tutorials are designed to be
‘visual’, however, help students
with reading difficulties to work
through them.
Video tutorials and Teacher live
demo to cater literacy difficulties
(reading comprehension) and
learning.
Allow mainly use of screenshots
and bullet points in the project
diary.
G&T – encourage to complete
challenge exercises
7
Less able learners should still be
able to access all lessons although
the rate of progress may be slower
than that of other learners.
Teachers may exceed the projected
duration if they feel this would be
more suitable for the classes they
are teaching.
Extension activities have been
embedded, where appropriate, to
enable more able learners to be
pushed within their skills and
knowledge. Many of the activities
require practice to achieve
adequate results so in this case
learners should be given additional
activities to complete, perhaps
following online tutorials.
Web Development Program
Learning Outcomes/
Final Project
Expected Pupils’ Outcomes:
By the end of the lesson pupils
should have learnt to:
 Create and debug local
HTML pages
 Design and develop basic
web pages using HTML and
CSS.
 Use graphics in Web pages.
 Use tables in Web pages.
 Link pages so that they
create a Web site.
 Design and develop web
pages using CSS styles,
internal and/or external
style sheets.
 Design and develop web
pages using CSS for layout.
Assessment Opportunities (!) &
Resources ()
!
Student electronic
worksheets
 Worksheet completed
 Students maintain project
diary
 Thumbs up/down to gauge
how well students took to lesson.
 Interactive activities allow
self-assessment


Challenge: Fancy font
families
Challenge: Great big font
sizes
Criteria being assessed
Self Assessment

Create and save a
markup language
document

Use a markup
language without the
automated generation
of code.

Students validate
markup code results in
commonly used
browsers
Key vocabulary
HTML skeleton
HTML tags for text,
links, lists
HTML tags and web
standards for
images (graphics)
Simple layouts
Complex layouts
HTML tags for
layout
HTML tags for
tables
HTML tags for styles
Internal CSS style
sheets
External CSS style
sheets
WWW
Tags
Web pages
Web site
Browser
ISP
Internet
Protocol
TCP/IP
FTP
SMTP
HTTP
HTML
Hypertext Markup
language
Address bar
Week
Learning Objectives
LESSON 7
CSS text properties

Learn how to style
your text, like font
families, size,
spacing, and
alignment.

CSS font styles and
shorthand

More CSS text
properties

CSS inheritance
Teaching
Activities and
Resources
Refer to Khan
Academy
Differentiation
(SEN & G&T)
SEN – Might need support to create
folders and initially locate the
required documents.
The tutorials are designed to be
‘visual’, however, help students
with reading difficulties to work
through them.
Video tutorials and Teacher live
demo to cater literacy difficulties
(reading comprehension) and
learning.
Allow mainly use of screenshots
and bullet points in the project
diary.
G&T – encourage to complete
challenge exercises
8
Less able learners should still be
able to access all lessons although
the rate of progress may be slower
than that of other learners.
Teachers may exceed the projected
duration if they feel this would be
more suitable for the classes they
are teaching.
Extension activities have been
embedded, where appropriate, to
enable more able learners to be
pushed within their skills and
knowledge. Many of the activities
require practice to achieve
adequate results so in this case
learners should be given additional
activities to complete, perhaps
following online tutorials.
Web Development Program
Learning Outcomes/
Final Project
Expected Pupils’ Outcomes:
By the end of the lesson pupils
should have learnt to:
 Create and debug local
HTML pages
 Design and develop basic
web pages using HTML and
CSS.
 Use graphics in Web pages.
 Use tables in Web pages.
 Link pages so that they
create a Web site.
 Design and develop web
pages using CSS styles,
internal and/or external
style sheets.
 Design and develop web
pages using CSS for layout.
Assessment Opportunities (!) &
Resources ()
!
Student electronic
worksheets
 Worksheet completed
 Students maintain project
diary
 Thumbs up/down to gauge
how well students took to lesson.
 Interactive activities allow
self-assessment



Challenge: Famous font
formats
Quiz: text properties
Project: Blog
Criteria being assessed
Self Assessment

Create and save a
markup language
document

Use a markup
language without the
automated generation
of code.

Students validate
markup code results in
commonly used
browsers
Key vocabulary
HTML skeleton
HTML tags for text,
links, lists
HTML tags and web
standards for
images (graphics)
Simple layouts
Complex layouts
HTML tags for
layout
HTML tags for
tables
HTML tags for styles
Internal CSS style
sheets
External CSS style
sheets
WWW
Tags
Web pages
Web site
Browser
ISP
Internet
Protocol
TCP/IP
FTP
SMTP
HTTP
HTML
Hypertext Markup
language
Address bar