Web Design Blueprint - Norwich City School District Home Design Blueprint.pdf · Norwich City Schools Web Design Overarching Enduring Understanding: The ability to use technology

Last Updated On: 1/14/2014 1

Norwich City Schools Web Design

Overarching Enduring Understanding: The ability to use technology effectively, productively, and ethically has become an essential skill in almost every aspect of society whether at home, at school, at work, or at play. The Web Design Course is a valuable teaching tool to help students learn about Web Design, understand the fundamental principles for creating and maintaining Web pages, and practice creating complete Web sites. Overarching Essential Question: How will studying Web Design help me be successful in my chosen career? What are some of the academic skills that I will learn in Web Design? Topic: History of The Internet Transferable Concepts:

Performance Indicator

Subtopic Big Ideas Declarative Knowledge (Concepts)

Procedural Knowledge (Skills)

Vocabulary/Key Terms

SCANS Correlations:

Foundation Skills:

Basic Skills: o Reading o Writing o Listening o Mathematics

Thinking Skills: o Creative Skills o Decision

Making o Listening o Seeing Things

in the Mind’s Eye

o Knowing How to Learn

o Reasoning Workplace Skills:

Resources: o Managing

Time o Managing

Money o Managing

Space o Managing

People o Managing

Materials o Managing

Facilities

o History of the Internet and the World Wide Web

o Differences of Internet and the World Wide Web

o Types of Internet connectivity

o Internet technologies and services

o Web Browsers o Plug-Ins

Additional Performance Indicator

Workplace Skills:

Information: o Acquiring Information o Evaluating Information o Organizing &

Maintaining Information o Using Computer to

Process Systems: o Understanding Systems o Designing Systems o Monitoring Systems o Correcting Systems Interpersonal Skills: o Positive Attitudes o Self-Control o Goal-Setting o Responsibility o Teamwork o Managing Stress

Enduring Understanding:

Students will learn about the history and background of the Internet and the World Wide Web. There will also be an overview of the different types of Internet connectivity and web browsers available.

At the conclusion of this unit of study, the student will be able to understand the following concepts: o The history of the Internet

and the World Wide Web. o The differences between

the Internet and the World Wide Web.

o The types of Internet connectivity available.

o The types of Internet technologies and services.

o The differences between web browsers.

o The many types of plug-ins.

Additional Performance

Indicator

Interpersonal Skills: o Positive Attitudes o Self-Control o Goal-Setting o Responsibility o Teamwork o Managing Stress Technology: o Selecting Technology o Applying Technology o Maintaining Technology o Solving Problems o Staying Current in Technology

o Discuss the history of the Internet and the World Wide Web.

o Identify the differences between the Internet and the World Wide Web.

o Discuss the advantages and disadvantages of the different types of Internet connectivity available.

o Identify the different types of Internet technologies and services.

o Identify and discuss the differences between different web browsers.

o Identify the many different types of plug-ins.

o ARPANET o Bandwidth o Browser o Client-Server

Model o DSL o E-Mail o FTP (File Transfer

Protocol) o HTML (HyperText

Markup Language) o HTTP (Hypertext

Transfer Protocol) o Hyperlink o Hypertext o Internet o Intranet o Listserv o Network o Plug – In o Protocol o Router o Search Engine o Server o Source Code o TCP (Transmission

Control Protocol) o TCP/IP o Telnet o URL (Uniform

Resource Locator) o Web Page o Website

Essential Question: The History of the Internet: Who? When? Why? What are some different types of Internet connectivity available? (Identify advantages and disadvantages of each type of connectivity method.) Identify three different web browsers? (Identify advantages and disadvantages of each web browser.)



Overarching Enduring Understanding: The ability to use technology effectively, productively, and ethically has become an essential skill in almost every aspect of society whether at home, at school, at work, or at play. The Web Design Course is a valuable teaching tool to help students learn about Web Design, understand the fundamental principles for creating and maintaining Web pages, and practice creating complete Web sites. Overarching Essential Question: How will studying Web Design help me be successful in my chosen career? What are some of the academic skills that I will learn in Web Design? Topic: Website Development Process Transferable Concepts:





SCANS Correlations:

Foundation Skills:




in the Mind’s Eye




Time o Managing

Money o Managing

Space o Managing

People o Managing


Facilities

o Planning and Implementation

o Purpose and Target Audience

o Navigational Structure

o Content o Web Page Layout o Design Concepts o Organizing Files

and Folders


Workplace Skills:





Students will learn about the overall process of developing a website. The purpose, audience, navigation structure, layout design concepts, and content of a website will be discussed.

At the conclusion of this unit of study, the student will be able to understand the following concepts: o The steps involved in

developing a website. o The purpose and target

audience of a website. o The importance of

navigational structure in a website.

o The content of a website. o Usability standards for web

page layout. o Design concepts of a

website. o Organize website files and

folders.



o Identify the steps involved in developing a website.

o Discuss the importance of identifying the purpose and target audience of a website.

o Identify the importance of a navigational structure within a website.

o Identify what content should appear in a website based on the purpose and target audience of the site.

