Tải bản đầy đủ (.pdf) (30 trang)

Sams Teach Yourself Microsoft Expression Web 3 in 24 Hours- P1 ppsx

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (413.46 KB, 30 trang )

ptg
800 East 96th Street, Indianapolis, Indiana, 46240 USA
Morten
Rand-Hendriksen
Sams Teach Yourself
24
in
Hours
Microsoft
Expression
®
Web 3
From the Library of Lee Bogdanoff
ptg
Sams Teach Yourself Microsoft Expression®Web 3 in 24 Hours
Copyright © 2010 by Sams Publishing
All rights reserved. No part of this book shall be reproduced, stored in a retrieval system, or
transmitted by any means, electronic, mechanical, photocopying, recording, or otherwise, without
written permission from the publisher. No patent liability is assumed with respect to the use of
the information contained herein. Although every precaution has been taken in the preparation of
this book, the publisher and author assume no responsibility for errors or omissions. Nor is any
liability assumed for damages resulting from the use of the information contained herein.
ISBN-13: 978-0-672-33064-3
ISBN-10: 0-672-33064-4
Library of Congress Cataloging-in-Publication Data:
Rand-Hendriksen, Morten.
Sams teach yourself Microsoft Expression Web 3 in 24 hours / Morten Rand-Hendriksen.
p. cm.
ISBN 978-0-672-33064-3
1. Web sites—Authoring programs. 2. Microsoft Expression Web. 3. Web site development. I.


Title.
TK5105.8883.R362 2009
006.7’8—dc22
2009032708
Printed in the United States of America
First Printing September 2009
Trademarks
All terms mentioned in this book that are known to be trademarks or service marks have been
appropriately capitalized. Sams Publishing cannot attest to the accuracy of this information. Use
of a term in this book should not be regarded as affecting the validity of any trademark or service
mark.
Warning and Disclaimer
Every effort has been made to make this book as complete and as accurate as possible, but no
warranty or fitness is implied. The information provided is on an “as is” basis. The author and the
publisher shall have neither liability nor responsibility to any person or entity with respect to any
loss or damages arising from the information contained in this book or from the use of programs
accompanying it.
Bulk Sales
Sams Publishing offers excellent discounts on this book when ordered in quantity for bulk pur-
chases or special sales. For more information, please contact
U.S. Corporate and Government Sales
1-800-382-3419

For sales outside of the U.S., please contact
International Sales

Acquisitions Editor
Loretta Yates
Development
Editor

Todd Brakke
Managing Editor
Kristy Hart
Project Editor
Anne Goebel
Copy Editor
Apostrophe Editing
Services
Indexer
Larry Sweazy
Proofreader
Keith Cline
Technical Editors
Anna Ullrich
Doug Holland
Publishing
Coordinator
Cindy Teeters
Book Designer
Gary Adair
Composition
Jake McFarland
Gloria Schurick
From the Library of Lee Bogdanoff
ptg
Contents at a Glance
Introduction 1
HOUR 1 Get to Know Microsoft Expression Web 3
5
2 Beginning at the End: A Walkthrough of the Finished Project

23
3 A Website Is Really Just Text: Build One in 5 Minutes
39
4 Building a Home Page: A Look Behind the Curtain
53
5 Getting Connected with (Hyper)Links: The Cornerstone of the
World Wide Web
65
6 Getting Visual, Part 1: Adding Images and Graphics
81
7 Getting Visual, Part 2: Advanced Image Editing,
Thumbnails, and Hotspots
95
8 Cracking the Code: Working in Code View
111
9 Getting Boxed In, Part 1: Using Tables for Tabular Content
127
10 Bringing Style to Substance with Cascading Style Sheets
145
11 Getting Boxed In, Part 2: Knee Deep in CSS
165
12 Styling with Code: Fully Immersed in CSS
183
13 Getting Visual, Part 3: Images as Design Elements with CSS
203
14 Harnessing the Power of CSS Layouts
221
15 Buttons, Buttons, Buttons
243
16 Using Behaviors

