Information Systems & Services Howard University
Microsoft Office and FrontPage Web Page Guidelines

See Also...
Web Resources, Policies & Guidelines

Page Index:


Setting Page Titles:

Page titles are used in search engines, and in the title bar in web browsers.
Here are some examples:

Page title used in a web browser

Page title used in a search engine

If page titles are not set, your web pages will often be displayed as "New Page 1" or "Untitled Document", which can reflect very poorly on your web site. Examples of this can be found using Google, by searching for "New Page 1" or "Untitled Document".

To set a page title, do the following:

  1. Make a new web page or pen an existing web page in FrontPage.
  2. Right click on empty space somewhere on your web page.
  3. Click "Page Properties".
  4. In the "Title" text box, change the text to a meaningful title for the current web page. This should also include "Howard University" and the name of your web site (e.g. "Enrollment Management" or "School of Law") before the title of the current page. Here are some examples of full page titles:
    • Howard University - School of Law - Contact Us
    • Howard University - Information Systems and Services - Telecommunications Department - Phone Request Form
    • Howard University - Department of Math - Faculty Listing
  5. Click OK.

Using Keyword and Description Metatags:

Keyword and description metatags are used in search engines to help find results and are used to display a short description of the web site that was found. Including these metatags not only helps people find your web site in search engines, but also gives them more information than what is in the page title.

To create keyword and description metatags, do the following:
Note: The following instructions were made using FrontPage 2002, and may require different steps in other versions.

  1. Make a new web page or pen an existing web page in FrontPage.
  2. Right click on empty space somewhere on your web page.
  3. Click "Page Properties".
  4. Click the "Custom" tab.
  5. Next to the "User Variables" box, click the "Add" button.
  6. In the "Name" text box, type "keywords".
  7. In the "Value" text box, type a list of keywords the are related to your web site.
  8. Click OK.
  9. Next to the "User Variables" box, click the "Add" button again.
  10. In the "Name" text box, type "description".
  11. In the "Value" text box, type a description of your web site or the current web page you are editing.
  12. Click OK.
    The Page Properties window should look similar to the following screen shot:
  13. Click OK in the "Page Properties" window.

Using Fonts and Paragraphs:

  • Never underline text on the Web unless it is a link. If text is a link, then it will underline automatically.
  • Unless absolutely necessary, never use all CAPS. On the internet, writing in all caps is often used to show anger or shouting. Most people also read by recognizing the shape of words to help them read quicker. When text is in all caps, it forces the person to read the word letter-by-letter.
  • Never use "blinking" text. It causes serious usability and accessibility issues.
  • Never use "Justified" text alignment.
  • Only use one of the the following fonts for Web pages (in recommended order):
    1. Arial
    2. Verdana
    3. Helvetica
    4. Times New Roman
    5. Georgia
    6. Geneva
    You may also use Courier New as a fixed-width font.
  • Avoid using size 1 (8pt) fonts for content and navigation that is critical to the use of the Web site. On some browsers/computers text at that font size is completely unreadable.
  • Use Verdana when using size 1 (8pts) fonts.
  • Avoid settings font above size 5 (18pts). Any fonts larger can have severe consequences on the usability of your Web site.
  • Never use "Paragraph" settings for text (e.g. line spacing, word spacing). These settings are normally accessed from the "Format" menu or by right clicking on text and selected "Paragraph". The following problems can come up when the paragraph settings are used:
    • Text overlaps other text or images.
    • Text is pushed off the page or is only partially visible.
    • Inconsistent formatting between browsers or different versions of browsers.
  • Avoid using "Borders & Shading" under the "Format" menu. This may cause problems similar to using the "Paragraph" settings.
  • Never use "Position" under the "Format" menu. This may cause problems similar to using the "Paragraph" settings.

Using Tables:

  • Do not click and drag the borders of the table. This may seem like the best way to resize columns and rows, but it has severe consequences. Here is how to check to see if you have accidentally resized a column or row:
    1. Go to the "Edit" menu.
    2. If the first item in the menu says "Undo Resize" then click it. If it does not say this, then you are OK.
      NOTE: This only works if you have not done anything after resizing the table.
    You can also check the table and cell properties to see if a width and height have been set.
  • Never set tables to a percentage above 100% or to a width of more than 600 pixels.
  • Avoid setting cell and table heights unless absolutely necessary.

