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.  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.