259
17 Frames and Layers
283
18 Building a Functional Menu
307
19 Dynamic Web Templates
327
20 Getting Interactive with Forms
347
21 Working with Flash and Silverlight
365
22 Beyond the Basics, Part 1: PHP in Expression Web 3
383
23 Test Twice, Publish Once: Introducing SuperPreview
403
24 Publishing Your Website
427
25 Beyond the Basics, Part 2: Building a Site with ASP.NET
445
APPENDIX
A Building Layers-Based Menus
465
From the Library of Lee Bogdanoff
ptg
Table of Contents
Introduction 1
HOUR 1: Get to Know Microsoft Expression Web 3 5
Introducing Expression Web 3 5
Getting and Installing Expression Web 3
7

Getting Acquainted with the Workspace
7
The Program Bar
7
The Menu Bar
8
Common and Other Toolbars
9
Code, Design, and Split View
10
Left and Right Panels
12
Status Bar
14
Changing and Customizing the Workspace
15
HOUR 2:
Beginning at the End: A Walkthrough of the Finished Project 23
Introduction 23
Working with a Completed Website
24
Previewing the Site in Your Browser
27
Setting Up a Website and Building Pages
28
Hyperlinks
28
Images
28
Tables

28
Styling the Content
29
Page Layout
29
Buttons
30
Behaviors
30
Frames and Layers
30
The Main Menu
31
From the Library of Lee Bogdanoff
ptg
Contact Forms 31
Flash and Silverlight Galleries
32
Exploring the Website in Expression Web 3
33
Keeping Your Pages Functional
35
HOUR 3:
A Website Is Really Just Text: Build One in 5 Minutes 39
Introduction 39
Creating a New Website
39
Creating Your First Web Page
42
Testing Your Web Page in Multiple Browsers

47
SuperPreview: A Sneak Preview
49
HOUR 4:
Building a Home Page: A Look Behind the Curtain 53
Introduction 53
Opening and Editing an Existing File Using Code View
53
Importing Styled Text from a Document
57
Cleaning Up Imported Text
58
HOUR 5:
Getting Connected with (Hyper)Links: The Cornerstone of the
World Wide Web 65
Introduction 65
Import a New Page and Create an Internal Hyperlink
66
Creating External Links and New Windows
72
Creating Internal Links Within Documents Using Bookmarks
74
Creating an Email Hyperlink
76
HOUR 6:
Getting Visual, Part 1: Adding Images and Graphics 81
Introduction 81
Images on the Web: Three File Types for Three Uses
82
Importing and Inserting an Image

83
Create a New Folder and Import a New Image
84
Using Picture Properties to Change the Appearance of an Image
87
The General Tab
87
The Appearance Tab
89
Contents
v
From the Library of Lee Bogdanoff
ptg
HOUR 7: Getting Visual, Part 2: Advanced Image Editing,
Thumbnails, and Hotspots 95
Introduction 95
Exploring the Pictures Toolbar
96
Using the Pictures Toolbar to Add and Change an Image
98
Creating Hotspots
105
HOUR 8:
Cracking the Code: Working in Code View 111
Introduction 111
Tools in Code View
112
The Buttons of the Code View Toolbar and What They Do
112
Common HTML Tags in the Toolbox

115
Using Code View as a Learning Tool
116
Dissecting Hyperlinks in Code View
116
Images in Code View
119
Unordered and Ordered Lists in Code View
120
HOUR 9:
Getting Boxed In, Part 1: Using Tables for Tabular Content 127
Introduction 127
One-Minute History of Tables in Web Pages
128
Creating a Table from Scratch
129
Changing the Appearance of a Table
130
Creating Table Headings
130
Changing the Vertical Alignment of Cell Content
131
Adding Rows and Columns to the Table
132
Merging and Splitting Cells
132
Deleting Cells, Rows, and Columns from the Table
133
Changing Row and Column Sizes
133