o Discuss usability standards for web page layout.

o Identify design concepts of a website.

o Discuss the importance of organizing website files and folders.

o Above the Fold o Appropriateness o Bottom Global

Navigation Bar o Breadcrumb Trail o Child Page o Chunking o Consistency o Content o Copyright Notice o Elements o Footer o Header o Local Navigation

Bar o Navigation Bar o Navigation

Structure o Parent Page o Placement o Printer-Friendly

Version o Purpose o Root Folder o Same-Level Page o Target Audience o Time Stamp o Top Global

Navigation Bar o Top-Level Page o Usability o Visual Cue o Web Page Design o Web Page Layout o Website

Development o White Space

Essential Question: What is the most important part of the website development process? What are some different types of navigational structures that a website could use? (Identify advantages and disadvantages of each type of navigational structure.) Why is it important to maintain organized files and folders when working on a website?



Overarching Enduring Understanding: The ability to use technology effectively, productively, and ethically has become an essential skill in almost every aspect of society whether at home, at school, at work, or at play. The Web Design Course is a valuable teaching tool to help students learn about Web Design, understand the fundamental principles for creating and maintaining Web pages, and practice creating complete Web sites. Overarching Essential Question: How will studying Web Design help me be successful in my chosen career? What are some of the academic skills that I will learn in Web Design? Topic: Network, The Internet, & File Naming Rules Transferable Concepts:





SCANS Correlations:

Foundation Skills:




in the Mind’s Eye




Time o Managing

Money o Managing

Space o Managing

People o Managing


Facilities

o Current Computing Technologies

o Categories of Websites

o Netiquette o Social and Ethical

Implications of Computer Use

o IT Careers o HTML File Naming

Rules


Workplace Skills:





Students will learn about current computing technologies, networks, the Internet, IT careers, and the World Wide Web. Issues related to computers, privacy, viruses, and copyright are also discussed. HTML File Naming Rules will also be discussed at length.

At the conclusion of this unit of study, the student will be able to understand the following concepts: o Understand current

computing technologies. o The different categories of

websites and the purpose of each.

o The importance of netiquette on the Internet

o The social and ethical implications associated with computer use.

o The large variety of IT careers available today.

o HTML File Naming Rules



o Discuss current computing technologies.

o Identify the different categories of websites and explain the purpose of each.

o Identify the importance of using netiquette on the Internet.

o Discuss the social and ethical implications associated with computer use.

o Identify the large number of IT careers available.

o Identify and implement the HTML File Naming Rules

Additional Vocabulary

Key Terms o Network o Network Administrator o Network Operating System o Online Profiling o Operating System o Peer-to-Peer Network o Personal Website o Phishing o Piracy o Portal Website o Privacy Policy o Protocol o RAM o ROM o Router o Search Engine o Server o Telecommunications o Top-Level Domain

o Antivirus Program o Applications

Software o Banner Ad o Cable Modem o Cache o Client o Client/Server

Network o Commercial Website o Conventional Modem o Cookie o Copyright o Domain Name o Downloading o Dynamic Pages o E-Commerce

Website o Favorites List o File & File Name o Firewall o History List o Informational

Website o ISDN o ISP o IT o LAN o WAN o Media Website o Netiquette o HTML File Naming

Rules o World Wide Web o Website o Web Browser o Web Designer o Web Developer o Webmaster o Wireless Network o Web Beacon o Web Author o URL o Utility Program o Virus

Essential Question: What are the different categories of websites and what is the purpose of each category? What is netiquette and why is it important to use it on the Internet? Identify at least two different IT Careers available today? What are the HTML File Naming Rules and why should they be used?



Overarching Enduring Understanding: The ability to use technology effectively, productively, and ethically has become an essential skill in almost every aspect of society whether at home, at school, at work, or at play. The Web Design Course is a valuable teaching tool to help students learn about Web Design, understand the fundamental principles for creating and maintaining Web pages, and practice creating complete Web sites. Overarching Essential Question: How will studying Web Design help me be successful in my chosen career? What are some of the academic skills that I will learn in Web Design? Topic: HTML Basics (The Basic Web Page) Transferable Concepts:





SCANS Correlations:

Foundation Skills:




in the Mind’s Eye




Time o Managing

Money o Managing

Space o Managing

People o Managing


Facilities

o Terminology Associated with the World Wide Web

o HTML o HTML - Structure o Creating an HTML

Document o Viewing an HTML

Document


Workplace Skills:





Students will be introduced to HTML through the use of Notepad. They will also spend time creating and viewing HTML documents in a web browser.

At the conclusion of this unit of study, the student will be able to understand the following concepts: o Define terminology

associated with the World Wide Web.

o Describe the structure of an HTML document.

o How to create an HTML document using Notepad.

o Understand how to view HTML documents in a web browser.



o Discuss terminology associated with the World Wide Web.

o Identify the different parts of a basic HTML document.

o Create an HTML document using the program Notepad.

o Identify how to view an HTML document in a web browser.

