 Using Microsoft Expression Web you can: › Create Web pages and Web sites › Set what you site will look like as you design it › Add text, images, multimedia files, and scripts to your Web pages › Create Web sites that adhere to Web standards › Create Cascading Style Sheets to format and lay out your pages › Manage your Web site › Publish you Web Site

 Web page- text file, usually written in a language called HTML.  HTML- (Hypertext Markup Language)- code that references formats, images, and other multimedia files.  Web Site- collection of related Web pages, linked together  Web browser- software that interprets HTML code and displays it as the text and images you see on a Web page. › Microsoft Internet Explorer, Mozilla Firefox, Google Chrome, Apple Safari

 WYSIWYG (pronounced WEZ-EE-WIG) › What You See Is What You Get  Allows you to see what you page will look like in a browser as you build it  Allows you to create Web pages without knowing any HTML code.

 Web Standards- guidelines for creating a web page. › Just like when writing papers you have to follow grammar and spelling, you have to follow HTML codes to create a website. › If an HTML code is incorrect the website will not work.

 Cascading Style Sheets (CSS), often just called style sheets › CSS are rules that describe the presentation and visual design of a page, including fonts, colors, and often the layout and positioning of elements on a page.

 Expression Web organizes the files to ensure you keep track of: › HTML files, › CSS files, › Images and multimedia files, › Scripts, › Hyperlink files

 Web server- computer connected to the Internet that stores Web pages and other Web content and displays it to a Web browser.  Publish- copying your Web pages and related files from your computer to a Web server.  (Starting Expression Web- Page 4)

 Title Bar- appears at the very top of the program window › Shows the title of the current Web site (if a site is open) or Web page (if only a page is open)  Menu Bar- located under the title bar › Includes all Expression Web commands organized into menu such as File and Edit

 Common Toolbar- located under the menu bar, provides access to common tasks in Expression Web › Tasks Include: creating a new page, saving and opening files, and common text formatting options.

 Task panes- small, resizable windows that provide access to tools for specific tasks. › They appear on either side of the Expression Web window › Four task panes are displayed by default:  Folder List- Top Left  Tag Properties- bottom left  Toolbox- top right  Apply Styles- bottom right  Many task panes have more than one tab.

 Editing Window- large area under the Common Toolbar where you do most of your design work.  A tab appears at the top of the editing window to indicate the Web Page open. › If you open additional web pages, additional tabs appear

 Quick Tab Selector Bar- located just below the tag area › Allows you to easily select and edit specific HTML tags on your Web page  Different view options are located on Bottom left corner › Show Design View, Show Split View, Show Code View

 Status Bar- located along the bottom of the program window. › Provides helpful information such as:  Current location of the insertion point  Instructions for getting help  Current settings › For the page currently working on:  Indicated file size  Page dimensions  Which versions of HTML & CSS are being used

TITLE BAR MENU BAR QUICK TAG SELECTOR BAR WEB PAGE TAB STATUS BAR EDITING WINDOW TASK PANES COMMON TOOLBAR

 Web pages and Web sites can be viewed in the browser  They may not always look the same in a browser, we need to preview to be sure. › (Steps on page 8)

 Viewing Options › Design View- shows what a page will look like when viewed in a browser. › Code View- displays the HTML code that the page is written in › Split View- combination of design and code view  Task panes appear in all views and can be opened, closed, expanded, collapsed, and rearranged › (page 10)

 When designing a site you will be using different elements.  You can use the Visual Aids to help you separate the elements so you do not need to use Code View. › (Page 12)

 Getting Help- Page 14  Printing and Closing a Page and Exiting Expression Web – Page 16  Complete Concept Review- Page  Complete Skills Review- Page  Real-Life Challenge- page 21