Download Title Introduction to Web Page Design

Title
Introduction to Web Page Design
Type
Document
Authors
Subject
Course
Grade(s)
Location
Curriculum Writing History
Notes
Attachments
Consensus
Map
Derek Bishoff, Christopher Shadwell
Business
None Selected
10 , 11 , 12
Page:
1
of
17
Title : Introduction to Web Page Design
Type : Consensus
September
1
2
3
4
October
5
6
7
November
8
9
December
January
February
March
April
May
June
10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40
September/Week 1 - September/Week 2
Creating an HTML Document
September/Week 1 - January/Week 20
Workplace Readiness Skills
September/Week 3 - October/Week 5
Creating Links to Web Pages and Other Files
October/Week 6 - October/Week 8
Formatting Page Elements in HTML
November/Week 9 - November/Week 11
Adding Graphics and Multimedia
November/Week 12 - December/Week 15
Cascading Style Sheets (CSS)
December/Week 16
Getting Started With Adobe Dreamweaver
January/Week 17 - January/Week 20
Formatting Text, Links, and Images in Dreamweaver
Page:
2
of
17
Title : Introduction to Web Page Design
Type : Consensus
Duration: September/Week 1 - September/Week 2
UNIT NAME: Creating an HTML Document
Enduring Understandings
Essential Questions
Knowledge
Skills
Web pages are tools that can be Why would you use a text editor Understand web contents
Write an HTML document
used for
as opposed to a word processor
collecting, organizing, creating, or other program?
Understand URLs
View web page source code
and
presenting information.
What are the necessary steps
Understand W3C coding standards Mark up Web page content with
in order to create a basic HTML
HTML tags
document?
Understand HTML tag sets
Print an HTML document
Why is it important to follow the Define HTML properties and
W3C coding standards when
attributes
creating and marking up Web
content?
Differentiate between open and
closed tags
Plan an HTML document
Standards
8.1.12.A-Technology
Operations and Concepts
(09-12)[State:New Jersey]
8.1.12.D-Digital Citizenship
(09-12)[State:New Jersey]
8.1.12.E-Research and
Information Literacy (09-12)
[State:New Jersey]
9.1.12.A-Critical Thinking and
Problem Solving (09-12)
[State:New Jersey]
9.1.12.F-Accountability,
Productivity, and Ethics (09-12)
[State:New Jersey]
9.3.12.C-Career Preparation
(09-12)[State:New Jersey]
8.2.12.A-Nature of Technology:
Creativity and Innovation (09-12)
[State:New Jersey]
8.2.12.B-Design: Critical
Thinking, Problem Solving, and
Decision-Making (09-12)
[State:New Jersey]
Plans:
Page:
3
of
17
Title : Introduction to Web Page Design
Type : Consensus
Duration: September/Week 1 - January/Week 20
UNIT NAME: Workplace Readiness Skills
Enduring Understandings
Essential Questions
Knowledge
Developing one's personal,
Why is it important to maintain a Understand the methods used
professional, and technology
positive work ethic and attitude to display effective and
knowledge and skills will
at work and/or in the classroom? appropriate workplace behavior
prepare students to contribute in
today's workforce.
When is it appropriate to use
telecommunications devices at
work and/or in school?
Skills
Standards
Demonstrate positive work ethic
by maintaining punctual and
consistent attendance, taking
directions willingly, and
exhibiting motivation to
accomplish the task at hand
9.1.12.A-Critical Thinking and
Problem Solving (09-12)
[State:New Jersey]
9.1.12.C-Collaboration,
Teamwork, and Leadership
(09-12)[State:New Jersey]
9.1.12.D-Cross-Cultural
Demonstrate interpersonal,
Understanding and
teamwork, and leadership skills Interpersonal Communication
necessary to function in a
(09-12)[State:New Jersey]
school and/or business setting
9.1.12.E-Communication and
Media Fluency (09-12)
Demonstrate maturity by
[State:New Jersey]
working in a respectful and
9.1.12.F-Accountability,
friendly manner
Productivity, and Ethics (09-12)
[State:New Jersey]
Apply technology as it relates to 9.3.12.C-Career Preparation
personal and business decision (09-12)[State:New Jersey]
making
8.1.12.A-Technology
Operations and Concepts
(09-12)[State:New Jersey]
8.1.12.B-Creativity and
Innovation (09-12)[State:New
Jersey]
8.1.12.C-Communication and
Collaboration (09-12)[State:New
Jersey]
8.1.12.D-Digital Citizenship
(09-12)[State:New Jersey]
8.1.12.E-Research and
Information Literacy (09-12)
[State:New Jersey]
8.1.12.F-Critical Thinking,
Problem Solving, and DecisionMaking (09-12)[State:New
Jersey]
8.2.12.A-Nature of Technology:
Creativity and Innovation (09-12)
Page:
4
of
17
Title : Introduction to Web Page Design
Type : Consensus
[State:New Jersey]
8.2.12.D-Research and
Information Fluency (09-12)
[State:New Jersey]
8.2.12.E-Communication and
Collaboration (09-12)[State:New
Jersey]
8.2.12.G-The Designed World
(09-12)[State:New Jersey]
Plans:
Page:
5
of
17
Title : Introduction to Web Page Design
Type : Consensus
Duration: September/Week 3 - October/Week 5
UNIT NAME: Creating Links to Web Pages and Other Files
Enduring Understandings
Essential Questions
HTML links are the essential
Why are links useful in web
building blocks for creating Web design?
pages and navigating the
through internet.
How do different types of links
differ from one another?
Why is it important to follow the
W3C coding standards when
creating and marking up Web
content?
Knowledge
Skills
Understand the different
Create internal links
elements of link tags (anchor
tag, attribute, properties, values) Create links to other directories
Understand how to format Web
page links
Create a text-based navigation bar
Create external links
Differentiate between various
link types
Link to external files
Plan a Website structure
Create e-mail links
Create jump links with anchor
name points
Set a target attribute
Add link titles
Standards
8.1.12.A-Technology
Operations and Concepts
(09-12)[State:New Jersey]
8.1.12.B-Creativity and
Innovation (09-12)[State:New
Jersey]
8.1.12.D-Digital Citizenship
(09-12)[State:New Jersey]
8.1.12.E-Research and
Information Literacy (09-12)
[State:New Jersey]
8.1.12.F-Critical Thinking,
Problem Solving, and DecisionMaking (09-12)[State:New
Jersey]
8.2.12.B-Design: Critical
Thinking, Problem Solving, and
Decision-Making (09-12)
[State:New Jersey]
8.2.12.D-Research and
Information Fluency (09-12)
[State:New Jersey]
8.2.12.F-Resources for a
Technological World (09-12)
[State:New Jersey]
8.2.12.G-The Designed World
(09-12)[State:New Jersey]
9.1.12.A-Critical Thinking and
Problem Solving (09-12)
[State:New Jersey]
9.1.12.B-Creativity and
Innovation (09-12)[State:New
Jersey]
9.1.12.E-Communication and
Media Fluency (09-12)
[State:New Jersey]
9.1.12.F-Accountability,
Productivity, and Ethics (09-12)
Page:
6
of
17
Title : Introduction to Web Page Design
Type : Consensus
[State:New Jersey]
9.3.12.C-Career Preparation
(09-12)[State:New Jersey]
Plans:
Page:
7
of
17
Title : Introduction to Web Page Design
Type : Consensus
Duration: October/Week 6 - October/Week 8
UNIT NAME: Formatting Page Elements in HTML
Enduring Understandings
Essential Questions
Font typefaces and colors are
essential for creating an
impact on the user’s
impression of a Web page.
8.1.12.A-Technology
Operations and Concepts
Format characters
(09-12)[State:New Jersey]
Understand fonts and typefaces
8.1.12.B-Creativity and
Define an address block
Innovation (09-12)[State:New
Jersey]
Why is it important to be able to Understand hexadecimal color
Control font selection
codes
8.1.12.E-Research and
format HTML page elements?
Information Literacy (09-12)
Customize fonts
Differentiate ordered and
[State:New Jersey]
How is HTML formatting used
unordered
lists
8.1.12.F-Critical Thinking,
to create visually appealing Web
Create
ordered
and
unordered
lists
Problem Solving, and DecisionPages?
Making (09-12)[State:New
Nest and customize lists
Jersey]
8.2.12.A-Nature of Technology:
Creativity and Innovation (09-12)
[State:New Jersey]
8.2.12.B-Design: Critical
Thinking, Problem Solving, and
Decision-Making (09-12)
[State:New Jersey]
8.2.12.D-Research and
Information Fluency (09-12)
[State:New Jersey]
8.2.12.F-Resources for a
Technological World (09-12)
[State:New Jersey]
8.2.12.G-The Designed World
(09-12)[State:New Jersey]
9.1.12.A-Critical Thinking and
Problem Solving (09-12)
[State:New Jersey]
9.1.12.B-Creativity and
Innovation (09-12)[State:New
Jersey]
9.1.12.E-Communication and
Media Fluency (09-12)
[State:New Jersey]
9.1.12.F-Accountability,
Why is it important to follow
the W3C coding standards
when creating and marking up
Web content?
Knowledge
Skills
Understand HTML Formatting
Methods
Align text
Standards
Page:
8
of
17
Title : Introduction to Web Page Design
Type : Consensus
Productivity, and Ethics (09-12)
[State:New Jersey]
9.3.12.C-Career Preparation
(09-12)[State:New Jersey]
Plans:
Page:
9
of
17
Title : Introduction to Web Page Design
Type : Consensus
Duration: November/Week 9 - November/Week 11
UNIT NAME: Adding Graphics and Multimedia
Enduring Understandings
Essential Questions
Knowledge
Images and media are valuable
Web design tools that are used
to draw the users attention and
enhance Web content.
How can you use HTML tag sets Plan graphics use
to insert and manipulate images
and media?
Understand optimized image
settings
How do you determine which
image file format is fits best for
Differentiate different image file
your desired outcome?
formats
Skills
Standards
Insert and edit images using
HTML tags, properties, and
values
8.1.12.A-Technology
Operations and Concepts
(09-12)[State:New Jersey]
8.1.12.B-Creativity and
Innovation (09-12)[State:New
Jersey]
8.1.12.C-Communication and
Collaboration (09-12)[State:New
Jersey]
8.1.12.D-Digital Citizenship
(09-12)[State:New Jersey]
8.1.12.E-Research and
Information Literacy (09-12)
[State:New Jersey]
8.1.12.F-Critical Thinking,
Problem Solving, and DecisionMaking (09-12)[State:New
Jersey]
8.2.12.A-Nature of Technology:
Creativity and Innovation (09-12)
[State:New Jersey]
8.2.12.B-Design: Critical
Thinking, Problem Solving, and
Decision-Making (09-12)
[State:New Jersey]
8.2.12.D-Research and
Information Fluency (09-12)
[State:New Jersey]
8.2.12.F-Resources for a
Technological World (09-12)
[State:New Jersey]
8.2.12.G-The Designed World
(09-12)[State:New Jersey]
9.1.12.A-Critical Thinking and
Problem Solving (09-12)
[State:New Jersey]
9.1.12.B-Creativity and
Innovation (09-12)[State:New
Change image file formats
Optimize images for web use
How can Adobe Photoshop be
used to aid in Web page
design?
Resize images
Insert a background image
Use images as links
Insert an image map
Insert media files such as .mov
or .swf
Apply basic Adobe Photoshop
functions in order to enhance
the impact of Web images
Page:
10
of
17
Title : Introduction to Web Page Design
Type : Consensus
Jersey]
9.1.12.E-Communication and
Media Fluency (09-12)
[State:New Jersey]
9.1.12.F-Accountability,
Productivity, and Ethics (09-12)
[State:New Jersey]
9.3.12.C-Career Preparation
(09-12)[State:New Jersey]
Plans:
Page:
11
of
17
Title : Introduction to Web Page Design
Type : Consensus
Duration: November/Week 12 - December/Week 15
UNIT NAME: Cascading Style Sheets (CSS)
Enduring Understandings
Essential Questions
Cascading Style Sheets (CSS)
How can you create and apply
help to efficiently determine the styles more efficiently?
properties of HTML components
across Web pages in a site.
What is a Cascading Style
Sheet?
What elements are necessary
to properly format a Cascading
Style Sheet and its rules?
Knowledge
Skills
Define style sheet, rules,
selectors, declarations,
properties, and values as they
relate to Cascading Style
Sheets
Create CSS documents and rules
Standards
8.1.12.A-Technology
Operations and Concepts
Control text formatting using CSS (09-12)[State:New Jersey]
8.1.12.B-Creativity and
Set and edit background colors and Innovation (09-12)[State:New
images using CSS
Jersey]
Understand how to create and
8.1.12.E-Research and
format a CSS document
Change link properties with CSS
Information Literacy (09-12)
[State:New Jersey]
Recognize the difference
Specify alternate link colors
8.1.12.F-Critical Thinking,
between a CSS Rule and a CSS
Problem Solving, and DecisionClass Rule
Apply page margins using CSS
Making (09-12)[State:New
Jersey]
Define external vs internal
Apply text alignment using CSS
8.2.12.A-Nature of Technology:
styles sheets
Creativity and Innovation (09-12)
Format lists using CSS
[State:New Jersey]
8.2.12.B-Design: Critical
Create and apply CSS class rules
Thinking, Problem Solving, and
Decision-Making (09-12)
Create and link external style sheets [State:New Jersey]
8.2.12.D-Research and
Information Fluency (09-12)
[State:New Jersey]
8.2.12.F-Resources for a
Technological World (09-12)
[State:New Jersey]
8.2.12.G-The Designed World
(09-12)[State:New Jersey]
9.1.12.A-Critical Thinking and
Problem Solving (09-12)
[State:New Jersey]
9.1.12.B-Creativity and
Innovation (09-12)[State:New
Jersey]
9.1.12.E-Communication and
Media Fluency (09-12)
[State:New Jersey]
9.1.12.F-Accountability,
Page:
12
of
17
Title : Introduction to Web Page Design
Type : Consensus
Productivity, and Ethics (09-12)
[State:New Jersey]
9.3.12.C-Career Preparation
(09-12)[State:New Jersey]
Plans:
Page:
13
of
17
Title : Introduction to Web Page Design
Type : Consensus
Duration: December/Week 16
UNIT NAME: Getting Started With Adobe Dreamweaver
Enduring Understandings
Essential Questions
Knowledge
Skills
Understanding the Adobe
Dreamweaver workspace and
panels allows you to effectively
and efficiently create and edit
Web documents.
How can Dreamweaver help to
cut down Web design time?
Understanding why folder
assets should be named
View the Dreamweaver
Workspace
What tools and/or functions
does Dreamweaver have that
help to eliminate syntax errors
that may be common when
"hand" coding HTML
documents?
Plan the layout of a Webpage
Adobe Dreamweaver can help
to provide a deeper
understanding of basic HTML
coding practices.
What are the view options
provided by Adobe
Dreamweaver? Which one
works best?
Standards
8.1.12.A-Technology
Operations and Concepts
(09-12)[State:New Jersey]
Work with views and panels
8.1.12.B-Creativity and
Innovation (09-12)[State:New
Using panel groups
Jersey]
8.1.12.C-Communication and
Dock panel groups
Collaboration (09-12)[State:New
Jersey]
Open a web page
8.1.12.F-Critical Thinking,
Problem Solving, and DecisionDefine a Website, local root
Making (09-12)[State:New
folder, and assets folder, using
Jersey]
Adobe Dreamweaver
8.2.12.B-Design: Critical
Thinking, Problem Solving, and
Open and create different
Decision-Making (09-12)
document types with
[State:New Jersey]
Dreamweaver
8.2.12.G-The Designed World
(09-12)[State:New Jersey]
View web page elements
9.1.12.A-Critical Thinking and
Problem Solving (09-12)
View a web page in a browser
[State:New Jersey]
window
9.1.12.B-Creativity and
Innovation (09-12)[State:New
Choose a window size
Jersey]
9.1.12.E-Communication and
Save and closing Dreamweaver Media Fluency (09-12)
files
[State:New Jersey]
9.1.12.F-Accountability,
Create a folder for web site
Productivity, and Ethics (09-12)
management
[State:New Jersey]
9.3.12.C-Career Preparation
Manage files
(09-12)[State:New Jersey]
Add a folder to your web site
Use the files panel for file
management
Page:
14
of
17
Title : Introduction to Web Page Design
Type : Consensus
Save a web page
Plans:
Page:
15
of
17
Title : Introduction to Web Page Design
Type : Consensus
Duration: January/Week 17 - January/Week 20
UNIT NAME: Formatting Text, Links, and Images in Dreamweaver
Enduring Understandings
Essential Questions
Knowledge
Software that allows you to
create Web sites efficiently,
while still providing you with the
same amount of coding control,
is an essential element to
creating successful Web
projects in a timely manner.
How can Dreamweaver help to
make formatting text and links
more efficient?
Understand the difference
Import text
between HTML formatting and
CSS formatting in Dreamweaver Import a Microsoft Word file into
Dreamweaver
Identify the proper method for
inserting and editing images
Set basic text properties
using Adobe Dreamweaver
Create ordered and unordered
list
How do I add and edit text
properties and attributes using
Adobe Dreamweaver?
How do I efficiently create
various types of links using
Adobe Dreamweaver?
How do you insert and edit
images using adobe
Dreamweaver?
Skills
Standards
8.1.12.A-Technology
Operations and Concepts
(09-12)[State:New Jersey]
8.1.12.B-Creativity and
Innovation (09-12)[State:New
Jersey]
8.1.12.E-Research and
Information Literacy (09-12)
[State:New Jersey]
8.2.12.A-Nature of Technology:
Insert an image using the Insert Creativity and Innovation (09-12)
Panel
[State:New Jersey]
8.2.12.B-Design: Critical
Align and format an image
Thinking, Problem Solving, and
Decision-Making (09-12)
Enhance an image
[State:New Jersey]
8.2.12.D-Research and
Resize an image using the
Information Fluency (09-12)
property inspector
[State:New Jersey]
8.2.12.F-Resources for a
Use alternate text and setting
Technological World (09-12)
accessibility preferences
[State:New Jersey]
8.2.12.G-The Designed World
Insert and control a background (09-12)[State:New Jersey]
image
9.1.12.A-Critical Thinking and
Problem Solving (09-12)
[State:New Jersey]
9.1.12.B-Creativity and
Innovation (09-12)[State:New
Jersey]
9.1.12.E-Communication and
Media Fluency (09-12)
[State:New Jersey]
9.1.12.F-Accountability,
Productivity, and Ethics (09-12)
[State:New Jersey]
9.3.12.C-Career Preparation
(09-12)[State:New Jersey]
Page:
16
of
17
Title : Introduction to Web Page Design
Type : Consensus
Plans:
Page:
17
of
17