o HTML o Document Tags o Notepad o HTML Element o HTML Tag o Hyperlink o Visited

Hyperlink o Hexadecimal o Hypertext o Web o Web Browser

Application o Website o <html> o <head> o <title> o <body>

Essential Question: What is the basic structure of an HTML document? What would be the best program to view an HTML document?


Norwich City Schools Web Design Overarching Enduring Understanding: The ability to use technology effectively, productively, and ethically has become an essential skill in almost every aspect of society whether at home, at school, at work, or at play. The Web Design Course is a valuable teaching tool to help students learn about Web Design, understand the fundamental principles for creating and maintaining Web pages, and practice creating complete Web sites. Overarching Essential Question: How will studying Web Design help me be successful in my chosen career? What are some of the academic skills that I will learn in Web Design? Topic: HTML (Body Text & Headings) Transferable Concepts:





SCANS Correlations:

Foundation Skills:




in the Mind’s Eye




Time o Managing

Money o Managing

Space o Managing

People o Managing


Facilities




Document o HTML (Body Text

& Headings)


Workplace Skills:





Students will be introduced to HTML through the use of Notepad. They will also spend time creating, editing and viewing HTML documents in a web browser.






o Describe how to create, edit, and add HTML Tags associated with body text and headings.


Indicator






o Create HTML code associated with body text and headings in a website.

o HTML o HTML Element o HTML Tag o Attribute o Class o Comment o Element o <a> o <br> o <p> o <h1> through

<h6> o <hr> o <link> o <font>

Essential Question: What is the difference between a <br> and a <p>? Explain the difference between the following HTML tags <h1> & <h6>? What are some important things to keep in mind when creating and editing body text in an HTML document?


Norwich City Schools Web Design Overarching Enduring Understanding: The ability to use technology effectively, productively, and ethically has become an essential skill in almost every aspect of society whether at home, at school, at work, or at play. The Web Design Course is a valuable teaching tool to help students learn about Web Design, understand the fundamental principles for creating and maintaining Web pages, and practice creating complete Web sites. Overarching Essential Question: How will studying Web Design help me be successful in my chosen career? What are some of the academic skills that I will learn in Web Design? Topic: HTML (Images, Color Names, & Codes) Transferable Concepts:





SCANS Correlations:

Foundation Skills:




in the Mind’s Eye




Time o Managing

Money o Managing

Space o Managing

People o Managing


Facilities




Document o HTML (Images,

Color Names, & Codes)

Additional


Workplace Skills:











o Describe how to create, edit, and add HTML Tags associated with images, color names, and codes.







o Create HTML code associated with images, color names, and codes in a website.

o HTML o HTML Element o HTML Tag o Attribute o <img> o JPEG o GIF o TIFF o BMP o PNG o PSD o Hexadecimal

Color Codes o Color Names o Width o Height o Graphic Link o Alt Tag

Essential Question: What are the different types of image files that can be used when creating a website? What is the major difference between a .jpg image file and a .gif image file? What is the advantage of using hexadecimal codes to create color in a website? In terms of color, what is always very important to keep in mind when creating a website?


Norwich City Schools Web Design Overarching Enduring Understanding: The ability to use technology effectively, productively, and ethically has become an essential skill in almost every aspect of society whether at home, at school, at work, or at play. The Web Design Course is a valuable teaching tool to help students learn about Web Design, understand the fundamental principles for creating and maintaining Web pages, and practice creating complete Web sites. Overarching Essential Question: How will studying Web Design help me be successful in my chosen career? What are some of the academic skills that I will learn in Web Design? Topic: HTML (Hyperlinks, Graphic Hyperlinks, & URLs) Transferable Concepts:





SCANS Correlations:

Foundation Skills:




in the Mind’s Eye




Time o Managing

Money o Managing

Space o Managing

People o Managing


Facilities




Document o HTML (Hyperlinks,

Graphic Hyperlinks, and URLs)


Workplace Skills:











o Describe how to create, edit, and add HTML Tags associated with hyperlinks, graphic hyperlinks, and URLs.


Indicator






o Create HTML code associated with hyperlinks, graphic hyperlinks and URLs in a website.

o HTML o HTML Element o HTML Tag o Attribute o Hyperlink o Visited Link o Active Link o Protocol o Graphic Link o Image Map o Target o E-Mail Link

Essential Question: Is it important to be accurate when creating a hyperlink in HTML? What is the main difference between a hyperlink and a graphic hyperlink? What are some options associated with opening a hyperlink in a website?


Norwich City Schools Web Design Overarching Enduring Understanding: The ability to use technology effectively, productively, and ethically has become an essential skill in almost every aspect of society whether at home, at school, at work, or at play. The Web Design Course is a valuable teaching tool to help students learn about Web Design, understand the fundamental principles for creating and maintaining Web pages, and practice creating complete Web sites. Overarching Essential Question: How will studying Web Design help me be successful in my chosen career? What are some of the academic skills that I will learn in Web Design? Topic: HTML (Tables & Lists) Transferable Concepts:





SCANS Correlations:

Foundation Skills:




in the Mind’s Eye