Using Images:

  • Never insert a large image into FrontPage and then resize it there (aka: Resizing in the HTML). In order to properly resize an image, you must use an image editor such as Adobe Photoshop, Macromedia Fireworks or Jasc Paint Shop Pro.
  • Make sure images are properly compressed before using them on a web page.
  • Never insert images that have a width of more than 600 pixels.

    Sometimes it is difficult to tell if an image as been "resized in the HTML". Here is how you can tell:

    1. Right click on the image you think has been "resized in the HTML" and select "Picture Properties".
    2. Under the "Appearance" tab, make sure the "Specify Size" check box is not checked. If it is checked, then uncheck it and click OK.

Saving Web Pages from Microsoft Office Applications, and Web Browsers:

Saving Web Pages from Microsoft Office Applications (e.g. Word, Excel)

Never use the "Save as Web page" or "Save as HTML" features in any of the Microsoft Office applications (e.g. Word, Excel). This may seem like an easy way to save your Word documents and Excel documents as web pages, but it causes severe usability issues.

Here are some of the problems that may come up if you use this feature:

  • Pages contain extra HTML "junk" that can increase the size of your web pages as much as 300%.
  • Problems similar with using the "Paragraph" settings for text:
    • Text overlaps other text or images.
    • Text is pushed off the page or is only partially visible.
    • Inconsistent formatting between browsers or different versions of browsers.

Even if you are able to view the saved document correctly, there will be many people who will encounter problems. See the Copying and Pasting to FrontPage section for help on how to transfer your documents to FrontPage.

Saving Web Pages from Web Browsers

Never use the "Save As" feature under the "File" menu in your browser, especially if you are using Internet Explorer. Browsers will often do a lot of damage to a page to try to save it easily to your computer.

Here are some problems that will come up:

  • Heavy alterations to the HTML code, including the addition of HTML that was not there previously.
  • The source of images is changed to point to a folder that is saved on your computer. If that saved web page is then uploaded back to the server, then the images will not display.

Copying and Pasting to FrontPage:

Never copy text directly to FrontPage from another Microsoft Office product (e.g. Word, Excel, Outlook) or from Internet Explorer. Extra HTML "junk" is copied that is very difficult to remove and can cause serious formatting problems. The extra HTML "junk" can also increase the size of the file by as much as 200%. There are other Microsoft and 3rd party programs that will also do this. A good way to watch out, is to make sure that the text you copy does not have any formatting (e.g. bold, bulleted lists, tables) after you have pasted into FrontPage.

Note: In FrontPage 2002 (XP), a small box with a picture of a clipboard will appear when you paste text. If you click the box, and select "Keep Text Only" then you can avoid the steps below.

To properly copy text to FrontPage, you must do the following:

  1. Open the document that you want to copy text from (e.g. A Word document or a web page).
  2. Highlight and copy the text you would like to copy, and then go to then Edit menu and then click Copy.
  3. Open notepad by doing the following:
    1. Click on the Windows "Start" button.
    2. Click "Programs" or "All Programs"
    3. Click "Accessories"
    4. Click "Notepad".
  4. In Notepad...
    1. Go to the Edit menu and then click Paste. The text you copied should now be in notepad.
    2. Highlight the text you just pasted, and then go to then Edit menu and then click Copy.
  5. Open FrontPage and open the web page you want to paste the text into.
  6. In FrontPage...
    1. Click in the location where you would like to insert the text.
    2. Go to the Edit menu and then click Paste.
    3. Verify that the text you pasted does not have any formatting (e.g. bold, bulleted lists, tables).

This process may look complicated, but it is very easy once you go through it once or twice.

Testing Your Web Pages:

You should always test new web pages and test pages that have had major updates.

Here are some ways to test your web pages:

  • Try using different browsers besides Internet Explorer, such as Netscape or Opera.
  • If possible, try viewing the page on different operating systems (e.g. Windows 95, Windows 98, Windows 2000/XP, Macintosh, Unix/Linux).
  • Test different window sizes to see how your web page displays by doing the following:
    • Resize your browser window to use a small width, and then to try a very large width.
    • Try viewing the web page in different resolutions.
      To help test this resolution, screen captures of popular browsers at various resolutions are available below. Resize your browser windows to match the same width/height as the screen captures to test at those resolutions.
© Howard University, all rights reserved.
Information Systems & Services
2301 Georgia Avenue, NW, Suite 334, Washington, DC 20059. Phone: 202-806-2940
Webmaster / Contacts - WWW Disclaimer