Transcript Document

Microsoft Expression Web is usually obtained as a
program within Microsoft Expression Studio.
 This tutorial deals specifically with Versions 3
and 4, which are very similar in most respects
and the important differences are dealt with
within the tutorial.
 Previous versions of Expression Web are very
similar to FrontPage 2003 so please use our
instructions for FrontPage if you have an earlier
version.
 The next page of this tutorial starts from the
assumption that you have obtained and
successfully installed Microsoft Expression Studio
3 or 4 on your computer.
 The tutorial is based on a computer running
Windows 7, but could easily apply to any
computer running Windows XP or later versions
of Windows.




When you first open Expression Web it creates a folder
named My Web Sites in the Documents folder on your
computer. This folder can be used for creating a website
from scratch or for experimenting with but most of our
clients will already have a website set up on our server and
should NOT use this folder for their website.
To avoid confusion we suggest that you delete the My Web
Sites folder and create a new folder in the same location
named My Webs and then within the newly created My
Webs folder create a folder named the same as your
domain name (without the www). Under NO circumstances
should you create this folder within the My Web Sites
folder, which contains hidden files.
On the next few slides I will deal in detail with the above.

First open your documents folder by either clicking on
documents on the start menu or clicking on the Windows
Explorer icon at the bottom of your monitor.
If you start from the start
menu click on Documents,
near the top of the right hand
side of the start menu.
If you start from Windows
Explorer click on Libraries
then Documents

You should now be seeing a window something like this:
Select and delete the
“My Web Sites” folder.
Now click on “New
Folder” – on the pale
blue band at the top
of the window.
Rename “New folder”
as “My Webs”
Press return or Enter
on your keyboard
twice.

Your window should now look something like this, but without
the “New folder”:
Click on “New
folder” on the
pale blue band.
It should now
look exactly like
the image.
Now rename the
New folder the
same as your
domain name
(without the
www)

The window should now look like this except that
sitename.co.uk should be your domain name.

If it looks
correct you can
now close the
documents
library window,
by clicking on
the “X” at the
top right of the
window.
The next few pages deal with customising the layout
of Expression Web. You do not need to do this but I
personally think it simplifies the number of
unnecessary options available to a new user and to
some extent makes it more familiar to someone who
has previously used FrontPage.

When you open Expression Web after installation it looks
something like this:



First we will change the single line of toolbar icons to a double line.
Click on the “View” menu then on toolbars and un-tick Common
Return to the toolbars twice more to tick Standard and then
Formatting
Start like this
and end like this


You can now close most or all of the panels on the left and right of
the main screen by clicking on the X at the top right of each panel.
In the screenshot below I have left open the folders panel at the left
of the screen, but you can close this if you wish.
The screenshot shows
Expression Web 4
The top row of icons
will be slightly
different in version 3
 First

create a connection to your website folder.
Click on the “Site” menu then on “Manage Sites List…”
The Managed Sites List shows the
Default Site set-up by Expression Web.
Click on “Remove” to remove the
Default Site and then on “Add” to add
your Site.

Browse to the folder you created earlier and when selected click on
“Add”. Please note: sitename.co.uk should actually be your own domain name.
After you click on
Add you will return
to the manage sites
list and your website
folder will be listed.
Now click on “Done”









Click on the site menu again and then on open site.
In the Open Site window click on your website in the
Managed Sites box and then click on Open.
Your website folder is now open in Expression Web and there
will be a note in the centre of the white screen stating
“There are no files in this folder”
Click on the site menu again and then again on “Site
Settings…”
On the General tab of the site settings window tick the box
to “Maintain the site using metadata files” then click on OK.
An “Add Expression Web Information to the folder” window
will pop – Click on “Yes”.
Click on the site menu again and then again on “Site
Settings…”
Click on the Publishing tab and then click on “Add”.
The connection settings window will now open.



Fill in the site settings
window as shown but with
the details supplied to you
by Eqwebs Ltd. The
directory box should contain
../../../web
Click on “Add” and you will
return to the “Site Settings”
window with your website
listed in the “Publishing
Destinations” box.
Click on “OK”

Now click on “Publishing” at the bottom left of the window.

In the centre of the new window click on “Connect to the
current publishing destination”


You may get a warning message about allowing Expression Web
through your firewall. You must allow this access (as a
permanent rule).
If every thing is correct so far you should now see something
like this:
The right hand white
window shows all of
the files in your
website on the webserver.
The left hand white
window shows the
empty folder on your
computer.
We now need to
copy the files from
the right to the left



If you are using Expression Web 4 please move on to the next screen
If you are using Expression Web 3 you should first left click somewhere
in the right white window then on your keyboard hold down the Ctrl
key whilst you click on the A key. This will select all the files in the
right window. Some of the arrows between the two white windows
will now turn blue.
Click on the single
blue arrow pointing
from right to left.
All the selected files
and folders in the
right window will
now be copied to
the left window
(the folder on your
computer)
See next screen for this
step in Version 4

In Expression Web 4 the actual copying is
much simpler than version 3. Just click on the
“Get all files in your site” icon near the top of
the screen
* In both versions 3 and 4,
*
*
*
immediately after you have downloaded the
files you will need to exclude various files
from publishing.
First click on “Folders” at the bottom left of the screen to close
the right hand window.
The files that must be excluded from publishing are counter.cgi,
counter.txt and oldindex.html in the main folder and then all the
files inside the “error” folder.
Files are excluded by right clicking on the file name and then left
clicking on “Exclude from Publishing”.
 Your
