![Page 1: Getting Started with Microsoft Expression Web 3 January 12, 2012](https://reader036.vdocuments.us/reader036/viewer/2022070412/5697bf871a28abf838c88695/html5/thumbnails/1.jpg)
Getting Started with Microsoft Expression Web 3
January 12, 2012
![Page 2: Getting Started with Microsoft Expression Web 3 January 12, 2012](https://reader036.vdocuments.us/reader036/viewer/2022070412/5697bf871a28abf838c88695/html5/thumbnails/2.jpg)
Lesson Overview
For Today:• Explore the Expression Web work
environment.• Locate the tools necessary to create a
simple Web page in Expression Web.
![Page 3: Getting Started with Microsoft Expression Web 3 January 12, 2012](https://reader036.vdocuments.us/reader036/viewer/2022070412/5697bf871a28abf838c88695/html5/thumbnails/3.jpg)
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.
![Page 4: Getting Started with Microsoft Expression Web 3 January 12, 2012](https://reader036.vdocuments.us/reader036/viewer/2022070412/5697bf871a28abf838c88695/html5/thumbnails/4.jpg)
Opening Expression Web
1. Click Start.
2. Point to All Programs.
3. Point to Microsoft Expression.
4. Click Microsoft Expression Web.
![Page 5: Getting Started with Microsoft Expression Web 3 January 12, 2012](https://reader036.vdocuments.us/reader036/viewer/2022070412/5697bf871a28abf838c88695/html5/thumbnails/5.jpg)
Eight main parts of the Expression Web user interface (UI);
![Page 6: Getting Started with Microsoft Expression Web 3 January 12, 2012](https://reader036.vdocuments.us/reader036/viewer/2022070412/5697bf871a28abf838c88695/html5/thumbnails/6.jpg)
Previewing the Expression Web Demo Page Using the Browser mode.
Two ways:• Through File menu• Through the
shortcut icon on the common toolbar.
![Page 7: Getting Started with Microsoft Expression Web 3 January 12, 2012](https://reader036.vdocuments.us/reader036/viewer/2022070412/5697bf871a28abf838c88695/html5/thumbnails/7.jpg)
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)
![Page 8: Getting Started with Microsoft Expression Web 3 January 12, 2012](https://reader036.vdocuments.us/reader036/viewer/2022070412/5697bf871a28abf838c88695/html5/thumbnails/8.jpg)
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.
![Page 9: Getting Started with Microsoft Expression Web 3 January 12, 2012](https://reader036.vdocuments.us/reader036/viewer/2022070412/5697bf871a28abf838c88695/html5/thumbnails/9.jpg)
Vocabulary WordsBread Crumb Trail
• A list at the top of the Expression Web workspace that enables the designer to easily select page elements.
![Page 10: Getting Started with Microsoft Expression Web 3 January 12, 2012](https://reader036.vdocuments.us/reader036/viewer/2022070412/5697bf871a28abf838c88695/html5/thumbnails/10.jpg)
Common Toolbar
• Menus accessed from across the top of the Expression Web workspace.
![Page 11: Getting Started with Microsoft Expression Web 3 January 12, 2012](https://reader036.vdocuments.us/reader036/viewer/2022070412/5697bf871a28abf838c88695/html5/thumbnails/11.jpg)
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.
![Page 12: Getting Started with Microsoft Expression Web 3 January 12, 2012](https://reader036.vdocuments.us/reader036/viewer/2022070412/5697bf871a28abf838c88695/html5/thumbnails/12.jpg)
Folder List
• A task pane in Expression Web that shows the files and folders of the current project.
![Page 13: Getting Started with Microsoft Expression Web 3 January 12, 2012](https://reader036.vdocuments.us/reader036/viewer/2022070412/5697bf871a28abf838c88695/html5/thumbnails/13.jpg)
Layer
• A Web page container that can hold Web elements and be easily positioned on the page.
![Page 14: Getting Started with Microsoft Expression Web 3 January 12, 2012](https://reader036.vdocuments.us/reader036/viewer/2022070412/5697bf871a28abf838c88695/html5/thumbnails/14.jpg)
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.
![Page 15: Getting Started with Microsoft Expression Web 3 January 12, 2012](https://reader036.vdocuments.us/reader036/viewer/2022070412/5697bf871a28abf838c88695/html5/thumbnails/15.jpg)
Toolbox
• A task pane containing icons for the elements that can be added to the page with drag-and-drop actions.
![Page 16: Getting Started with Microsoft Expression Web 3 January 12, 2012](https://reader036.vdocuments.us/reader036/viewer/2022070412/5697bf871a28abf838c88695/html5/thumbnails/16.jpg)
Views
• The designer can work with the Web page content in three views: Design view, Code view, or Split view.
![Page 17: Getting Started with Microsoft Expression Web 3 January 12, 2012](https://reader036.vdocuments.us/reader036/viewer/2022070412/5697bf871a28abf838c88695/html5/thumbnails/17.jpg)
WYSIWYG
• A what-you-see-is-what-you-get work environment that usually involve a drag-and-drop design interface.
![Page 18: Getting Started with Microsoft Expression Web 3 January 12, 2012](https://reader036.vdocuments.us/reader036/viewer/2022070412/5697bf871a28abf838c88695/html5/thumbnails/18.jpg)
Open Expression Demo Web Site!
![Page 19: Getting Started with Microsoft Expression Web 3 January 12, 2012](https://reader036.vdocuments.us/reader036/viewer/2022070412/5697bf871a28abf838c88695/html5/thumbnails/19.jpg)
Your To Do List:
• Open the Demo web site in Expressions.• Complete the Scavenger Worksheet!