Using Table Properties to Change the Appearance of Your Table
134
Using Cell Properties to Change the Appearance of Your Cells
136
Using AutoFormat to Quickly Change the Look of Your Tables
138
Using the Table Layout Tool to Make Nonstandard Tables
139
vi
Sams Teach Yourself Microsoft Expression Web 3 in 24 Hours
From the Library of Lee Bogdanoff
ptg
HOUR 10: Bringing Style to Substance with Cascading Style Sheets 145
Introduction 145
CSS Sans Code
147
Creating Styles with a Click of Your Mouse
147
Creating Inline Styles
150
Styling Small Selections
151
Setting the Font Family for the Entire Document
152
Styling Links (a.k.a. Getting Rid of the Blue Underline)
153
CSS Tools in Expression Web 3
156
The Quick Tag Tools
156

The CSS Properties Panel
158
The Apply Styles Panel
159
The Manage Styles Panel
159
Using Various CSS Tools to Apply and Change Styles
160
HOUR 11:
Getting Boxed In, Part 2: Knee Deep in CSS 165
Introduction 165
CSS Classes—Because Not All Content Should Be Treated Equally
166
Create a Class and Apply It to the Content
166
Using CSS Classes to Center an Image
167
Using Boxes to Separate Content
168
Creating a Div and Placing It Around Content
169
Introducing ID—Class’s Almost Identical Twin
171
Creating a Sidebar Using an ID
171
Using an ID to Center the Page
172
Creating Custom Styles Within IDs and Classes
174
Classes Within Classes: Micromanaging the Content

175
Using Classes to Control IDs
176
Pseudoclasses
176
Use Pseudoclasses to Style Links
177
Understanding the Box Model
178
Contents
vii
From the Library of Lee Bogdanoff
ptg
HOUR 12: Styling with Code: Fully Immersed in CSS 183
Introduction 183
Introducing CSS: The Code Version
184
The Value of Separation
186
Understanding Inline Styles
187
Applying Classes to Tags in Code View
189
Using Divs and Spans to Separate Content
190
Rename Styles and Apply the Change to All Tags in a Page
191
Creating Divs in Code View
192
Creating External Style Sheets

193
Moving Styles to and from the External Style Sheet
196
Applying External Styles to a Page
198
Summary
199
HOUR 13:
Getting Visual, Part 3: Images as Design Elements with CSS 203
Introduction 203
Images as Backgrounds: A Crash Course
204
Use an Image as a Background with CSS
204
The Background Attributes
205
How Backgrounds Relate to the Content and the Page
207
Applying a Background Image to an ID
208
Background Images and the Box Model
210
Stacking Order Means You Can Pile Your Images
212
Using Images as List Bullets
213
Importing Adobe Photoshop Files
215
HOUR 14:
Harnessing the Power of CSS Layouts 221

Introduction 221
Starting with Pen and Paper
222
Build the Framework from Boxed Parts
223
Employing CSS Reset
224
Updating the ID Names
225
Styling the Layout Boxes
226
viii
Sams Teach Yourself Microsoft Expression Web 3 in 24 Hours
From the Library of Lee Bogdanoff
ptg
Understanding Positioning 229
position: absolute;
229
position: fixed;
230
position: relative;
231
position: static;
232
position: inherit
232
Applying the Framework to Existing Pages
232
Apply the New Framework to the Page
234

Adding a Header Image and a Menu
236
HOUR 15:
Buttons, Buttons, Buttons 243
Introduction 243
Buttons: A Brief Definition
244
Creating Interactive Buttons Using Expression Web 3
244
Make an Interactive Button
244
Saving and Editing Interactive Buttons
247
Creating Buttons from Scratch Using CSS
248
Creating a Basic Box Button
248
Creating an Advanced Box Button with Images
250
Create Text-Free Buttons with Sliding Doors
253
HOUR 16:
Using Behaviors 259
Introduction 259
Behaviors: An Introduction
259
Creating a Swap-Image Behavior
260
Modifying Behaviors
262