Time o Managing

Money o Managing

Space o Managing

People o Managing


Facilities




Document o HTML (Tables &

Lists)


Workplace Skills:











o Describe how to create, edit, and add HTML Tags associated with tables and lists.


Indicator






o Create HTML code associated with tables and lists in a website.

o HTML o HTML Element o HTML Tag o Attribute o Table o Row o Column o Merge o Cell o <table> o <tr> o <td> o Border o Cell Spacing o Cell Padding o Ordered List o Unordered List o <ol> o <ul> o <li> o Copy o Paste

Essential Question: When creating a table in HTML, what should your first step always be? Identify the two different types of lists you can create using HTML? When creating a table or a list you should always try to make use of this computer tool?


Norwich City Schools Web Design Overarching Enduring Understanding: The ability to use technology effectively, productively, and ethically has become an essential skill in almost every aspect of society whether at home, at school, at work, or at play. The Web Design Course is a valuable teaching tool to help students learn about Web Design, understand the fundamental principles for creating and maintaining Web pages, and practice creating complete Web sites. Overarching Essential Question: How will studying Web Design help me be successful in my chosen career? What are some of the academic skills that I will learn in Web Design? Topic: HTML (Frames) Transferable Concepts:





SCANS Correlations:

Foundation Skills:




in the Mind’s Eye




Time o Managing

Money o Managing

Space o Managing

People o Managing


Facilities




Document o HTML (Frames)


Workplace Skills:











o Describe how to create, edit, and add HTML Tags associated with frames.


Indicator






o Create HTML code associated with frames in a website.

o HTML o HTML Element o HTML Tag o Attribute o Rows o Columns o <frameset> o <frame src> o <no resize> o <scrolling> o Mixed Frameset o Target o <frame name>

Essential Question: What are frames and why would a web designer want to use them? Explain what a missed frameset is? How often would you edit the frameset in a website once it has been created?


Norwich City Schools

Web Design Overarching Enduring Understanding: The ability to use technology effectively, productively, and ethically has become an essential skill in almost every aspect of society whether at home, at school, at work, or at play. The Web Design Course is a valuable teaching tool to help students learn about Web Design, understand the fundamental principles for creating and maintaining Web pages, and practice creating complete Web sites. Overarching Essential Question: How will studying Web Design help me be successful in my chosen career? What are some of the academic skills that I will learn in Web Design? Topic: HTML (Forms) Transferable Concepts:





SCANS Correlations:

Foundation Skills:




in the Mind’s Eye




Time o Managing

Money o Managing

Space o Managing

People o Managing


Facilities




Document o HTML (Forms)


Workplace Skills:











o Describe how to create, edit, and add HTML Tags associated with forms.







o Create HTML code associated with forms in a website.

o HTML o HTML Element o HTML Tag o Attribute o Form Tag o Text Field o Text Area Field o Drop Down

Menu o Radio Button o Checkbox o <input> o <input type> o <form name> o <action> o <method> o Action Button o Fieldset o Option Value

Essential Question: What is a form and why would I want to use it when creating a website? What is the main difference between a radio button and a checkbox? Can a form be used to create a simple button that would serve as a link?


Norwich City Schools Web Design Overarching Enduring Understanding: The ability to use technology effectively, productively, and ethically has become an essential skill in almost every aspect of society whether at home, at school, at work, or at play. The Web Design Course is a valuable teaching tool to help students learn about Web Design, understand the fundamental principles for creating and maintaining Web pages, and practice creating complete Web sites. Overarching Essential Question: How will studying Web Design help me be successful in my chosen career? What are some of the academic skills that I will learn in Web Design? Topic: HTML & Cascading Style Sheets (CSS) Transferable Concepts:





SCANS Correlations:

Foundation Skills:




in the Mind’s Eye




Time o Managing

Money o Managing

Space o Managing

People o Managing


Facilities




Document o HTML (Cascading

Style Sheets) & CSS

o


Workplace Skills:











o Describe how to create, edit, and add HTML Tags associated with Cascading Style Sheets. (CSS)


Indicator






o Create HTML code associated with Cascading Style Sheets (CSS) in a website.

o HTML o HTML Element o HTML Tag o Attribute o CSS o Internal Style

Sheet o External Style

Sheet

Essential Question: What is a Cascading Style Sheet and how does it relate to creating a website using HTML? What are the advantages of using a Cascading Style Sheet when creating a website? Explain the difference between an internal and external Cascading Style Sheet?


Norwich City Schools Web Design Overarching Enduring Understanding: The ability to use technology effectively, productively, and ethically has become an essential skill in almost every aspect of society whether at home, at school, at work, or at play. The Web Design Course is a valuable teaching tool to help students learn about Web Design, understand the fundamental principles for creating and maintaining Web pages, and practice creating complete Web sites. Overarching Essential Question: How will studying Web Design help me be successful in my chosen career? What are some of the academic skills that I will learn in Web Design? Topic: HTML & Graphic Organizers (Inspiration) Transferable Concepts:





SCANS Correlations:

Foundation Skills:




