WEB DESIGN 1

Instructor Mr. Coffey

HBT 3131 Web Design 1
Credit: 0.5 Computer or Practical Arts/Technology
Grade: 9, 10, 11, 12
Term: 1 Semester
Books: Online
Web pages are not just for big companies or the rich and famous. In this course, students will learn to apply HTML coding and
the skills of planning, producing, and maintaining a Web site. In addition, students will use graphics, text, and individual
creativity to enhance Web page designs. Skills from this course assist in entrance to the graphics design/technology industry
and are also valuable in other careers. Prerequisite: Computer Applications, Computer Technology, or teacher approval.
Upon successful completion of this course, students will
incorporate the reading, writing, and mathematics state standards stated below;
incorporate occupational standards of communication, organization, technology, thinking skills, work qualifications; and
demonstrate proficiency in the content standards specific to this course as detailed in the pacing guide below.
Academic Standards
RW1.0 - Students read and understand a variety of materials.
RW2.0 - Students write and speak for a variety of purposes and audiences.
RW3.0 - Students write and speak using conventional grammar, usage,
sentence structure, punctuation, capitalization, and spelling.
RW4.0 - Students apply thinking skills to their reading, writing, speaking,
listening and viewing.
MA5.0 - Students use a variety of tools and techniques to measure, apply the
results in problem-solving situations, and communicate the reasoning used in
solving these problems

Occupational Standards
ORG2.0 - Demonstrates the ability to work effectively and efficiently
COM1.0 - Demonstrates the ability to receive and relay information clearly
and effectively
TECH5.0 - Demonstrates the ability to work with a variety of technologies
and equipment
TS3.0 - Demonstrates the ability to use reasoning

Pacing Guide
Week
1

Critical Content/Unit of Study

World Wide Web

Internet
WWW
Browsers
ISP
Modem
URL
W3C
Design Principles/Layout/Page Design

C Contrast
A Alignment
R Repetition
P Proximity
S Spelling
File Formats
Usability
Accessibility
W3C Compliance
HTML Code
Introduce tag syntax and basic tags: html, head, title,
body, paragraph, headings, bold, italics, underline,
superscript, subscript, teletype, comment H

Student outcomes in measurable terms

Essential Question: What are the vocabulary and the basic
history of the internet and the World Wide Web?
Assessment:
Students will be able to identify basic vocabulary.
Students will be able to identify commonly used
acronyms.
Students will be able to describe the basic history of the
internet.
Essential Question: What are the basic design elements that
students will need to develop an effective web page.
Assessment:
Students will be able to identify and implement the core
elements of design.
Students will be able to identify file formats and suffixes.

Essential Question: What are the basic building blocks to create

a web page?
Assessment:
Students will be able to create a basic web page readable
by a browser.

Week

Critical Content/Unit of Study

Student outcomes in measurable terms

Students will be able to identify the basic tags that make
up a web page.

HTML Code
break, paragraph, preformatted, blockquote, list

Essential Question: What are the basic building blocks to create

a web page?
Assessment:
Students will be able to use different tags to create
different effects.
Students will be able to trouble shoot code problems.
Students will be able to develop different pages for
different purposes.

HTML Code
horizontal rule, font, color, alignment, characters,
cascading style sheets

Essential Question: What are the basic building blocks to create

a web page?
Assessment:
Students will be able to use different tags to create
different effects.
Students will be able to trouble shoot code problems.
Students will be able to develop different pages for
different purposes.

Image Formats, Image HTML Codes & backgrounds

Week

Critical Content/Unit of Study

Image Formats
JPEG
PNG
GIF
Image Manipulation

Student outcomes in measurable terms

Essential Question: What are the basic building blocks to create
a web page?
Assessment:
Students will be able to use different image formats for a
variety of purposes.
Students will be able to manipulate according to the needs
of the web page.
Students will be able to ascertain the appropriate use of
images for a purpose.

Copyright Law
Essential Question: What is the importance of Copyright Law
for publishing on the internet?
Assessment:
Students will be able to identify copyright violations.
Students will have an understanding of fair use.
Students will be able to understand the process and
importance of gaining permission for use of copyrighted
material.

