Microsoft Office Online
Sign in to My Office Online (What's this?) | Sign in

Warning: You are viewing this page with an unsupported Web browser. This Web site works best with Microsoft Internet Explorer 6.0 or later, Firefox 1.5, or Netscape Navigator 8.0 or later. Learn more about supported browsers.

Quick Reference Card - Audio course: Create a Web site with FrontPage

Plan your Web site

  1. Determine goal.
    • Make it specific, if necessary.
    • Keep it short and focused.
    • Know your audience.
  2. Sketch site structure.
  3. Sketch a common page layout.

Find a Web server

To find a Web server, do one of the following:

  • If you want your site on the World Wide Web, search for a Web site hosting company using your favorite search engine.

    Or, go to the Locate a Web Presence Provider Web site.

  • If you want your site on your company's intranet, then your IT department may have a server you can use. It's also possible that your very own computer could be configured as a Web server. For details, you'll want to consult your IT department, your manager, or the nearest computer guru.

Get server details

Once you've found a server for your site, make sure to get the following information before you start designing your site:

  • URL   For example: http://www.adventure-works.com
  • Correct file name for your home page   index.htm, index.html, default.htm, or default.html
  • Publishing destination   http:// path or ftp:// path
  • User name and password   
  • Server restrictions   File size limit? Other restrictions?

Create a Web site

If you made a Web site using a third-party program (for example, Macromedia® Dreamweaver® or HomeSite™), you can convert that Web site to a Microsoft FrontPage® Web site by clicking the Open Site command on the File menu. If you need to start from scratch, the following steps will guide you through the process.

  1. On the File menu, click New.
  2. In the New task pane, click either One page Web site or More Web site templates.
  3. If you want a Web site based on a pre-made template, choose a template on the left. You can also choose the Empty Web Site template if you don't need a pre-made Web site.
  4. Do one of the following:
    • To create a new disk-based site, click the Browse button. Browse to a location on your computer where you want to store the Web site. When you've found the location you want, click the Create New Folder button Button image, type a name for the Web site, and then click OK. Click the Open button, and then click OK.
    • To create a server-based site, type the URL for the new Web site in the Specify the location of the new Web site box, and then click OK. Note that a server-based site can only be created on a Web server running FrontPage Server Extensions from Microsoft or Microsoft SharePoint® Services.

How to quickly create a Web page

Create a new Web page, and give it a layout

  1. Along the left side of your screen should be the Folder List. It shows all the files and folders in the site. (If the Folder List isn't visible, click the Toggle Pane button Button image.)
  2. At the top of the Folder List, click the New Page button.

    New Page button at top of Folder List

  3. Name the new page, and then press ENTER.
  4. Double-click the new page to open it.
  5. Now close the Folder List to give yourself more room. To close the Folder List, click the Toggle Pane button Button image.
  6. Now make sure that the Layout Tables and Cells task pane is open on the right. If you don't see it, click Layout Table and Cells on the Table menu.
  7. At the bottom of the task pane is a list of layouts to choose from. Click a layout to apply it to the page.

Modify the layout

  1. If you'd like, you can change the alignment of the layout. In the Layout Tables and Cells task pane, under Table Properties, click the Align Center button Button image.
  2. Before changing the size of the layout, make sure to select the Auto-scale cells with table check box in the Layout Tables and Cells task pane. When you resize a table, this setting will allow you to automatically resize the cells inside as well.
  3. Now you'll resize the layout table to suit your design. In the Width box, type a value in pixels, and then press ENTER. Do the same in the Height box.

Add an image

  1. Click inside a cell.
  2. On the Insert menu, point to Picture, and then click From File.
  3. At the top of the dialog box, click the Look in box, to expand it.
  4. Then browse your computer to find the picture.
  5. Click the picture, and then click the Insert button.

Add text

To add text, you can type or copy and paste from other files or programs. Or, you can import text from a Microsoft Word document.

  1. On the Insert menu, click File.
  2. At the bottom of the dialog box, click the Files of type box to expand it, and then click Word 97-2003 (*.doc) in the list.
  3. Locate the document on your computer.
  4. Double-click the Word document to import the text.

Insert a hyperlink

  1. Select either text or a picture.
  2. On the Insert menu, click Hyperlink.
  3. On the left, click Existing File or Web Page.
  4. Select a page, and then click OK.

Add a background to the page

  1. On the File menu, click Properties.
  2. Click the Formatting tab.
  3. Select the Background picture check box, and then click the Browse button.
  4. Locate an image file on your computer.
  5. Select the image, and then click Open.
  6. Click OK.

Add a background image that is not tiled across the page

  1. On the Format menu, click Style.
  2. In the lower-left area of the dialog box, under List, make sure that HTML tags is selected.
  3. In the Styles list, double-click body.
  4. Click the Format button, and then click Border in the list.
  5. Click the Shading tab.
  6. In the Background picture box, type the path to the picture.
  7. Select no-repeat in the Repeat list.
  8. Click OK three times.

Additional information

More information about using tables for page layout

This course only touched the tip of the iceberg when it comes to using HTML tables for page layout. See these other training courses for more in depth information:

Course What you’ll learn
HTML Tables I: Basic concepts Table basics: How to insert a simple HTML table, what table tags are like, and how to change
table properties
HTML Tables II: Table and cell widths More basics: How HTML table and cell widths work, and how to make them look the way you want
HTML Tables III: Design a page with layout tables The fun stuff: How to use layout tables to design a page, and how to use a tracing image to start
your layout
HTML Tables IV: Format and touch up a page layout Finishing touches: How to format a layout table, how to add color, style, and finesse like a pro, and how to make your table stretch

Other page layout techniques

You can also use layers for page layout. Frames is another technique you can use as well. Check out the following for more information:

More information on styles

If you would like to learn more about customizing your pages with cascading style sheets, check out these resources:

© 2010 Microsoft Corporation. All rights reserved.