Expression Web should now look like this:




Preparing and saving your image files in the
images directory of your website.
THIS IS VERY IMPORTANT FOR THE CORRECT FUNCTIONING
OF YOUR WEBSITE - UNLESS YOU HAVE A BETTER METHOD
OF PRODUCING SMALL FILE SIZES FOR YOUR IMAGES
PLEASE FOLLOW THE INSTRUCTIONS ON THE NEXT PAGE
EXACTLY - DO NOT USE IMAGES DIRECTLY FROM YOUR
CAMERA OR SCANNER.
Images used on a website are usually .gif or .jpg format. Gif
images are used for man made images, such as logos etc,
where there is a limited number of colours present. Amongst
other features, .gif images can have an irregular shaped
mask and can be moving images. Jpegs (.jpg) are generally
used for photographs as they have a much wider colour
range.
Photographs are usually scanned or downloaded (from a
digital camera) and always require preparation for use on a
website. This preparation must be done in a photo editing
program and not in Expression Web.


The formula I use for photographic image preparation is as
follows:1. ensure the photo is cropped to what you want to show.
2. resample the image to the size you require - I generally
use a maximum of 380 pixels in any direction (horizontally
or vertically)- the DPI doesn't really matter but for uniformity
I always set it to 100dpi.
3. carry out any adjustment to tone / colour etc as necessary.
4. save the image as a .jpg in the images directory of your
website - I generally use a compression of 50 and if
smoothing is available to you I would suggest you set this to
10. Using these settings you should be able to achieve a file
size of less than 20kb. Please do NOT use uppercase letters
or spaces in the file name.
5. when putting the image in your page do NOT adjust the
size as this will produce a poor image, adjustment for size
should be carried out as above.
IF YOU DO NOT UNDERSTAND ANY OF THE ABOVE PLEASE
CONTACT OUR HELPDESK

At this time I suggest you take time out to learn more about
Expression Web and a good place to start would be the Microsoft
website
http://expression.microsoft.com/en-us/cc197140





Once you have familiarised yourself with Expression Web by using the
tutorials you should be ready to edit your website. Please look at how
things are already done and laid out to give you guidelines to how you
should proceed.
Some general tips are:
Always use tables to put text in columns or alongside images.
Do NOT use multiple spaces to format text - there are other formatting
tools available.
Always remember that other people are likely to be viewing your website
on a screen that is set differently to yours (larger or smaller).
Please do not edit or delete the file oldindex.html - this is your instructions
and link to the control panel of your virtual server.
With our older frames websites, if you have a file named indexm.htm in
your website, unless you are sure you know what you are doing, do not edit
the file index.htm (or index.html) in the root directory of your website. The
homepage of older websites is indexm.htm, the other pages should have
self explanatory names.
Websites produced since late 2007 use templates rather than frames and do
not have the file indexm.htm. In these cases index.html (or index.htm) is
the homepage. You would need to use FrontPage 2003 or later (including
Expression Web) to have the full features of editing a template website.
With a template website the top and bottom of each page must be edited in
templates/basic.dwt - changes here change every page.



When you have finished editing your
website it is a good idea to preview your
website in the browser before you publish
as you can pick up most errors this way
before someone else sees them.
In Expression Web, with your index.html
file open, click on the “F12" key at the
top of your keyboard. This will open the
website on your computer in your default
browser and it will look almost exactly
like it will when published. There are
more browser options available on the
“File” menu. Some things, such as the hit
counter and the guestbook script will not
work (they only work on the server).
Fully check out your website before you publish your website. If
you find errors, correct them in Expression Web and keep checking
your website until you are sure it is error free

There are differences in the way you publish your website
dependant upon the version of Expression Web you are using.

In version 3 click on “Publishing” at the
bottom left of the screen. Then at the top
left of the left window open the “View”
dropdown box and select “Changed Files”.
Click on the single blue arrow pointing from
left to right on the panel between
the left and right white windows.
All changed files are now being published to
your website.
You can use the same procedure for version 4,
but in version 4 there is a “Publish all
changed files” icon at the top of the screen –
just click it to publish.



It is always a good idea to view your website immediately
after publishing as a final check that all is as you
intended. You sometimes have to click on refresh
(sometimes repeatedly) in your browser to view the
updated pages.
 If you are still seeing the old pages please see our page
about ISP caching - http://www.eqwebs.com/cache.htm
 If you have problems publishing it is usually a slow or bad
connection to the Internet issue. In this circumstance it is
quite a good idea to close down Expression Web
completely, wait a minute or two, maybe re-connect to
the Internet, re-open your web in Expression Web and republish.

Hopefully by the time you have got to
this stage your website has been
successfully published exactly as
you wanted.
 Well done! Congratulate yourself!
 If this is not the case please go
back and review this procedure.
If this does not help then please
ask us for help by raising a
Support Ticket at
http://www.eqwebs.com/helpdesk/

You have just viewed an
Eqwebs Tutorial prepared
by Brian Dowding. If you
have any comments or
suggestions please email
them to
[email protected]
This whole document is © Copyright
by Eqwebs Limited and Brian Dowding