Color
Essential Question: What are the basics of color and texture

Week

Assessment:
Students will be able to identify complementary and
contrasting colors.

Link to another web page

Anchors, specific anchor
E-mail
Changing of link color

Essential Question: What are the basic codes to create

hyperlinks and email links?
Assessment:
Students will be able to create the code for hyperlinks.
Students will be able to create the code for email links.

Graphics

11

Student outcomes in measurable terms

usage on web pages?

Links

10

Critical Content/Unit of Study

Color codes
Web safe colors
Review CRAPS

Save and export

Manipulate text and images
Canvas modifications

Table tags & attributes (advanced topic)

Planning
Mapping
Simple Table
Organizing
Adding border
Setting the width

Essential Question: How can graphics be used to enhance a web

page?
Assessment:
Students will be able to manipulate and export graphics
for a web page.
Students will be able to make modifications in order to
enhance the graphics.
Essential Question: How can tables be used to create a
professional looking layout that will be compatible with older
browsers.
Assessment:
Understand how to create a table.

Week

12

13

Critical Content/Unit of Study

Centering a table
Wrapping text around a table
Combining tables
Changing the background
Controlling the space

Dreamweaver
The Basics
Site Set-up
Organize Site
Define Local Site
Saving File
Specifying Background Color
Specifying Default Font Color
Specifying Link Colors
Placing Text on a Page
Changing Font Properties
Adding Horizontal Rules
Special Characters
E-mail Links
Adding Date Automatically
Adding Flash Text

Dreamweaver

Student outcomes in measurable terms

Apply border, width background, cellpadding, cellspacing,
rowspan, and colspan effect to a table.
Create vertical and horizontal sections within a table.
Understand how to write tables that display quickly in the
browser.

Essential Question: What is the difference between writing

HTML code and using software which creates the code?
Assessment:
Students will be able to set up a site using a software
package that is automated.
Students will be able to demonstrate the use of drag and
drop as a way to develop web pages.

Week

Critical Content/Unit of Study

Working with Graphics
Placing Graphics on the Page
Wrapping Text Around Images
Aligning Images and Text
Adding Flash Objects
Adding Flash Animations

14

Assessment:
Students will be able to create web pages with more
advanced components.
Students will be able to identify graphics and components
and use them effectively.

Dreamweaver
Creating Links
Creating Hypertext Links
Targeting a Link
Creating Image Maps
Linking to Named Anchors

15

Student outcomes in measurable terms

Essential Question: What are the basic components of a web
design software package?

Essential Question: What are the basic components of a web

design software package?
Assessment:
Students will be able to create web pages with more
advanced components.
Students will be able to identify graphics and components
and use them effectively.

Dreamweaver
Elements of Page Design
Using Tracing Images
Using Tables for Page Design
Designing in Layout Mode
Cell Formatting
Creating Tables in Standard View
Importing Data from Spreadsheets
Copying and Pasting Table Cells
Selecting Table Elements

Essential Question: What are more advanced elements to

increase the versatility of a web site?
Assessment:
Students will be able to create and use tables as a design
element.
Students will be able to import data.
Students will be able to copy and paste a variety of
information into tables.

Week
16

Critical Content/Unit of Study

Dreamweaver
Adding User Interactivity
Defining a Behavior
Creating Rollover Buttons
Using Insert Rollover Image
Adding Rollovers to Existing Images
Understanding Events
Adding Several Actions to an Object

17

Essential Question: What are more advanced elements to

increase the versatility of a web site?
Assessment:
Students will be able to create and insert rollover buttons
and images.
Students will be able to apply various functions to a
variety of objects to enhance interactivity.

Publishing a Site

18-19

Student outcomes in measurable terms

Define Site
FTP
Connect and Upload

Essential Question: What does it mean to finish and finalize a

web site?
Assessment:
Students will be able to define a site.
Students will be able to connect and upload a site to the
World Wide Web.
Students will be able to describe updating web sites.

Final Project
Create a website for an organization or club

Essential Question: Can students apply all the elements to

create an effective web site?
Assessment:
Students will be able to create an effective web site.
Students will be able to describe the differences between
and effective web site and a poor web site.