The Many Behaviors of Expression Web 3
264
Call Script
265
Change Property
265
Change Property Restore
268
Check Browser
268
Check Plug-In
270
Go to URL
272
Contents
ix
From the Library of Lee Bogdanoff
ptg
Jump Menu 272
Jump Menu Go
274
Open Browser Window
275
Play Sound
277
Popup Message
277
Preload Images
278
Set Text

279
HOUR 17:
Frames and Layers 283
Introduction 283
Frames: An Introduction
284
Editing Individual Frames
287
Making Framed Navigation
291
Creating and Modifying Inline Frames
292
Set Text of Frame Behavior
295
Creating Advanced Functionality Using Layers
297
Creating a Layer
298
Set Text of Layer Behavior
302
HOUR 18:
Building a Functional Menu 307
Introduction 307
Making the Basic Vertical Menu Exciting
308
The Horizontal Menu—Laying a List on Its Side
311
Pure CSS Drop-Down Menus: A Clean Alternative
312
Step 1: Make a Menu List

313
Step 2: Styling the Main Menu
314
Step 3: Making the Drop-Down Menus Drop Down
319
Styling the Submenus to Make Them Stand Out
321
HOUR 19:
Dynamic Web Templates 327
Introduction 327
Dynamic Web Templates
328
How Dynamic Web Templates Work
332
x
Sams Teach Yourself Microsoft Expression Web 3 in 24 Hours
From the Library of Lee Bogdanoff
ptg
Understanding Dynamic Web Templates 336
Editable Regions Outside the Body
340
Editing Content Outside the Editable Regions in Individual Pages
343
HOUR 20:
Getting Interactive with Forms 347
Introduction 347
Creating Forms in Expression Web 3
348
Making Use of Form Results
355

Other Uses for Form Results
360
Forms in Code View
361
HOUR 21:
Working with Flash and Silverlight 365
Introduction 365
Flash: An Introduction
366
Adding the <embed> Tag for Full Cross-Browser Compatibility
371
Silverlight: An Introduction
372
Placing Silverlight Applications in Your Page
373
Bonus: Making the Galleries Your Own
378
HOUR 22:
Beyond the Basics, Part 1: PHP in Expression Web 3 383
Introduction 383
PHP: An Introduction
384
Installing PHP on Your Computer to Test PHP Scripts
385
Using PHP and HTML to Create a Contact Page
388
Creating an Email Form Using PHP
390
Added Functionality
397

HOUR 23:
Test Twice, Publish Once: Introducing SuperPreview 403
Introduction 403
Snapshot—Instant Browser Previews Inside Expression Web 3
404
Snapshot Functionality
405
Using SuperPreview for Cross-Browser Testing
407
Contents
xi
From the Library of Lee Bogdanoff
ptg
The Tools of SuperPreview 409
The Preview Panel(s)
413
The DOM Tree View
414
Identify, Diagnose, and Solve Cross-Browser Issues with SuperPreview
415
Troubleshooting and Fixing the Sidebar in Internet Explorer 7
418
Solve IE6 Problems by Telling Visitors to Upgrade Their Browsers
419
HOUR 24:
Publishing Your Website 427
Introduction 427
A Word on Domains and Web Hosting
428
The All-Important Domain Name

428
Six Different Publishing Options
429
File Transfer Protocol (FTP)
431
Secure Shell File Transfer Protocol (SFTP/SSH)
432
File Transfer Protocol over Secure Sockets Layer (FTPS/SSL)
433
FrontPage Server Extensions
433
Web Distributed Authoring and Versioning (WebDAV)
435
File System
435
Example: Publishing Content Using SFTP
436
Advanced Publishing Settings
438
Optimizing HTML
438
The Publishing Tab
441
BONUS HOUR 25:
Beyond the Basics, Part 2: Building a Site with ASP.NET 445
Introduction 445
Getting a Jump Start by Using a Starter Kit
446
The ASP.NET Master Page
448