in the Mind’s Eye




Time o Managing

Money o Managing

Space o Managing

People o Managing


Facilities


o Hierarchy o Top-Level Page o Same-Level Page o Parent Page o Child Page o Website Sketch


Workplace Skills:





Students will be introduced to the concept of navigational structure through the use of the software program Inspiration. They will also spend time creating, editing and viewing website navigational structures with Inspiration Software.


associated with the navigational structure of a website.

o Describe the structure of a website.

o How to create a navigational structure using the software program Inspiration.

o Understand how to view a website’s navigational structure.

o Describe how to create, edit, and add pages to a website’s navigational structure.


Indicator


o Discuss terminology associated with the navigational structure of a website.

o Identify the different parts of a website’s navigational structure.

o Create a website’s navigational structure using the software program Inspiration.

o Create, edit, and add pages to a website’s navigational structure.


o Hierarchy o Inspiration o Outline o Rapid Fire o Create o Link o Arrange o Note o Hyperlink o Basic Palette o Symbols o Organizational

Chart o Parent Level o Top Level o Child Level o Same Level

Essential Question: What can a website’s navigational structure tell us about the different pages within the website? Explain the difference between a top-level page, same-level page, parent page, and a child page? Why is it important to create a sketch of your website’s navigational structure prior to beginning work on your website?



Overarching Enduring Understanding: The ability to use technology effectively, productively, and ethically has become an essential skill in almost every aspect of society whether at home, at school, at work, or at play. The Web Design Course is a valuable teaching tool to help students learn about Web Design, understand the fundamental principles for creating and maintaining Web pages, and practice creating complete Web sites. Overarching Essential Question: How will studying Web Design help me be successful in my chosen career? What are some of the academic skills that I will learn in Web Design? Topic: Adobe Photoshop (Basics & Layers) Transferable Concepts:





SCANS Correlations:

Foundation Skills:




in the Mind’s Eye




Time o Managing

Money o Managing

Space o Managing

People o Managing


Facilities

o Adobe Photoshop o Copyright o Image Types o Layers o Selection Tools o Text Tool o Move Tool o Color Modes


Workplace Skills:





Students will be introduced to the software program Adobe Photoshop and the benefits it can provide a web design specialist in the development of a website. They will also spend time creating, editing and viewing images that can be used within one of their websites.


associated with the software application Adobe Photoshop.

o Describe how copyright laws play an important role in website design.

o Define the different types of computer generated image files.

o Describe the concept of layers as they are used in Adobe Photoshop.

o Describe how to make use of the many tools available in Adobe Photoshop.


Indicator


o Discuss terminology associated with the software application Adobe Photoshop.

o Identify how the copyright laws will have an impact on how a website is created, updated, and maintained.

o Create a computer generated graphic that distinguishes the differences between the different types of computer generated images.

o Discuss the concept of layers and how it applies to images that are created using Adobe Photoshop.

o Create an image using the many tools found in the program Adobe Photoshop.

o Copyright o Default

Workspace o Palette o Tools Palette o Layer o Layer Palette o History Palette o Color Palette o Swatches Palette o Styles Palette o Actions Palette o .jpg image o .gif image o .psd image o Selection Tools o Lasso o Magnetic Lasso o Polygon Lasso o Magic Wand o Text Tool o Move Tool o Eye Dropper o Zoom Tool o Canvas o Canvas Size o Color Mode o Grayscale o RGB o CMYK o Width o Height o Resolution

Essential Question: What can a web design specialist use the software application Adobe Photoshop for? Explain the concept of layers and how they apply to the software application Adobe Photoshop? Explain how to use some of the many tools that are available in the software program Adobe Photoshop?



Overarching Enduring Understanding: The ability to use technology effectively, productively, and ethically has become an essential skill in almost every aspect of society whether at home, at school, at work, or at play. The Web Design Course is a valuable teaching tool to help students learn about Web Design, understand the fundamental principles for creating and maintaining Web pages, and practice creating complete Web sites. Overarching Essential Question: How will studying Web Design help me be successful in my chosen career? What are some of the academic skills that I will learn in Web Design? Topic: Adobe Photoshop (Manipulating an Image) Transferable Concepts:





SCANS Correlations:

Foundation Skills:




in the Mind’s Eye




Time o Managing

Money o Managing

Space o Managing

People o Managing


Facilities

o Adobe Photoshop o Copyright o Layers o Selection Tools o Text Tool o Move Tool o Healing Tools o Brush Tools o Stamp Tools o Gradient Tools o Manipulation Tools o Filter Options


Workplace Skills:









o Describe the different types of tools that can be used to manipulate an image using the program Adobe Photoshop.


Indicator





o Create a manipulated image using the many manipulation tools found in the program Adobe Photoshop.


Workspace o Palette o Tools Palette o Layer Palette o History Palette o Color Palette o Swatches Palette o Styles Palette o Actions Palette o .jpg image o .gif image o .psd image o Selection Tools o Text Tool o Move Tool o Canvas o Canvas Size o Color Mode o Width o Height o Resolution o Healing Tools o Brush Tools o Stamp Tools o Gradient Tools o Manipulation

