Getting Started with Microsoft Expression Web 3

January 12, 2012

Lesson Overview

For Today:• Explore the Expression Web work

environment.• Locate the tools necessary to create a

simple Web page in Expression Web.

Worksheet Questions:• In software applications, there are multiple

ways to complete the same task. How many different ways can you think of to save a document?

• From the bottom up, explain the process of making a sandwich with meat, cheese, lettuce, and tomato.

Opening Expression Web1. Click Start.2. Point to All Programs.3. Point to Microsoft Expression.4. Click Microsoft Expression Web.

Eight main parts of the Expression Web user interface (UI);

Previewing the Expression Web Demo Page Using the Browser mode.

Two ways:• Through File menu• Through the

shortcut icon on the common toolbar.

WYSIWYG vs. Coding(What-you-see-is-what-you-get)

• WYSIWYG is a technique that allows a designer to select page desighn elements from a menu and drag them onto the work surface. (Do this throught the Design View within Expression Web.)

• Coding is the process of writing HTML code which, when read by a browser, create the Web page seen on the monitor. (Work in code view in Expression Web)

Expression Web allows:

• A designer to work on a Web page in either the Design View or the Code View. These views, as well as a Split View showing both, are accessed throught the View Tabs at the bottom of the work area.

Vocabulary WordsBread Crumb Trail

• A list at the top of the Expression Web workspace that enables the designer to easily select page elements.

Common Toolbar

• Menus accessed from across the top of the Expression Web workspace.

File Tabs

• Small tabs across the top of the Expression Web workspace which offer a convenient means to bring open Web document into view within the workspace.

Folder List

• A task pane in Expression Web that shows the files and folders of the current project.

Layer

• A Web page container that can hold Web elements and be easily positioned on the page.

Task Pane

• A term given to the many small windows within the Expression Studio work environments that provide access to specific Web elements for creating and modifying the element.

Toolbox

• A task pane containing icons for the elements that can be added to the page with drag-and-drop actions.

Views

• The designer can work with the Web page content in three views: Design view, Code view, or Split view.

WYSIWYG

• A what-you-see-is-what-you-get work environment that usually involve a drag-and-drop design interface.

Open Expression Demo Web Site!

Your To Do List:

• Open the Demo web site in Expressions.• Complete the Scavenger Worksheet!