The Master Page in Code View
450
ASP.NET Content Pages
453
Content Pages in Code View
453
Getting Data from External Sources
455
Personalizing and Styling an ASP.NET Site
459
xii
Sams Teach Yourself Microsoft Expression Web 3 in 24 Hours
From the Library of Lee Bogdanoff
ptg
APPENDIX A: Building Layers-Based Menus 465
Introduction 465
The Layers-Based Menu
465
Creating the Main Menu
465
Create a Submenu
466
Adding and Managing Several Drop-Down Menus
471
Basing Drop-Down Menus on Layers and Behaviors Is a
Double-Edged Sword
473
Index 475
Contents
xiii

From the Library of Lee Bogdanoff
ptg
This page intentionally left blank
From the Library of Lee Bogdanoff
ptg
About the Author
Morten Rand-Hendriksen is the owner and creative director of Pink & Yellow Media, a
boutique-style design company providing digital media consulting and creations for indi-
viduals, businesses, and broadcast television. He was awarded the Microsoft MVP (Most
Valuable Professional) Award for his work with Microsoft Expression in 2008.
In addition to Microsoft Expression Web, Morten is considered an expert on the integration
and use of the publishing platform WordPress in conjunction with the application, and he
has published numerous articles and videos and done public speaking engagements on the
topic.
Sams Teach Yourself Microsoft Expression Web 3 in 24 Hours is his second published book (the
first one being Sams Teach Yourself Microsoft Expression Web 2 in 24 Hours). He is a regular
contributor to the official Microsoft Expression newsletter and has also been published in
international design magazines. You can find more tutorials, articles, and other design-
related musings on his blog at and follow his rants on
Twitter under the name @mor10 and you might run into him in different forums and news-
groups throughout the Web, usually using the same handle.
If you have any questions relating to the book, you can contact Morten by writing to
or through the website dedicated to this book found at
.
From the Library of Lee Bogdanoff
ptg
Dedication
I dedicate this book to Angela, my love,
without whom none of this would be possible.
Acknowledgments

Nearly one year ago I sat in this same couch writing the acknowledgments for the first ver-
sion of this book, Sams Teach Yourself Microsoft Expression Web 2 in 24 Hours. At the time it
felt like I was at the end of some bizarre roller-coaster ride and that after the book was
bound and printed everything would go back to normal. That, it turned out, was a big bowl
of ignorance with a generous helping of naiveté on my part: Just a few days after the book
hit stores, I started getting emails from readers asking questions, providing feedback, and
providing suggestions for future projects. I guess I shouldn’t have been surprised—after all,
I did provide my email address both on the book website and several places in the book
itself—but it didn’t really connect with me until then that when you publish a book, people
will not only buy it but also actually read it and want to tell you what they thought. And it
is that feedback I have found to be the most rewarding of the entire process: When I was
asked to write the original book, I said I wanted to write something that would help demys-
tify web design and make it available to everyone. And based on the feedback I’ve gotten, I
must have hit the mark dead on.
It may come as a surprise—at least it did to me—but revising and updating a book for the
release of new software is almost as much work as writing one from scratch. And as with
the writing of the original book, there is an entire cast of characters that have worked
behind the scenes to make this book happen. First and foremost is my acquisitions editor,
Loretta Yates, who put her unwavering trust and support behind this project and has
walked with me every step of the way. Without Loretta you would not be holding this book
in your hands, and for that I am eternally grateful.
From the Library of Lee Bogdanoff
ptg
Apart from making the book up-to-date with the new and exciting third version of
Expression Web, one of the main items I wanted to check off on the revision list was to get
rid of some of the errors in the first book. And for that, the comments, questions, and sug-
gestions from my readers have been invaluable. In particular I would like to thank Ray
Pennoyer and Salvador Torres, who both provided extensive (as in several pages!) feedback
and suggestions that have been of great help in shaping this revision.
Another important update in this book is the new and much better looking example pro-