Tools o Filter Options

Essential Question: What can a web design specialist use the software application Adobe Photoshop for? Explain the concept of layers and how they apply to the software application Adobe Photoshop? Explain how to use some of the many manipulation tools that are available in the software program Adobe Photoshop?



Overarching Enduring Understanding: The ability to use technology effectively, productively, and ethically has become an essential skill in almost every aspect of society whether at home, at school, at work, or at play. The Web Design Course is a valuable teaching tool to help students learn about Web Design, understand the fundamental principles for creating and maintaining Web pages, and practice creating complete Web sites. Overarching Essential Question: How will studying Web Design help me be successful in my chosen career? What are some of the academic skills that I will learn in Web Design? Topic: Adobe Photoshop (Creating HTML Buttons) Transferable Concepts:





SCANS Correlations:

Foundation Skills:




in the Mind’s Eye




Time o Managing

Money o Managing

Space o Managing

People o Managing


Facilities

o Adobe Photoshop o Copyright o Layers o Shape Tools o Text Tool o Styles o Duplicate Layer o Button o Rollover Button


Workplace Skills:









o Describe the different types of tools that can be used to create buttons using the program Adobe Photoshop.

o Describe the difference between a regular button and a rollover button that could be used in a website.


Indicator





o Create a button using the many tools found in the program Adobe Photoshop.

o Create a rollover button using the many tools found in Adobe Photoshop.


Workspace o Palette o Tools Palette o Layer Palette o History Palette o Color Palette o Swatches Palette o Styles Palette o Actions Palette o .jpg image o .gif image o .psd image o Selection Tools o Text Tool o Move Tool o Canvas o Canvas Size o Color Mode o Width o Height o Resolution o Shape Tools o Styles o Button o Rollover Button o Duplicate Layer

Essential Question: What can a web design specialist use the software application Adobe Photoshop for? Explain the concept of layers and how they apply to the software application Adobe Photoshop? Explain how to create a button or rollover button using some of the many tools that are available in the software program Adobe Photoshop?



Overarching Enduring Understanding: The ability to use technology effectively, productively, and ethically has become an essential skill in almost every aspect of society whether at home, at school, at work, or at play. The Web Design Course is a valuable teaching tool to help students learn about Web Design, understand the fundamental principles for creating and maintaining Web pages, and practice creating complete Web sites. Overarching Essential Question: How will studying Web Design help me be successful in my chosen career? What are some of the academic skills that I will learn in Web Design? Topic: Adobe Photoshop (Creating Animated Images) Transferable Concepts:





SCANS Correlations:

Foundation Skills:




in the Mind’s Eye




Time o Managing

Money o Managing

Space o Managing

People o Managing


Facilities

o Adobe Photoshop o Copyright o Layers o Selection Tools o Stamp Tools o Move Tool o Animation Palette o Tween

Additional


Workplace Skills:









o Describe the different types of tools that can be used to create an animated image using the program Adobe Photoshop.

o Describe the steps necessary to create an animated image that could be used in a website.


Indicator





o Create an animated image using the many tools found in the program Adobe Photoshop.


Workspace o Palette o Tools Palette o Layer Palette o History Palette o Color Palette o Swatches Palette o Styles Palette o Actions Palette o .jpg image o .gif image o .psd image o Selection Tools o Text Tool o Move Tool o Stamp Tools o Canvas o Canvas Size o Color Mode o Width o Height o Resolution o Animation

Palette o Tween o Frames o Duplicate Frame o Animate Once o Animate Forever

Essential Question: What can a web design specialist use the software application Adobe Photoshop for? Explain the concept of layers and how they apply to the software application Adobe Photoshop? Explain how to create an animated image using some of the many tools that are available in the software program Adobe Photoshop?



Overarching Enduring Understanding: The ability to use technology effectively, productively, and ethically has become an essential skill in almost every aspect of society whether at home, at school, at work, or at play. The Web Design Course is a valuable teaching tool to help students learn about Web Design, understand the fundamental principles for creating and maintaining Web pages, and practice creating complete Web sites. Overarching Essential Question: How will studying Web Design help me be successful in my chosen career? What are some of the academic skills that I will learn in Web Design? Topic: WYSIWYG (What You See Is What You Get) Software Application (Introduction) Transferable Concepts:





SCANS Correlations:

Foundation Skills:




in the Mind’s Eye




Time o Managing

Money o Managing

Space o Managing

People o Managing


Facilities

o WYSIWYG o Site Creation

Wizard o Default Workspace o Site View o Site Organization o Toolbars


Workplace Skills:





Students will be introduced to the software program Adobe GoLive and the benefits it can provide a web design specialist in the development of a website. They will also spend time creating, editing and viewing websites that have been created using a WYSIWYG program.

At the conclusion of this unit of study, the student will be able to understand the following concepts: o Describe a WYSIWYG

software application. o Define terminology

associated with the software application Adobe GoLive.

o Describe how to setup a website using the Site Creation Wizard in Abobe GoLive.

