Presentation is loading. Please wait.

Presentation is loading. Please wait.

Getting Started with Expression Web 3

Published byCurtis Jefferson Modified over 9 years ago

Similar presentations

Presentation on theme: "Getting Started with Expression Web 3"— Presentation transcript:

1 Getting Started with Expression Web 3
Tutorial 1: Getting Started with Expression Web 3

2 Objectives Session 1.1 Identify the purpose of XHTML and CSS
Change views in the editing window Position, close, and open task panes Describe the function of the status bar New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

3 Objectives Session 1.2 Use the Expression Web editing tools
Cut and paste text Enter page properties for search engines Use the SuperPreview feature New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

4 Visual Overview The Expression Web Workspace
New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

5 How Web Pages Are Created
Computer Languages XHTML (HTML) Extensible Hypertext Markup Language Stricter method of writing HTML code Cascading Style Sheets - CSS Separates structure of a web page from the appearance of the page XHTML and CSS are markup languages Not programming languages Renders (prepares the display of) page content New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

6 How Web Pages Are Created
Working with Expression Web Creates all XHTML and CSS code for you Creates Web pages as they will appear in browser Contains Expression Encoder and Expression Design Creates links to Web pages and updates the XHTML code Contains powerful file management tools Contains full range of editing tools New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

7 Starting Expression Web
Open Expression Web Maximize window Only Common toolbar is displayed (default) Reset Workspace Layout Toolbars are arranged exactly as they appeared during the last session Resetting restores workspace to its default settings New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

8 Starting Expression Web
New Perspectives on Microsoft Expression Web Tutorial 1

9 Starting Expression Web
Navigating the Expression Web Workspace Establishes the overall interface for the Expression Web program Provides menu bar and 11 toolbars Customizable workspace Can dock and resize toolbars New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

10 Starting Expression Web
Saving and Renaming a File Asterisk to right of file name on document tab File needs to be saved Expression gives each new page a default name Untitled_1.html Several documents can be open at the same time Click File menu then click Save As to change the name Type new name Click Save New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

11 Starting Expression Web
New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

12 Starting Expression Web
Using the Editing Window Design view Displays no XHTML or CSS code Displays Web page the way it might look in a browser Code view Displays only XHTML and CSS code Code is automatically created by Expression Web Split view Code pane on top; Design pane on bottom New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

13 Starting Expression Web
New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

14 Starting Expression Web
New Perspectives on Microsoft Expression Web Tutorial 1

15 Starting Expression Web
Working with Web Page Code World Wide Web Consortium (W3C) International organization that controls HTML and CSS standards DOCTYPE Document Type declaration Instruction that identifies the version of HTML used in the web page New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

16 Starting Expression Web
Element Creates content - heading, paragraph, or list Tags Show beginning and ending of an element Usually appear in pairs Start Tag: <p> End Tag: </p> Start <html> tag appears below the document type declaration and ends with an end tag: </html> New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

17 Starting Expression Web
Start <title> and end </title> tags identify what appears in the browser’s title bar All content displayed in the browser is contained within the start <body> and end </end> tags Just content for the web page appears in the browser No HTML or CSS code New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

18 Starting Expression Web
Using the Design Guides Vertical ruler Indicates measurements down the editing window Horizontal ruler Indicates measurements across the editing window Grids Arrangement of horizontal and vertical lines Used to position and align objects in the editing window New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

19 Starting Expression Web
New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

20 Working with Panels Folder List Panel
Lists all files and folders in a Web site Tag Properties Panel Lists all ways an HTML tag at its current location can be modified at the current location of the insertion point CSS Properties Panel Lists the CSS code in effect on the current page where the insertion point is currently positioned New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

21 Starting Expression Web
Toolbox Panel HTML group ASP.NET Controls Apply Styles Panel Use to create and modify CSS styles Manage Styles Panel Use to manage and organize CSS styles New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

22 Working with Panels Using the Status Bar
Located at the bottom of the Workspace Options HTML Incompatibility Visual Aids Code Errors CSS Mode DocType and Schema CSS Schema Download Size Page Size New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

23 Working with Panels New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

24 Visual Overview The SuperPreview Window
New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

25 Entering Text Entering Text Type normally Let text wrap
Press Enter to create a blank line between paragraphs Press Shift + Enter to end a line short of the right margin Enter only one space after any punctuation that ends a sentence New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

26 Entering Text Code Tab (Design view)
Indicates what HTML tag is in effect New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

27 Entering Text Body Tag (Code view) Begins the content of the web page
Nonbreaking space Entered by Expression Web whenever more than one space is entered at a time while typing Extra space shows up in browser New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

28 Entering Text ' (Code view) HTML code for an apostrophe
Appears in code view when an apostrophe is typed in Design view Using Editing Tools Checking the spelling Red wavy line appears under a word that is misspelled Spell check icon is on the Standard toolbar New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

29 Using the Editing Tools
Using the Thesaurus Feature Shows a list of synonyms Press Shift + F7 keys to open the Thesaurus Using Find and Replace Search for text and/or HTML code Using Copy, Cut, and Paste Select not only the text but the surrounding HTML code that provide the formatting the text New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

30 Using the Editing Tools
Changing Page Properties Page Properties dialog box Web page title Appears in browser title bar Keywords A description Used by Web page search engines to locate web pages New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

31 Using the Editing Tools
New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

32 Viewing the File in the Browser
Default browser The one selected to preview a web page Press F12 to view the page in the browser Browser List List of browsers and browser versions installed on your computer View the Web Page With the default browser only In all the versions installed on the computer Save the file first New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