ject, designed by my loving partner in crime Angela Chih. Demanding only hugs and kisses
in return, she produced a great looking site I hope many of my readers will find useful and
maybe even use for their own site. Faced with having to rewrite 24 chapters of content,
having someone else take care of the design portion was an immense load off my back.
When the first draft of the revision was complete I was lucky enough to have Anna Ullrich
from the Expression Web team and Doug Holland sign on as technical editors ensuring that
everything I wrote actually made practical sense so that I wouldn’t lead you astray. On the
development and editing side, Anne Goebel, Todd Brakke, and San Dee Phillips have to be
credited for making my sometimes archaic language and run-on sentences make sense.
On the practical side, a big thanks goes out to the Expression Web development team, and
in particular to Steven Guttman and Anna Ullrich for giving me unrestricted access to and
influence on the application months before it was in its final version. It goes without saying
that without access to the prebeta and beta versions of Expression Web 3, there is no way
I could have revised my book to have it available at the time of the release of the new
software.
I’d also like to thank my friends Paul LaBerge and Qixing Zheng from Microsoft Canada
not only for their continuing support and assistance but also for nominating me to receive
the Microsoft Most Valuable Professional Award for my work with Expression Web.
Receiving the award was an honor, and I can only hope I am living up to it.
There are countless others involved in both the pre- and post-publishing process I have not
mentioned, and they should all be gravely offended for not being named by name. Without
their contributions, this book would never have made the journey from my mind to the
hands of the readers, and they should be acknowledged for their invaluable work.
Acknowledgments
xvii
From the Library of Lee Bogdanoff
ptg
We Want to Hear from You!
As the reader of this book, you are our most important critic and commentator. We value
your opinion and want to know what we’re doing right, what we could do better, what

areas you’d like to see us publish in, and any other words of wisdom you’re willing to pass
our way.
You can email or write me directly to let me know what you did or didn’t like about this
book—as well as what we can do to make our books stronger.
Please note that I cannot help you with technical problems related to the topic of this book,
and that due to the high volume of mail I receive, I might not be able to reply to every
message.
When you write, please be sure to include this book’s title and author as well as your name
and phone or email address. I will carefully review your comments and share them with the
author and editors who worked on the book.
E-mail:
Mail: Greg Wiegand
Associate Publisher
Sams Publishing
800 East 96th Street
Indianapolis, IN 46240 USA
Reader Services
Visit our website and register this book at www.informit.com/title/9780672330643 for conve-
nient access to any updates, downloads, or errata that might be available for this book.
From the Library of Lee Bogdanoff
ptg
About This Book
1
Introduction
About This Book
Because you have opened this book and started reading the introduction, I am
assuming that you are interested in learning how to create websites using Microsoft’s
new and exciting web development application, Expression Web 3. If so, I congratu-
late you: By choosing this application as your platform, you are already well on your
way to creating functional and well-designed sites based on web standards. In other