o Describe the default workspace in the program Adobe GoLive.

o Discuss the toolbars that are found in Adobe GoLive.


Indicator


o Identify whether or not a

software program is a WYSIWYG software application.

o Discuss terminology associated with the software application Adobe GoLive.

o Identify how to setup a website using the Site Creation Wizard in Adobe GoLive.

o Identify the main components of the default workspace in Adobe GoLive.

o Identify the main features of the toolbars that are found in the program Adobe GoLive.


Wizard o Default

Workspace o Site View o Inspector Palette o Object Palette o Color Palette o Site

Organization o Site Folders o Site Files o CSS o Index o Layout o Source Code

Editor o Preview o Properties o Page Properties o Frame Editor o Outline Editor o Toolbars

Essential Question: What is a WYSIWYG Software Application? Explain how to setup a website using the Site Creation Wizard in Adobe GoLive? Explain the setup of the default workspace in the software program Adobe GoLive? Explain the importance of having site organization, site folders, and site files when creating a website using the software program Adobe GoLive?



Overarching Enduring Understanding: The ability to use technology effectively, productively, and ethically has become an essential skill in almost every aspect of society whether at home, at school, at work, or at play. The Web Design Course is a valuable teaching tool to help students learn about Web Design, understand the fundamental principles for creating and maintaining Web pages, and practice creating complete Web sites. Overarching Essential Question: How will studying Web Design help me be successful in my chosen career? What are some of the academic skills that I will learn in Web Design? Topic: WYSIWYG (What You See Is What You Get) Software Application (Basic Web Page) Transferable Concepts:





SCANS Correlations:

Foundation Skills:




in the Mind’s Eye




Time o Managing

Money o Managing

Space o Managing

People o Managing


Facilities


Wizard o Default Workspace o Site View o Site Organization o Toolbars o Creating New Pages o Using the CSS o Image Folder


Workplace Skills:








associated with the software application Adobe GoLive.

o Describe how to setup a website using the Site Creation Wizard in Abobe GoLive.

o Describe how to create a website using the program Adobe GoLive.

o Discuss the importance of an image folder when creating a website.


Indicator


o Identify whether or not a software program is a WYSIWYG software application.

o Discuss terminology associated with the software application Adobe GoLive.

o Identify how to setup a website using the Site Creation Wizard in Adobe GoLive.

o Create a basic website using the software application Adobe GoLive.

o Identify the main benefits of using an image folder when creating a website using the program Adobe GoLive.

o Identify the main benefits of using a CSS when creating a website using the program Adobe GoLive.


Wizard o Default


Organization o Site Folders o Site Files o CSS o Index o Layout o Source Code

Editor o Preview o Properties o Page Properties o Frame Editor o Outline Editor o Toolbars o New Page o Image Folder

Essential Question: What is a WYSIWYG Software Application? Explain how to setup a website using the Site Creation Wizard in Adobe GoLive? Explain how to create a new page in a website using the software program Adobe GoLive? Explain the benefits of using an image folder and a CSS when creating a website using the software program Adobe GoLive?



Overarching Enduring Understanding: The ability to use technology effectively, productively, and ethically has become an essential skill in almost every aspect of society whether at home, at school, at work, or at play. The Web Design Course is a valuable teaching tool to help students learn about Web Design, understand the fundamental principles for creating and maintaining Web pages, and practice creating complete Web sites. Overarching Essential Question: How will studying Web Design help me be successful in my chosen career? What are some of the academic skills that I will learn in Web Design? Topic: WYSIWYG (What You See Is What You Get) Software Application (Cascading Style Sheets) Transferable Concepts:





SCANS Correlations:

Foundation Skills:




in the Mind’s Eye




Time o Managing

Money o Managing

Space o Managing

People o Managing


Facilities

o WYSIWYG o Default Workspace o CSS Window o CSS o Multiple CSS o Order of Priority


Workplace Skills:








associated with the software application Adobe GoLive and CSS.

o Describe how to create, edit, and manipulate a CSS in Abobe GoLive.

o Describe how to multiple CSS using the program Adobe GoLive.

o Discuss the importance of understanding the order of priority when creating a CSS.


Indicator



o Discuss terminology associated with the software application Adobe GoLive and CSS.

o Identify how to create, edit, and manipulate a CSS in a website using the software program Adobe GoLive.

o Create multiple CSS using the software application Adobe GoLive.

o Identify the importance of order of priority when using a CSS with the software program Adobe GoLive.

o Identify the main benefits of using a CSS when creating a website using the program Adobe GoLive.


Wizard o Default


Organization o Site Folders o Site Files o CSS o CSS Window o CSS Definitions o CSS Source o Markup

Elements o Class o Order of Priority o Color Names o Hexadecimal

Codes o Font Types o Multiple

Cascading Style Sheets

Essential Question: What is a WYSIWYG Software Application? Explain how to create, edit, and manipulate a CSS in a website using the software program Adobe GoLive? Explain the benefits of using multiple CSS when creating a website using the software program Adobe GoLive? Explain the concept of order of priority when dealing with a CSS?



