
STEP BY STEP GUIDE TO CREATING A WEBSITE USING FRONTPAGE EXPRESS updated last feb 2000
   
  ******************************************************************************************************************************************** 
  Legal Notices Copyright  A.Duncan . Basic Web Resource Site. All rights reserved. 
  No part of this document shall be reproduced or copied unless indicated or by 
  permission from the webmaster. 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 document and its placement on the website, 
  the author and publisher assume no responsibility for errors or emissions. Neither 
  is any liability assumed for damages resulting in the use of information contained 
  herein. Although every precaution (including viral scanning) has been taken 
  in the preparation of the substance of this site and any downloads, the author 
  and publisher assume no responsibility for errors, emissions, viral infections 
  or damage as a result of downloading and the use of files. Neither is any liability 
  assumed for damages resulting in the use of information contained within downloaded 
  files. We advise the scanning of any downloaded files with a reputable virus 
  scanner and the backing up of files prior to doing so. This document does not 
  endorse any products nor is it endorsed by any companies. The use of references 
  to products, web sites or companies is personal opinion and should not be seen 
  as endorsement. Any description of products, companies or web sites are a personal 
  views and opinions Microsoftis either registered trademarks or trademarks of 
  Microsoft Corporation in the United States and/or other countries Netscape, 
  Netscape Certificater Server, Netscape FastTrack Server, Netscape Navigator, 
  Netscape ONE, SuiteSpot, and the Netscape N and Ship's Wheel logos are registered 
  trademarks of Netscape Communications Corporation in the United States and other 
  countries. Netscape composer and communicator are also trademarks of Netscape 
  Communications Corporation, which may be registered in other countries All other 
  trademarks where known are acknowledged ****************************************************************************************************************************************************************************************************************** 
   
   
  What now follows is a guide to creating a simple web page with Frontage express 
  As this page is quite long we've divided it into 5 key sections. This does not 
  detail how to use Microsoft's Personal home page wizard we've separated into 
  5 pages Getting started, saving & loading your pages & viewing them Editing 
  text and lines Images and backgrounds Creating Links Checking and uploading 
  your sites. 
   
  -------------------------------------------------------------------------- 
   
  CREATING A BASIC SITE 1 STARTING UP   
  &nbsp;  
  The first Thing to do is to create a folder to keep all the file related to 
  your site in. Do this as normal either on your Hard Drive or Floppy Disk. If 
  you don't know how simple click on the drive you want, the open any folder (my 
  documents is a good pace to start) you want to put the new folder in and then 
  right click the mouse on a blank space. Select new and then folder from the 
  sub menu. You can then type in name (make it appropriate e.g. "Joe Bloggs Web 
  Site"). Now open Frontpage express. You begin on a new simple page. Keep an 
  eye on the seconds box in the bottom right. It give you an idea how long a page 
  will take to load on a 28.8K modem REMEMBER IF YOU MAKE A MISTAKE click on edit 
  and select undo. Lets begin........ TO SAVE AND LOAD FROM DISK When you want 
  to save your file ether click the save icon or click on pointer on file and 
  select save. (1) Type in file name (e.g. my home page). This will appear on 
  the top bar of a browser. Don't press return and then (2) click as file. Use 
  the browse option to find the folder you created earlier and click on it to 
  open it, then press save. For the first page on any website use the name index 
  To load a page if it has been opened recently you may see it and select it from 
  the menu if you click on file otherwise, select file then open. Click browse 
  and find it. You can save a file to another place or name (useful for backups) 
  by selecting save as. If you have multiple pages on screen save all does what 
  it says! Its now a good time to view your page.....  
   
  --------------------------------------------------------------------- 
   
  VIEWING PAGES ON INTERNET EXPLORER 
   
  Useful to check your site. Either click on your file in its folder or open Internet 
  explorer but select to work off-line. Click file and select open. Browse to 
  find your file.  
   
  ---------------------------------------------------------------------- 
   
  CREATING BASIC SITE 2 TEXT 
   
   
  Text will form the basis for most documents. You can use Frontpage express much 
  like a word processor. If you are happy already with doing that skip the next 
  bit.

  The cursor should be flashing on the page so you can start typing straight 
  away. To edit text you have typed is easy. To make simple corrections such as 
  spelling move the pointer to the site and left click. Delete or insert as required. 

  To alter or copy a large area of text simple move pointer to one end hold left 
  mouse button down and move so the target area is highlighted. Once happy release 
  (take care not to re-click) and the area should remain highlighted. 

  If you want  to move the text to elsewhere in the area you have already typed left click 
  on the high lighted area but hold down until you have reached the target area. 
  To cut text out move the cursor to the highlighted area rightclick and hold 
  down to select cut. To copy then paste the text elsewhere move the cursor to 
  the highlighted area rightclick and hold down to select copy. Quickly left click 
  to unhighlight and then move cursor to target position. Left click so type cursor 
  appears then hold down rightclick and select copy the release The cut, copy 
  and paste functions can also be achieved by either selecting the edit menu or 
  the relevant icons on the standard tool bar.

  There are 2 ways to change text about

(1) Changing Font, Text size & Colour individually

The first method allows you to change text font, colour or size or to underline,
bold or italic is similar. 

Highlight then select the appropriate icon from the standard tool bar


Alternatively select Format ->Font on the menu. If you click on area but don't highlight
when you type on from where you have changed you continue to type in the new style. 

(WARNING underline text can confuse the viewer into thinking its a link.)

 

(2) Using Headings etc.

The Second way is to use the change style box (lies to the left of the font type box 
(1) described above). HTML allows you to use a set of predetermined text styles the 
most common are the headers (e.g. <h1> in tags). 
This saves the hastle of increasing and decreasing text size for effect


We describe lists and definitions later

either set this before typing or highlight text afterwards 
(can do this as well by right clicking over selected text)

 -------------------------------------------------------------------------

Changing Alignment

To align the text (either left, centre, or right) either click cursor on the line you want to 
align or highlight the area, then click the appropriate align icon 
(alternately select format -> paragraph then pull down alignment box)

If you simply type away your text will warp to fit the window. The problem with this is that if you 
adjust the window the warp alters. One solution is to use line breaks 
(hit shift + Enter at same time - a little icon should appear). 

Alternatively use return to create paragraphs with space between
(the best solution is to use tables but these are more advanced)

 Hyperlinks 
To link your text to other places 
  on your page, site or web see later By now you should have the bones of your 
  page set up.  
   
  ------------------------------------------------------------ 
   
  INSERTING LINES 
   
   
  Lines are good to break up areas on some site (like the ones used here). click 
  cursor where you want one and select insert -> horizontal line. If you highlight 
  line and rightclick you can edit its properties.  
   
  ------------------------------------------------------------------------------- 
   
  CREATING A BASIC SITE 3 IMAGES  
   Images can add colour and excitement to your web page. It is vital that any 
  image you use on a page is in the same folder before you start using them (this 
  makes it easier later on) You are best to use 2 main image types to begin with 
  (as almost all browsers can use them) .jpeg (or .jpg) -best for photos. Can 
  reproduce 24 bit files that can handle in excess of 15 million colors .gif - 
  for others as is based on 8 bit files that can handle only 256 colors . gif 
  can also be animated like this Many .gif such as buttons come with transparent 
  backgrounds (this can be set on tag in image props) but many esp. animated ones, 
  may not so leave usually a black or white background (explains why many sites 
  on the net are in these shades). You can often alter this with a graphic package. 
  Frontpage express will convert some other file formats for you such as .bmp, 
  pcx. But be wary. Getting Images Ensure or alter the image file name so it is 
  all one case e.g. mypic.jpeg not MyPic.jpeg D.I.Y. You can create your own by 
  using a scanner for photos or graphic packages. Remember to save as a .jpeg 
  or .gif if possible and also to the folder you are using. Commercial\free images 
  on CDs Several companies sell prepared images for you to use. Many computer 
  magazines cover disc have free clipart or other images. As always check copyright 
  instructions. From the web There are several sites on the net offer free .gif 
  and .jpegs others have strings attached and some will take legal action if their 
  images are used by others. Check the copyright notices before taking an image 
  off the web a list of some of these is on our link page To get image from a 
  web site using Internet explorer, right click image and select "save picture 
  as". You can rename it but remember to send it to the folder your web page is 
  on.  
   
  Inserting Images in FRONTPAGE EXPRESS 
   
  Simple. Click cursor where you want image. Either select insert image icon or 
  click insert -> image Altering Images Images can be cut, copied and pasted just 
  as text (see above) However you can also alter the shape of a picture. If you 
  click on a picture a set of 9 rectangular boxes will appear on its margins. 
  If you click and hold down on one and move it This can alter the size of the 
  object (one of corner boxes) or its shape (one of mid size boxes) Changing the 
  position of images relative to text You can alter how text appears in relation 
  to image. If you rightclick on your image and select image properties. Then 
  select appearance. In the layout box you have a list of alignment options. You 
  should try to limit yourself to top, middle, bottom, left and right (these are 
  the only one complying to the HTML v4.0 standard. The rest potentially could 
  markedly alter your site on another browser) With the first 3 (top, middle & 
  bottom) the browser simply treats an image as part of the line of text. The 
  tags control the alignment of text and image e.g. this image is set at top whereas 
  this on is at bottom however note the text doesn't wrap around these images 
  (just like text) If you want text to wrap around an object as it does here you 
  need the left and right alignments. The image on the left is set to left and 
  text wraps round on its right side (vice versa on the right)  
   
  BACKGROUND 
   
  You can set a site background with ease. Click format -> Background. You can 
  select the background colour or image on the lower right. (Remember if using 
  an image, put it in your website folder before selecting it) You can acquire 
  background images from many sites (check our links). Look for ones that are 
  specifically labeled as such as they will tile nicely together. If you select 
  watermark the image stays still as the text and images scrolls over the top. 
   
   
  ----------------------------------------------------------------------- 
   
   
  CREATING A BASIC SITE 4 LINKS


   You can make Text or image link to other place on the same page, or others 
  page on your site or to other sites on the Internet. You can also link so people 
  can send email. To make a link to somewhere else on the same page (like the 
  (bottom) which will take you to the bottom of this site) You must first create 
  an Anchor or Bookmark for the link. Highlight the first few word or the image 
  you are targeting and click edit -> bookmark. You can change the name and then 
  click OK. Now select the place you want to make the link from . Highlight it 
  and either select the hyperlink icon or click insert -> hyperlink. On the box 
  that come up select open web pages and your page should be there. Highlight 
  it and at the bookmark box click the scroll down box and move down until you 
  find your target bookmark. The link will change colour and become underlined. 
  (Ignore the warning box)  
   
  To link to other pages The process is similar. Remember if you are uploading 
  a group when preparing web pages make sure they are all in the same folder. 
  The easiest is to open the 2 web page on Frontpage express (if the target page 
  on top click the the restore or minimize icon in top left corner (there are 
  2 identical set the one above is for Frontpage express so click the set below) 
  this will allow you to access the page you are creating link from). As before 
  highlight your link and select hyperlink . On the open pages you should see 
  the 2 open pages. Select your target page and click OK (just select yes in warning 
  box that appears about not linking on the web - as long as both pages are published 
  it'll work) If you have bookmarked on the target page you can select these as 
  well.  
   
   
  To link to a specific Internet. site You first must know the address e.g. www.joeblogg.net.You 
  can note this when browsing on IE from the explorer bar. Before using a link 
  as courtesy check with the owner that its okay (usually you can find an email 
  link). Highlight your link point and select hyperlink . This time click the 
  world wide web tab. In the box marked URL type the address in and then with 
  the box above select http. Then click OK.  
   
   
  To set up a email link Highlight your link point and select hyperlink . Click 
  the world wide web tab. in The URL box type the email address e.g. joe.blogg@yourserver.net 
  In the box above pull down until mailto is selected. Click OK. There are more 
  links you can do but we'll deal with that later  
   
  ---------------------------------------------------------------------------- 
   
  CREATING A BASIC SITE 5 CHECKING YOUR PAGE 
   
   
   
  If you've followed the above then you can make a simple page. Congratulations 
  !!!!. Remember to save it to your folder Now you need to check how your page 
  looks on a browser. Go back to remind yourself how to do this with IE. It is 
  worth checking your file with several browsers such as IE and Netscape as there 
  are subtle difference with appearance. Double check your spelling and how things 
  appear. Check your links including those on the www. (If you click on them your 
  browser will try to link)  
   
  OTHER PAGES 
   
  If you want to create several web pages to upload in one go simply select file 
  and then new (or click create new normal page icon ). Remember to save your 
  page to the same folder  
   
  GETTING READY TO AND UPLOADING 
   
  Before uploading your site onto the world wide web it is important to check 
  all your web pages and associated image files are in the same folder. Remember 
  that your page must have the image files sourced from within that folder (ie 
  don't use or use then move in or out image files). If you have multiple pages 
  make sure the one you wish people to start on is called index.htm (see later). 
  Recheck your links on both your browsers and Frontpage express. In Frontpage 
  express the link target appears in the bottom left of screen if you move the 
  pointer over. If you are linking to other pages within the website you are preparing 
  make sure that it reads just the file name e.g. nextpage.htm not a string C:/yourfolder/nextpage.htm 
  otherwise it won't work on the net (reopen the target page and recreate your 
  link) Check you ISP regards uploading. Most will have a help web page or FAQ 
  or will provide advice over the phone. Many use different ways of uploading 
  so it is important to check and seek advice. Most want you to use a protocol 
  called FTP. On the whole this will allow you to use Microsoft's Web Publishing 
  Wizard. Click the Start button on your desktop select programs and find the 
  following If you can't find web publishing wizard you may need to install it. 
  Click on Start -> Settings -> Control Panel the select add remove programs. 
  Click Windows Setup tag and then click on Internet. tools make sure the web 
  publishing wizard box is ticked (if not do so and follow instructions) Once 
  you've selected web publishing wizard from Start menu follow the on screen instructions. 
  On the Select File or Folder menu put in the path to your web site folder (you 
  can use browse) and click next. Then on the Name the Web server put in the box 
  any name (it is not technically important so something you would remember like 
  "Joe Bloggs server"). On the Specify the URL and directory type in the address 
  given by your ISP e.g. http://www.yourserver.net/joebloggs . THIS IS YOUR SITE 
  ADDRESS The directory for your web page should be in the box below. Click next 
  and connect (dial up box should appear). The next follows some ISP security 
  steps (often just your username and password but check). Complete the remaining 
  pages as per instructed.  
   
  CHECKING YOUR SITE 
   
  It is vital you check your site quickly (and preferably with several browser). 
  The Site address you entered above should be entered in your browser if you 
  use a start page named index(e.g. http://www.yourserver.net/joebloggs) This 
  will open onto you page called index automatically. If not add a backslash and 
  type the webpage name in plus its file type (.htm) (e.g.http://www.yourserver.net/joebloggs/home.htm) 
  Check every thing works  
   
  That's it !!!!!! That's all you have to do to make up a basic site. Congratulations!!!! 
  This is not a guide to doing it by every route (some of the above tasks can 
  be done by right clicking to get another menu for example). Nor is it complete 
  so play around and you can do thing like create bulleted lists of text  
