How do I put things on this page?
Just start typing. Everything in Expression Web works pretty much like it does in Word. You can type
whatever you want on the page. A good idea on your default page is to start with your contact
information (name, office number, phone #, e‐mail address).
Note: When you hit ENTER in Expression Web you’ll get a double‐space. If you want single‐spaced
lines, hold down the SHIFT key when you hit ENTER.
Hit Save. Get in the habit of doing this often; it prevents disasters. I try to save about every five
minutes when I’m working in Expression Web. If you see an asterisk on the page name’s tab, it
hasn’t been saved yet! Once you save the changes, the asterisk will go away.
I already have things typed in a Word file. Can I put them on a web page?
Yes, and there are three ways to do this. First, let’s make a place to put the file. Click on “new” and
create a new page in Expression Web. Name it crtw201 (or whatever your course is called) and save
the page. You’ll be putting your material on this page, not on your default page. Today in class we’ll
call this page Lucy.
Now, to transfer materials from Word/PDFs.
You can open the file in Word, highlight the material you want to copy, hit CONTROL + C,
and then put your cursor in your Expression Web file and hit CONTROL + V. This should copy
and paste your material into the web page. Note: This is useful when you’re combining
several files to make one web page. Advantage: it’s quick and easy. Disadvantage:
sometimes the formatting gets messed up.
You can go into the file in Expression Web, choose Insert File, and use the Select File box to
find the file in My Documents (you may have to change the “Files of Type” to “All Files (*.*)”
to find your file). Highlight the file you want, click “Open,” and it should appear in
Expression Web. Note: You need to start and name a new page in Expression Web for
every file you transfer! (e.g. crtwsyllabus, crtwcalendar, etc.) Advantage: You copy a
complete file quickly. Disadvantages: sometimes the formatting gets messed up and
Expression Web may keep asking for your username/password to open Word.
If you have a number of Word files to upload, it may be easier to drag and drop them. First,
save the Word files to your Desktop (using Save As). Then re‐open Expression Web, open
your page, and choose View ‐> Folders. Shrink this view to 2/3 screen by clicking the little
box in the right‐hand upper corner (next to the red x closing box). Then drag and drop the
Word files from your desktop into your web page folder. When you’re through, switch
Expression Web back to full size and click View ‐> Page to go back to the normal Expression
Web look. Advantage: lets you move a number of files quickly. Disadvantages: files are
copied in their original format, not as web pages, and Expression Web will probably keep
asking for your username/password to open Word. Dragging and dropping is the best way
to upload PDF files to Expression Web.
When you’re done inserting, save the page into the website. Don’t forget! Hit F12 to preview what
your page will look like in a browser.
Now how do I link these files to my default page?
Go back to your default page. Type in some text that will identify what you’re linking—for instance
Click here for a link to Fred Mertz’s page.
Highlight that text. Now click on the hyperlink icon
on the grey bar at the top of the page. This
will bring up a grey dialogue box. You can type the address (URL) of the page you want in the white
box at the bottom, or you can click the box for “existing file or web page” and scroll down to find the
page you have already created (fred) and select it, then click “OK.” When the box closes, you should
see the default page with the text you just hyperlinked underlined in blue
What if I want to establish a link to some other page on the web?
You’ll use the same process, but you can cheat a little bit. Try this: on your default page, type Click
here to read “The Correct Use of Borrowed Information Handout.” Then highlight it and click the
hyperlink icon. Now choose the little “Browse the Web” icon.
This should open up Internet
Explorer for you. Enter http://www.winthrop.edu/english/plagiarism.htm and hit enter; the
“Correct Use” page should open up. Highlight the URL at the top of the page by left‐clicking on it
once; then choose Edit – Copy. Click back on Expression Web, put your cursor in the white address
box, and hit Control + V. The URL should appear. Hit “OK” and the link will be established.
Hint: Control + V is particularly helpful if you have a long URL, such as an JSTOR reference; it saves
mistakes when you type out the full URL in the address box.
Hint 2: If you know you are going to be establishing a lot of links, first find the pages and save
them in your “Favorites” file in Internet Explorer. Then when you use the little Browse icon to
open Internet Explorer, you can just click on your favorites list and find the page quickly instead of
searching for it again. You have to do this in Explorer—Microsoft and Firefox don’t play well
Hint 3: If you are copying in a very long URL (e.g. the URL to an article in JSTOR), you can highlight
the URL and click ALT + TAB very quickly. This in theory should throw you back into the Expression
Web screen with the URL already posted in the Make a Hyperlink box. It works about 90% of the
Hint 4: If you want the text of the URL to appear on the page and it’s a long URL, use www.bit.ly
get a short form of the URL first. It makes page navigation a lot easier.
OK, I want to get fancy. How do I put a picture on my page?
On the top grey menu bar, click Insert and then Picture. Single‐click on From File. This will bring up
My Pictures. If your picture is saved in that file, just highlight it and click Insert. Since some readers
need to use assistive technologies to read text on the web, Expression Web will default to a
reminder to put an ALT tag on any images you use. This will create those little words you see in the
pop‐up box when you run your mouse over a picture on the web, and it’s easy to do. The reminder
box looks like this:
In the Alternate text box, type in a few words describing your picture. Click OK and the image is
tagged for assisted reading. (Choose simple words, a short description, and few abbreviations.) The
picture will appear: Voilà.
Or if you need to find the picture on the web—for instance in Facebook or Flickr, click on the Search
the Web icon
and search for the picture you want (MSN Images or Google Images are fast
ways to find pictures). Right‐click on the picture you want, left‐click on Copy, move your cursor to
where you want the picture in Expression Web and hit Control + V. Voílà encore! (You will need to
right‐click on Picture Properties and choose the General tab to add the accessibility tags if you do it
You can also right‐click and use Save Picture As to save it to “My Pictures” as a .jpg or .gif file.
(Fewer browsers recognize .gifs any more; .jpg is probably the safest choice.)
Remember that pictures on the web may be subject to copyright. Be careful what you borrow. See
if you have questions about legalities.
If you’re importing photographs, it’s pretty usual to have them be way too big for the page. You
adjust this on the Picture Properties screen as well. This time, right‐click on the picture and choose
Picture Properties. Choose the Appearance Tab. The screen you see will look like this:
If you make the photo width 600 pixels, the height will automatically reset to 450 pixels (or
thereabouts), and then you can drag the corner of the picture to size it more effectively. The
wrapping style buttons at the top of this menu are used to allow you to put text next to the picture;
wrapping left puts the picture on the left margin, while wrapping right puts the picture on the right
margin. The alignment button allows you to control where the picture appears on the page,
regardless of text.
How do I make the background of my page a pretty color?
Right‐click on the page and choose Page Properties. From the 'Page Properties' menu, navigate to
the Formatting tab and click on the pulldown menu on Background and then click on a color you
want for the background. Then click on OK. You can also check the Background Picture box and pick
an image to use for your background, but remember that a busy background makes it hard to read
What about copying a background from another page?
Expression Web makes this easy. Supposing you want to copy the nice Victorian paper on Evelyne
Weeks’s page. In Internet Explorer, go to http://faculty.winthrop.edu/weekse
. Put your cursor on
the background you want to copy. Right click the mouse. Choose Save background As. Your My
pictures folder should open. Give the background a filename like evelynegreen and click the Save
button. Now return to Expression Web. Go to the page where you want to use Evelyne’s
background (e.g. fred). Right‐click on the page and choose Page Properties. From the 'Page
Properties' menu, navigate to the Formatting tab and click on the pulldown menu on Background
and then click Background picture. Click on Browse and choose My Documents. Find the My
Pictures folder, click on evelynegreen, and click Open, then click the Okay button on the bottom
right. The background should appear on your page. (If you do this a lot, you may want to make a
folder for backgrounds in the My Pictures folder and keep them all together—it saves time.)
(Evelyne’s background comes from Travis Beckham’s great website,
; if you want great patterns to use, try his selections!
When you go to save a page that has an image on it, you’ll get a box that asks you where to save
your images. If the folder name is not images, click on the Change Folder box and choose the
images folder and click okay and then okay again. This puts your images in a special folder on your
web page that will help them load faster. (There’s a geek‐speak explanation for this but I’ll spare
you.) It also helps you keep your images organized—you can have one folder for family images,
another folder for department images, etc. It’s a little trick, but it will make your web page behave
better and load more quickly.
Make sure you save the image to your files. If you simply link to a picture on someone else’s page, it
may disappear if the page owner removes it.
Placing a PowerPoint presentation on your web page
This isn’t hard to do but all the new browsers out there have made this complicated. For best
results, I recommend saving the PowerPoint to your desktop in a short‐form name with no spaces,
and saving it as PowerPoint 97‐2003 format (suffix *.ppt). Don’t save it in .pptx format! Then you
can drag it into your folder list in Expression Web and make a link to it on your default page or your
fred page, just as you would to any other site. PowerPoint has several embedded formats, such as
.mht, which are supposed to show up in any browser, but there are a lot of compatibility problems
cropping up with Firefox and Chrome, so go for the simplest solution to be sure this will work.
Keeping a Tidy Web Page
One of the biggest challenges in managing a web page is remembering where you put something.
That’s why it helps to make subfolders for each category of information you put on your page. When
you go to save a web page, one of the options you have at the top of the page is a “create new
folder” icon. You can use this to create tidy subfolders into which you can save your pages. As you’ll
see from the illustration of the architecture of the English Department web page below,
we have divided the department page up into various subfolders so that we can keep like items (for
instance course descriptions, syllabi, information on the writing program, etc.) together. Get in the
habit of creating folders now and storing relevant material in them. It will really simplify the job of
keeping track of “where something went” as your website evolves. Hint: Just like filenames, try not
to leave spaces in a folder name: thus, researchpaper instead of research paper. It makes the URL
tidier and less likely to cause trouble.
By far the biggest problem in bringing in files from Word is that Expression Web frequently
misinterprets the formatting, especially when that formatting is in TABs. Expression Web reads
tables differently (as percents of the whole page width) and it makes them easier to load. If you
import text from Word and the formatting goes kerblooey, try backspacing to take out those
phantom TABs. You may also have to use the decrease indent key
to get the text to look right.
If you want your page in Expression Web to look nice and balanced no matter whose screen it
appears on, use a table (see Kelly Richardson’s default page as an example). This will keep columns
nicely lined up no matter what size screen or what kind of browser a reader uses.
If a hyperlink doesn’t show up in blue after you import it, just put your cursor at the end of the
hyperlink and hit the space bar. This will almost always cause the hyperlink to come alive. If this
doesn’t work, just highlight the text and hyperlink it.
Students are the best resource. I’ve had very few questions in Expression Web that one of my
students couldn’t answer with a pitying “Oh, that’s easy; you just…..”
There are several good Expression Web tutorials on YouTube; just use the term expression web
tutorial in the YouTube search engine.
Most of chapter 1 of Expression Web for Dummies is online at http://bit.ly/ahqLKC
EDUC 275 has a great Expression Web cheat sheet developed by Marshall Jones and Lisa Harris that
covers all the ins and outs of making tables; they are willing to share with proper attribution.
CREATING WEB PAGES: BASIC TERMS
HTML: Hypertext Markup Language. The computer coding language used to convert words and
images into a web page. Expression Web allows you to create web pages without knowing any
HTML. If you are insatiably curious, however, you can click the Code tab at the bottom of the
Expression Web screen and see what you created looks like in code. Then click “Normal” and forget
you ever saw it.
Fine point: Web page addresses that end in .htm were created in a Windows HTML
environment; web page addresses that end in .html were created in an Apple HTML
environment. That’s the only difference.
URL: Uniform Resource Locator. The page’s call number on the World Wide Web. It can have many
combinations of letters and numbers; but the only punctuation you should use is hyphens. DO NOT
leave a space in a URL; the computer will try to fill it with code, which gives you a confusing URL. If
you MUST leave a space in a page name, you should fill it with an underscore
. It makes it much
easier for computers to deal with the page name.
Official webpages at Winthrop all begin with the extension
http://www.winthrop.edu/departmentname or a college server
Faculty webpages at Winthrop all begin with the extension
Personal and Staff webpages at Winthrop begin with the extension
BROWSER: The program that a computer uses to display web pages. The most common are Internet
Explorer (IE) and Netscape Navigator and Apple’s Safari; some people now use Linux browsers like
Firefox. AOL’s proprietary browser is the biggest pain in the butt in all of cyberspace. Remember
that there are browser wars: what displays in IE may not display in Navigator and vice versa. There is
no guarantee WHAT will display in AOL.
SERVER: The name of the computer where a web page lives. Pages at Winthrop are on servers such
as www.winthrop.edu, faculty.winthrop.edu, and www.birdnest.org. “The server is down” is the all‐
purpose excuse of the 21
century. Your web page will live on a server, not on the computer in your
office (*unless you screw up while saving it*).
ISP: Internet Service Provider. The company that runs the server and connects it to the web—usually
a phone company. Winthrop’s ISP is Comporium.
WYSIWYG (pron. “wizzy‐wig”): What you see is what you get. Expression Web is a WYSIWYG
program because it lets you see exactly how your page will appear before you load it onto a server.
You do this by clicking the “Preview” tab at the bottom of the page.
Winthrop Web Services Page: http://www.winthrop.edu/web/
Documents you may be interested
Documents you may be interested