Overarching Enduring Understanding: The ability to use technology effectively, productively, and ethically has become an essential skill in almost every aspect of society whether at home, at school, at work, or at play. The Web Design Course is a valuable teaching tool to help students learn about Web Design, understand the fundamental principles for creating and maintaining Web pages, and practice creating complete Web sites. Overarching Essential Question: How will studying Web Design help me be successful in my chosen career? What are some of the academic skills that I will learn in Web Design? Topic: WYSIWYG (What You See Is What You Get) Software Application (Frames) Transferable Concepts:





SCANS Correlations:

Foundation Skills:




in the Mind’s Eye




Time o Managing

Money o Managing

Space o Managing

People o Managing


Facilities

o WYSIWYG o Default Workspace o Frame Palette o Frame Window o Mixed Frameset o Frame Extras


Workplace Skills:








associated with the software application Adobe GoLive and CSS.

o Describe how to create, edit, and manipulate frames using Abobe GoLive.

o Describe how to create, edit, and manipulate a mixed frameset using the program Adobe GoLive.


Indicator



o Discuss terminology associated with the software application Adobe GoLive and frames.

o Identify how to create, edit, and manipulate a website containing frames using the software program Adobe GoLive.

o Create, edit, and manipulate a mixed frameset using the software application Adobe GoLive.

o Identify the importance of understanding how to use special commands associated with frames.

o Identify the main benefits of using frames when creating a website using the program Adobe GoLive.


Wizard o Default


Organization o Site Folders o Site Files o CSS o Frame Palette o Frame Editor o Frame Name o Frame Target o No-Resize o Scrolling o Lock Scrolling o Columns o Rows o Frameset o Mixed Frameset

Essential Question: What is a WYSIWYG Software Application? Explain how to create, edit, and manipulate a frameset in a website using the software program Adobe GoLive? Explain the benefits of using frames when creating a website using the software program Adobe GoLive?



Overarching Enduring Understanding: The ability to use technology effectively, productively, and ethically has become an essential skill in almost every aspect of society whether at home, at school, at work, or at play. The Web Design Course is a valuable teaching tool to help students learn about Web Design, understand the fundamental principles for creating and maintaining Web pages, and practice creating complete Web sites. Overarching Essential Question: How will studying Web Design help me be successful in my chosen career? What are some of the academic skills that I will learn in Web Design? Topic: WYSIWYG (What You See Is What You Get) Software Application (Advanced Web Pages) & Web Site Design Simulation (Ultimate Fitness) Transferable Concepts:





SCANS Correlations:

Foundation Skills:




in the Mind’s Eye




Time o Managing

Money o Managing

Space o Managing

People o Managing


Facilities

o HTML & Notepad o WYSIWYG o Web Site Design

Simulation o Navigational Flowchart o Getting to Know Your

Client o Target Audience o Completion Timeline


Workplace Skills:

Information: o Acquiring Information o Evaluating Information o Organizing & Maintaining

Information o Using Computer to Process Systems: o Understanding Systems o Designing Systems o Monitoring Systems o Correcting Systems Interpersonal Skills: o Positive Attitudes o Self-Control o Goal-Setting o Responsibility o Teamwork o Managing Stress

Enduring Understanding: Students will be required to show their understanding of Web Design by completing a website design simulation using either HTML & Notepad or Adobe GoLive. They will spend time getting to know their client, their target audience, creating, editing and viewing their version of the client’s website for this simulation.

At the conclusion of this unit of study, the student will be able to understand the following concepts: o Describe an ideal website

navigational format. o Describe the purpose of

individual web pages within a website.

o Describe the importance of maintaining a consistent website design theme and style.

o Describe their client, their target audience, and the purpose of creating a website for their client.

o Describe why it is important for a business to have a comprehensive and professional business website.


Indicator


o Identify which form of website design would be appropriate for this project. (HTML & Notepad or WYSIWYG)

o Discuss terminology associated with the Web Site Design Simulation.

o Identify how to create, edit, and manipulate a professional website based on a specific client’s needs and target audience.

o Create, edit, and manipulate a professional website.

o Identify the importance of understanding the target audience and purpose of a business website.

o Identify the main benefits a business would receive from having a comprehensive and professional business website.

o All Previous Vocabulary & Key Terms

o Simulation o Web Site

Designer o Slogan o Mission

Statement o Target

Audience o Approximate

Completion Time

o Task o Purpose o Design Tip o Checkpoint o Web Fact o Resource CD o Quick

Reference Color Chart

o Hyperlink Alert

o Web Page Planning Form

o Completion Timeline

o Navigational Flowchart

Essential Question: Explain which form of website design would be most appropriate for this project? (HTML & Notepad or WYSIWYG) Explain the importance of understanding the target audience and purpose of a business website? Explain the main benefits a business would receive from having a comprehensive and professional business website?

Documents

Web Design Blueprint - Norwich City School District Home Design Blueprint.pdf · Norwich City Schools Web Design Overarching Enduring Understanding: The ability to use technology