33 Using Snapshot View Using Snapshot View
Displays web page in the default browser using a split screen Top pane Shows document in Design view Bottom pane Shows document as it would appear in the default browser New Perspectives on Microsoft Expression Web Tutorial 1

34 Using Snapshot View New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

35 Using SuperPreview SuperPreview can display the same page in two ways
Using different browsers Using different versions of the same browser in a split screen Baseline browser is the default browser Comparison browser is the browser against which the presently opened file is compared New Perspectives on Microsoft Expression Web Tutorial 1

36 Using SuperPreview SuperPreview toolbar is divided into four groups of buttons Group one buttons control selection Selection Mode Panning Mode Group two buttons control highlighting Box Highlighting Mode Lights Out Highlighting Mode New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

37 Using SuperPreview Group three buttons are toggle buttons
Activates and deactivates a function Group Four buttons control the split and layout Vertical Split Layout Horizontal Split Layout Overlay Layout Single Layout New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

38 Using SuperPreview New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

39 Accessing the Help Feature
Help feature contains three tabs Contents Displays folders that can be expanded to see greater details Index Displays all available topics Search Displays a search box where keywords can be entered New Perspectives on Microsoft Expression Web Tutorial 1

40 Accessing the Help Feature
New Perspectives on Microsoft Expression Web 3.0 Tutorial 1

41 Printing a File Print as you would in many other Windows programs
Use the File menu Use the shortcut Ctrl + P New Perspectives on Microsoft Expression Web Tutorial 1

Download ppt "Getting Started with Expression Web 3"

Similar presentations

Chapter 3 – Web Design Tables & Page Layout

Chapter 3 – Web Design Tables & Page Layout
1 Web Site Design Overview of the Internet Cookie Setton.

1 Web Site Design Overview of the Internet Cookie Setton.
Creating and Editing a Web Page Using Inline Styles

Creating and Editing a Web Page Using Inline Styles
Excel Understanding Excel Fundamentals Microsoft Office 2010 Fundamentals 1.

Excel Understanding Excel Fundamentals Microsoft Office 2010 Fundamentals 1.
Excel Lesson 1 Excel Basics. Task 1  Goals  Learn about Excel  Start Excel  Explore the Excel screen  Explore the Excel workbook  Explore the worksheet.

Excel Lesson 1 Excel Basics. Task 1  Goals  Learn about Excel  Start Excel  Explore the Excel screen  Explore the Excel workbook  Explore the worksheet.
Chapter 2 Creating a Research Paper with Citations and References

Chapter 2 Creating a Research Paper with Citations and References
Tutorial 2: Formatting Text. Objectives Session 2.1 – Learn the functions of the Common toolbar – Change the size of text – Discern which fonts to use.

Tutorial 2: Formatting Text. Objectives Session 2.1 – Learn the functions of the Common toolbar – Change the size of text – Discern which fonts to use.
Microsoft Expression Web-Illustrated Unit L: Using Code Tools.

Microsoft Expression Web-Illustrated Unit L: Using Code Tools.
Exploring Microsoft Word

Exploring Microsoft Word
Introduction to MS Word 2007

Introduction to MS Word 2007
XP Information Technology Center - KFUPM1 Microsoft Office FrontPage 2003 Creating a Web Site.

XP Information Technology Center - KFUPM1 Microsoft Office FrontPage 2003 Creating a Web Site.
FIRST COURSE Getting Started with Microsoft Office 2007.

FIRST COURSE Getting Started with Microsoft Office 2007.
XP New Perspectives on Microsoft Office Word 2003 Tutorial 1 1 Microsoft Office Word 2003 Tutorial 1 – Creating a Document.

XP New Perspectives on Microsoft Office Word 2003 Tutorial 1 1 Microsoft Office Word 2003 Tutorial 1 – Creating a Document.
FIRST COURSE Getting Started with Microsoft Office 2007.

FIRST COURSE Getting Started with Microsoft Office 2007.
Chapter 1 Getting Started With Dreamweaver. Explore the Dreamweaver Workspace The Dreamweaver workspace is where you can find all the tools to create.

Chapter 1 Getting Started With Dreamweaver. Explore the Dreamweaver Workspace The Dreamweaver workspace is where you can find all the tools to create.
Creating Tables in a Web Site Using an External Style Sheet HTML5 & CSS 7 th Edition.

Creating Tables in a Web Site Using an External Style Sheet HTML5 & CSS 7 th Edition.
Key Applications Module Lesson 12 — Word Essentials

Key Applications Module Lesson 12 — Word Essentials
Tutorial 3: Adding and Formatting Text. 2 Objectives Session 3.1 Type text into a page Copy text from a document and paste it into a page Check for spelling.

Tutorial 3: Adding and Formatting Text. 2 Objectives Session 3.1 Type text into a page Copy text from a document and paste it into a page Check for spelling.
Business Computer Information Systems 1A Test 2: Word Basics, Basic Editing, and Formatting Text Lessons 1, 2, and 5 Microsoft Office XP Test 2 – REVIEW.

Business Computer Information Systems 1A Test 2: Word Basics, Basic Editing, and Formatting Text Lessons 1, 2, and 5 Microsoft Office XP Test 2 – REVIEW.
With Alex Conger – President of Webmajik.com FrontPage 2002 Level I (Intro & Training) FrontPage 2002 Level I (Intro & Training)

With Alex Conger – President of Webmajik.com FrontPage 2002 Level I (Intro & Training) FrontPage 2002 Level I (Intro & Training)

Similar presentations

Ads by Google