words, unlike me, you are putting the proverbial horse before the cart and starting at
the beginning rather than learning things the hard way.
Expression Web 3 is the third version of a web design and development platform that
sees Microsoft take a whole new approach to the concept of web standards. The
application you work with throughout this book produces standards-based websites
right out of the box without requiring any tweaking or custom coding. In fact, using
Expression Web 3, you can create advanced standards-based websites with lots of
fancy interactive features without ever writing a line of code. And with that, the
threshold for learning, understanding, and creating websites that look and behave
the same across all browsers and platforms is lowered to a level anyone can manage.
This book is actually a revision of my first book, Sams Teach Yourself Microsoft
Expression Web 2 in 24 Hours. Well, actually “revision” might be an understatement:
In many cases, this book is a complete rewrite of the first book. That means even if
you’ve read the first one, there are a lot of things you can learn from this one. Since
the publication of the first book nearly a year ago, I have received a lot of feedback
from readers, and I’ve taken all of it into account. As a result I created an entirely
new and much better example project that you can take and use for your own web-
site when you are done. I’ve also included new and improved tutorials, tricks and tips
to make you a better and more effective designer, and an entirely new chapter focus-
ing on the new SuperPreview application included with Expression Web 3 teaching
you how to properly test, diagnose, and fix problems you encounter when testing
your websites across multiple different browsers and platforms.
When I started writing this book, I spent a lot of time thinking about you, the reader;
more specifically how to ensure that after reading this book, you would walk away
with not only an understanding of the application but also how to use it to get from
an idea to a finalized product. The result of my ponderings was a website called
From the Library of Lee Bogdanoff
ptg
2
Introduction

MyKipple.com that showcases many of the basic and more advanced functions
available in Expression Web 3. By following the tutorials in this book, you build the
MyKipple.com website from scratch and, in the process, learn how all the different
elements come together and how to get the most out of the application. When you
finish the last hour and the site is complete, you will have both the tools and know-
how to build your own websites using Hypertext Markup Language (HTML), Cascad-
ing Style Sheets (CSS), and the many other functions that Expression Web 3 offers.
You will also have a basic understanding of how the application deals with more
advanced coding languages such as PHP, and you’ll learn how to publish a simple
Silverlight application.
Accompanying this book is a small website that contains information about the
book itself along with the lesson files for each hour and in time a wiki or a forum for
you to get further information and showcase your work. The website is located at
.
Who Is This Book For?
Opening this book you are probably wondering “Is this the right book for me?” So I
guess I should tell you who this book was written for. The answer, though it might
sound silly, is that I wrote this book for myself—or rather myself 15 years ago.
When I started building websites in the 1990s, I really had no clue what I was doing
other than a vision of what I wanted to create. And when I looked around for help in
the form of books or tutorials, I couldn’t find anything that spoke to me. What was
available was either too technical or too superficial. No matter where I looked, I
could find only basic algorithms on how to perform simple tasks, never detailed
explanations of how to get from point A to point B. As a result, I ended up teaching
myself how to do things. Needless to say, I learned the true meaning of the term
“taking the long way around.”
So, when I signed up to write this book, I had one main goal in mind: to write the
book I was looking for and really needed when I started out—a book that took me all
the way from a basic sketch on a napkin to a fully working website and taught me
how to use the application at the same time.

As a result, this book is written with the novice designer in mind. No, let me rephrase
that: As a result, this book is written in a way that I think a novice designer can
understand and learn from. I make this distinction because even if you are a sea-
soned designer or developer, I am certain you can find lots of useful information
inside these covers.
From the Library of Lee Bogdanoff
ptg
Who Is This Book For?
3
Being introduced to Expression Web has had an enormous impact on my business
because it reduced what used to take hours or days to only minutes. In particular I
am talking about the application’s excellent CSS features: More than just a design
and development application, Expression Web 3 is a tool that helps you learn,
understand, dissect, and modify style sheets with unprecedented speed and accuracy.
Getting a firm grasp on these tools and understanding how to use them in real-world
scenarios can almost certainly make your work with CSS more efficient and produc-
tive, regardless of whether this is the first time you’ve encountered the term style
sheets or you are a seasoned professional with years of experience.
So, without further ado, I wish you a pleasant journey and hope you come out on the
other side with the skills, understanding, and confidence to take on the wild and
exciting world of web design.
Lykke til!
Morten Rand-Hendriksen, June 2009
From the Library of Lee Bogdanoff
ptg
This page intentionally left blank
From the Library of Lee Bogdanoff
ptg
Introducing Expression Web 3
5

