Making Web Pages

To start Composer, click the Communicator menu, then click Composer or you can click the Composer icon

at anytime.

Look at the Composer window with a blank page. If you create additional pages, simply click the File menu, click New, then click Blank Page. You will notice that you can also create pages from "Template" and from "Wizard." In this class we will use the Blank Page to create our document.

You will notice that unlike a word processor, HTML editors have no rulers, margins or tabs.

Because this is a new web page you will first need to establish the page properties.
Click on Format and choose Page Colors and Properties.

The Page Properties Box (as shown below) will appear on your screen. Select the General tab at the top if it is not already selected. Here is the following information that you will need to enter:

Title - This is the title of the page. It is also the name of the document that appears in the bar across the top of the open Netscape Window.

Author - The name of the page author.

Description - Most search engines display this text when they list your page. This must be less than 200 characters in length.

Keywords - List words here to describe your page and help search engines find it. Each phrase should be separated by a comma. You may enter up to 1000 characters (about 150 words). You will want to include your name, department, words from topics covered in your page or site. Avoid excessive repetition here since it may cause some search engines to stop indexing your page.

Page Colors and Backgrounds
In the same document properties box select the Colors and Background tab at the top.

The default Netscape color scheme is selected. To change any of the font colors or the background color simply click on the colored box next to the item you wish to change. You will be given a color palette from which to choose. Netscape also provides 12 different preset color schemes to choose from.

Adding a Background Image:
If you have an image that you would like to use as the background of your Web page, check the Use Image box in the Background image section at the bottom of the window and then enter the file and its location in the accompanying line (you may browse for the file by clicking on the Choose File... button).

Highlight the text "Basic Elements of Composer" with your mouse and using the Formatting Toolbar change the Style to Heading 1.

Text enclosed within a heading may look different, depending upon the browser. The browser may choose to center, embolden, enlarge, italicize, underline or change the color of headings to make each stand out within the document. Also, users can force how a browser will show the different headings.

The default alignment of all text is to the left side of a document. Let us center the title of the page by highlighting the text and choosing the center alignment from the alignment buttons. Align button

.

Note: Whenever text is highlighted and you press Enter on the keyboard the text will be deleted. If this happens to you select Edit|Undo.

Because we want the rest of our Web page to be aligned to the left we need to go down to the next line by pressing Enter on the keyboard, choose the alignment button again and click on the left justified button.

The very first page that any visitor will come to on your Web site is the "Home page." Most home pages are called "index.html", because most web servers automatically look for a page with that name. Let us save our Web page now. Choose File, then click Save As... and type "index.html" in the File name field, then click the Save button. A message may appear asking what the title of your Web page should be, type "Basic Elements of Composer" and click the OK button. The title will appear at the top of the browser window, not on the page itself.

You can enter text into your document by pasting from almost any source. For example, you can select text on a page you are viewing in an Internet browser, Word document, or just about anything you have on your computer and copy it with the Edit|Copy command. You can then paste it into the page you are currently editing by choosing Edit|Paste. Using the Netscape Navigator browser I would like you to visit http://www.nbcs.rutgers.edu/education/composer/sample.html. Using your mouse, highlight the first paragraph on the "Sample" page in the Navigator and copy the text.

Return to your Home Page and place your cursor below your title and paste the text. Without deselecting the text click on the Formatting Toolbar and change the font appearance, size and color. For example, Change the font to "Arial," make the font size "14," and change the color to "blue." If the alignment of the text is not the way you think it should look, make any changes you choose to improve readability. Keep in mind that when you use a font like "Arial" only those visitors who have the Arial font on their computer will see it in that font. Otherwise the font change will be ignored, save your Home page.

HTML has a set of tools that help you organize content into formatted lists. These lists provide a means for quickly understanding, scanning and extracting information from your HTML documents.

You can apply the List Item paragraph style by clicking the Paragraph style drop-down list on the Formatting toolbar, or by choosing List from the Format menu. The List Items have two styles. Numbers and bullets that appear at the beginning of each item.

On the Formatting toolbar click the Numbering button, this will place a number, starting with 1 before any new line you type. Bulleted items are executed using the Bullets button. Type "First item." Press Enter, type on a new line "Second item." When you use a numbered list, you will not see the numbers in Composer. Instead, the (#) will appear next to the items. However, these will appear correctly as numbers when viewed in the browser.

Once you have completed entering your information press the Enter key so that there is one additional button or number sign on the screen. Now click on the same button you used to create the list and the list will end.

To see the results of this new element, Save your Web page and click the Browse button Browse button

Return to Composer by clicking your mouse on the tab at the bottom of your screen that looks like this

Making Web Pages	Rutgers University Computing Services
Web Editor · Creating A Web Directory · Toolbars · Making Web Pages · Adding Links and Images · Tables and Spell Checking · Publishing