Microsoft® Expression® Web

An Introduction to the Your Learning Guide to Expression Web tutorial

The Expression Web Tutorial:Lessons for Analyzing, Evaluating, and Sharing through Technology

Goals:

Encourage teachers and students to integrate technology

as a tool for learning and communicating into all curricular

areas

Focus on essential questions—questions of importance that

require analysis and evaluation, and encourage sharing of

knowledge through technology

Teaching and Learning resources Teacher materials

Teaching Guides Instructional presentation Tutorial plus additional online resources Evaluation Rubrics

Student materials Tutorial Reflection materials Online resources

Learning Sequence

Analyze an essential question and defend answer

Conduct research to support answer

Learn Microsoft Expression Web software

Produce a Web site to communicate learning

Evaluate learning

Introduction Web Development

Exploring Expression Web

Microsoft Expression Web

A modern, professional Web design environment

Intuitive tools

Builds high-quality, standards-based Web sites

HTML, CSS, and other formats possible

Our focus: Dynamic Web Templates (DWTs)

Dynamic Web Templates (DWTs)How do they work?

What is a dynamic Web template?A dynamic Web template (DWT) is an HTML-based master copy of a Web page that can serve as the basic design for any number of additional pages. DTW’s can contain settings, formatting, and page elements such as text, graphics, page layout, and styles. These settings, formatting, and page elements are non-editable on the DTWs. DTWs allow the designer to include editable regions within the template so that different elements can be included in the pages created from templates.

Non Editable Regions

Editable Regions

Why use DWTs? Allows the designer to create a consistent look

between all the pages of the Web site. Provides for the use of Cascading Style Sheets

(CSS) Provides for the consistent use of a header Provides for the consistent use of navigation

buttons

Why use DWTs? Templates save time for the user.

Templates create a uniform look for all of the pages of a Web site.

Templates follow the premise: Design once, use often.

Working with Expression Web

A drop-and-drag interface for quick and easy

design

Create dynamic, interactive pages

Offers features of Web 2.0 development

Enables layers, style sheets, dynamic Web

templates, interactive buttons, and more

The Environment

Toolbox

Layers

Invisible containers used to organize Web page content

Allow for precise location of controls on a Web page

Can contain most of the other controls

Layers are most easily selected and manipulated using

the Layer Task Panel and the CSS Properties Task Panel.

CSS

Employs sound design principle: Separate design from content.

Styles can be modified from the preformatted tags such as

<h1>.

New styles can be created to fit the Web page needs such as

the specification of aligning images.

CSS allows for easy transfer of styles used for tags or

formatting from one page to another.

Makes for efficient Web page development & saves time.

External Style Sheets (CSS)

The CSS (cascading style sheet) file is saved

independently of the Web page so it can be applied to

other projects.

This description of formatting for tags is saved in an

external (non-HTML) document that can be applied to

other pages, even other Web site projects.

Links

“If it weren’t for links there would be no World Wide

Web!”

Links offer connectivity from site to site.

Links can be created to access pages in the same site or

to access other sites.

Both text and graphics can serve as the source from

which to create a link.

Summary

The project you will create for this project encourages

analysis, evaluation, and sharing through the

development of a Web site to answer an essential

question.

Microsoft Expression Web is a modern Web

development environment for creating sites with Web

2.0 features.

In the Microsoft Expression Web Tutorial project

students will learn to create Web features such as

layers, style sheets, dynamic buttons, and Dynamic

Web Templates.

Learning Tasks Complete the Beaches Around the World

tutorial to learn Expression Web design techniques.

Answer the question, “What “e-cessory”—electronic accessory—has had the greatest impact upon you, your family, friends, or community?”

Research the selected e-cessory and justify your answer according to the guidelines established by your teacher.

Use Expression Web to create a Web site to communicate your learning.

Evaluate your work with a the guided provided.