HOUR 1
Get to Know Microsoft
Expression Web 3
What You’ll Learn in This Hour:
.
What Expression Web 3 is and what you can use it for
.
How to navigate and customize the workspace layout
.
How to open and close toolbars and panels
.
How to reset the workspace to the default settings
Opening this book, you probably want to jump right in and start creating websites.
But before you start it’s a good idea to take the time to familiarize yourself with the
program. Whether you are a first-time user or a seasoned web designer, Expression
Web 3 has something new to offer. And because you’ll be spending a lot of time with
the program, learning it before you start working on projects can save you both time
and frustration. If you are too impatient, you can always jump ahead to Hour 3, “A
Website Is Really Just Text: Build One in 5 Minutes,” and come back here later. But as
my father always told me, “If you want to bottle an elephant, you better read the
manual first.” Getting to know your tools before using them makes your life easier in
the long run.
Introducing Expression Web 3
Expression Web 3 is a complete web publishing suite bundled into one program. It’s
an HTML editor, a WYSIWYG editor, an authoring tool, a code debugger, a Cascad-
ing Style Sheets (CSS) generator, and a file management tool all wrapped up in one
convenient package—a one-stop shop for putting content on the Web. Whether you
From the Library of Lee Bogdanoff
ptg
6

HOUR 1: Get to Know Microsoft Expression Web 3
By the
Way
By the
Way
are a designer with no previous code experience, a developer with no previous design
experience, or somewhere between the two, Expression Web 3 can help you work
faster and more effectively.
WYSIWYG: What You See Is What You Get. An acronym used for visual web-editing
applications in which the user can view and edit the page as it appears in a
browser rather than simply viewing and editing code.
As you will see when working with web design, this name is a bit misleading: The
fact that a web page looks a certain way in a WYSIWYG editor doesn’t necessarily
mean it will look the same when viewed through an actual web browser. There are
also different kinds of content that cannot be displayed in WYSIWYG editors such
as Silverlight applications and dynamic web content. You will be introduced to
these components and learn how to deal with this problem later in the book. In
spite of this, the WYSIWYG editor is a powerful tool that gives you a fairly accu-
rate picture of what your design will look like on the Web.
Expression Web 3 is a new link in a long chain of web-authoring tools. What makes it
unique is that it gives the user the ability to create 100% standards-based sites even
without knowing what the term standards based means. Expression Web 3 is in many
ways a shortcut that opens the world of standards-based code, previously accessible to
only the web developer elite, to anyone using it. And because creating standards-based
sites is (or should be) the ultimate goal of any web designer, Expression Web 3 gives
you a huge advantage. Of course that doesn’t mean your sites will be perfect, but you
will spend far less time picking at finicky code and solving browser incompatibilities.
With Expression Web 3 you can create new pages and sites from scratch or from tem-
plates; view, edit, and alter existing pages and sites; and build new server-based
applications with ASP.NET (Active Server Pages .NET) and PHP (PHP: Hypertext Pre-

processor; its name is recursive). In short, Expression Web 3 is a complete package for
creating and publishing websites whether on a local computer, a network, or the Web.
The terms standards based and web standards refer to the formal standards and
technical specifications set out by the World Wide Web Consortium (W3C) to
describe how the World Wide Web works. If you follow these standards, your web
page should look the same in all web browsers. (I emphasize should because not
all web browsers follow these standards.) By creating standards-based websites,
you avoid many of the problems associated with browser incompatibilities and
build clean and functional websites accessible to people with disabilities and any-
one on slower connections or older computers. The terms refer to a website’s
coding, not what it looks like. So, don’t worry: A standards-based website does
not have to be boring or ordinary, just built properly. If you want more information
on web standards, a good place to start is the W3C website: www.w3.org.
From the Library of Lee Bogdanoff

×