Writing Writing a a

Web PageWeb Page

Using FrontpageUsing Frontpage

FrontPage is a FrontPage is a user-friendly user-friendly WYSIWYG html WYSIWYG html editor. To editor. To begin, open begin, open the program the program and a new and a new page.page.

Creating an IndexCreating an IndexAdd a title to your Add a title to your page (you can page (you can manipulate text as in manipulate text as in a word processor). a word processor). Then save this first Then save this first page as “index” on page as “index” on your W: drive. The W: your W: drive. The W: drive is your webhome drive is your webhome drive and all files drive and all files connected to your connected to your webpage should be webpage should be saved here. saved here.

Creating Other PagesCreating Other Pages

In FrontPage, click on theIn FrontPage, click on thecreate new page. You can create new page. You can create multiple pages (i.e. create multiple pages (i.e. one for your writer’s one for your writer’s profile, one for links you profile, one for links you want to include, etc.) want to include, etc.) Save each of these in the Save each of these in the primary folder on your W: primary folder on your W: drive. When saving pages, drive. When saving pages, use lower case file names use lower case file names and avoid punctuation.and avoid punctuation.

Creating LinksCreating Links

To create a hypertext link, first To create a hypertext link, first

type the text you want to type the text you want to

represent the link. Then, represent the link. Then,

highlight this text and right click highlight this text and right click

with the mouse. From the pop-up with the mouse. From the pop-up

menu choose “hyperlink.” From menu choose “hyperlink.” From

here you can browse your here you can browse your

computer or enter an internet computer or enter an internet

address to link to. Note: only address to link to. Note: only

files on your W: drive or files on your W: drive or

documents already on the web documents already on the web

can be hyperlinked to. can be hyperlinked to.

Creating TablesCreating TablesTables are useful and Tables are useful and can be read by almost can be read by almost every browser. Putting every browser. Putting

a a table on your index table on your index page a is useful to map page a is useful to map out the different parts out the different parts of your Website. Tables of your Website. Tables also help to avoid long also help to avoid long pages that the reader pages that the reader must scroll through. must scroll through.

Creating TablesCreating Tables

To create a table, choose “Table” -> “Insert” To create a table, choose “Table” -> “Insert” from the FrontPage Menu. Then choose the from the FrontPage Menu. Then choose the layout of your table (#s of rows and layout of your table (#s of rows and columns). columns).

You can also choose how much of the You can also choose how much of the browser screen width should be occupied by browser screen width should be occupied by the table. It is a good idea to choose less the table. It is a good idea to choose less than 100% so that the table will render as than 100% so that the table will render as you intended even on low resolution. you intended even on low resolution.

Creating TablesCreating Tables

To change the borders on To change the borders on a table, right click in the a table, right click in the table field and choose table field and choose table properties. table properties.

To change the To change the background colors of background colors of the table, the cells or the table, the cells or the page itself, choose the page itself, choose the respective the respective “properties” field. “properties” field.

You can also incorporate You can also incorporate images as backgrounds, images as backgrounds, but be careful they do but be careful they do not obscure the text.not obscure the text.

Design & LayoutDesign & Layout

While there is no one “right” way to While there is no one “right” way to create a webpage, your own ethos is create a webpage, your own ethos is established not just by the content of established not just by the content of your page but also by the design and your page but also by the design and layout of the page’s elements. layout of the page’s elements.

Compare the two following Compare the two following examples:examples:

VERSUSVERSUS

Design & Layout: PrinciplesDesign & Layout: Principles

1: Have a consistent theme through the 1: Have a consistent theme through the entire siteentire site

2: Try to use colors, styles, and fonts that 2: Try to use colors, styles, and fonts that compliment each other. compliment each other.

3: Ethos: There is a noticeable difference 3: Ethos: There is a noticeable difference between a page that simply has a few between a page that simply has a few pieces of information and reflects your pieces of information and reflects your interests and a page that is professionally interests and a page that is professionally organized around a focused purpose. organized around a focused purpose.

ResourcesResources

NAU Information Technology ServicesNAU Information Technology Serviceshttp://www5.nau.edu/its/http://www5.nau.edu/its/

English 105 Program HomeEnglish 105 Program Home http://www2.nau.edu/eng105/http://www2.nau.edu/eng105/