Create a new web page by pulling down the “File” menu, choosing the “New” submenu, and then the “Composer Page” item. This brings up a blank page.
You can also choose “Composer” from the “Window” menu and then use the normal “File:Open” menu item to open an existing file. If you wish to start from a page on the web, you can view that page using Netscape’s browser, and then choose “Edit Page” from the “File” menu. This will open the page in Netscape Composer, where you can make whatever changes you wish and then save it to your local hard drive.
Netscape allows you to have “unstyled” text, text that doesn’t belong to any “paragraph-level” formatting. It calls this “Body Text”. In general, you shouldn’t do this. All of your text should be part of a paragraph, a heading, a list, a table, or some paragraph-level style. You should avoid the “Body Text” feature in HTML if you are creating professional web pages.
HTML tags “mean” something about the text that they enclose. Paragraph tags do not specify line breaks. They specify that the enclosed text is a paragraph. Different browsers will display paragraphs in different manners. Similarly, for headlines you do not specify a large font with bold as you do in a word processor, but simply that the text is a headline. There are a large variety of browsers available. A cell phone might display headlines differently than a larger browser, and an audio reader will likely display headlines in a completely different, non-visual manner.
By using tags that impart meaning to the text they enclose, browsers can more effectively display your information to a wider variety of readers, whether those readers speak the language the text was written in, whether they are viewing it on tiny or large displays, and whether they are viewing it at all instead of listening to it or touching it.
The typographical command to indent some text by three spaces and use a smaller font for quoted text means nothing to an audio reader, and if followed slavishly by a personal digital assistant could render a document unreadable. But the tag that specifies that the text is quoted text can be rendered appropriately according to the viewer’s needs.
Set a paragraph by highlighting some text in a paragraph and choosing “paragraph” from the style menu.
The “Heading” styles are levels of headlines for your pages. In most visual web browsers, headlines will be shown as bold in large text, with extra space above and below.
You can think of headlines as sort of an outline of your page. Things that would be on the same level in an outline will have the same “heading” number. Your main headline is usually heading 1. You will often only have one heading 1 on your page. Your main sections will probably each have a heading 2. Sections within those sections will each have a heading 3, and so on. While there are headings going all the way to heading 6, if you have headings 4 or higher you may wish to consider breaking your page into multiple pages and “promoting” each heading to a higher level.
Each heading level is generally displayed as slightly smaller than the previous level. Heading level 1 is the largest, heading level 2 is slightly smaller, heading level 3 is slightly smaller than that, and so on. Search engines also will use headlines to assist them while indexing a web page’s keywords. Your headlines should be short and informative, precisely describing the topic that follows.
Here, we have one heading 1 giving the title of the web page, followed by two heading 2 headlines describing two musicians.
Go ahead and create your own web page. Give it one level one headline and several one- or two-paragraph sections. Precede each section with a level two headline.
Character-level tags are like italics or bold in your word processor. They are styles that can be applied to individual characters, and do not have to affect an entire paragraph.
Like paragraph level tags, where you want to use tags that “mean something”, you don’t want to use simply “italics” to italicize both emphasized text and citations. You’ll want to use the tag for emphasis when you want the text emphasized, and for citations when you are “italicizing” a citation reference.
On paper, italics are probably most often used to emphasize text. They’re a typographical tool for printing. On the web, many of your browsers are not viewing your page on a piece of paper; many are not viewing it at all. Instead of using italics, you can use emphasis. On visual displays, emphasis will be displayed as italic. Search engines can recognize emphasized text and rank it differently than normal text. And alternative browsers such as audio browsers can alter their output to emphasize the text in a manner appropriate to their “viewers”. An audio browser will change its inflection over the emphasized text, for example.
You have two levels of emphasis available to you: emphasis, and a stronger emphasis. The stronger emphasis is usually displayed in bold when visually rendered.
If you don’t mean to emphasize the text, but merely want typographical tags that do not affect search engine placement, vocalization, or other forms of display emphasis, you can use the italics, bold, and other typographical tags from the “Text Style” menu item under the “Format” menu.
Apply some emphasis to words or phrases on your page. If you don’t have any text that requires emphasis, add some sentences with some words that do require emphasis.
Web pages contain some information that is not displayed on the page. This information makes it easier for computers, such as web browsers and web search engines, to use the page. Under the “Format” menu, you have “Page Title and Properties”. This allows you to set the title and description of your page.
The “Location” shows the location of your web page on your hard drive. You should save your web page on a regular basis: if the power goes out or if you have some other troubles that cause your computer to shut down or crash, you can lose your work if you haven’t saved.
Your web pages should almost always end in “.html”. They should generally not contain any special characters: limit yourself to letters and numbers. This makes it easier for others to type in your URLs and to link to your web pages.
Within any of your web folders, one of your HTML files can be your “main” web page. When viewers request or editors link to the folder (such as “http://www.hoboes.com/NetLife/”) they’ll get the “main” file. Usually, the main file must be named “index.html”, but you should check with your service provider. Providing a main file simplifies the task of reaching your web pages.
You should save your web pages in the same order and with the same file structure that you use on your web site. Otherwise, your links are likely to fail when you upload your web pages from your hard drive to your web site.
Your title is the most visible of the three tags in this section. It is displayed in the “window bar” at the top of most large visual web browsers. If one of your readers bookmarks your page, the title is usually used as the name of the bookmark. When search engines index your page into their database, they display your title as the headline for your page when your page comes up in their hit list.
Because of this, you should take care that your title is useful and informative. Long titles are difficult to read in bookmark menus. Uninformative titles cause people to pass over your site in search engine listings. Your titles should be kept short and describe your site.
Often, your title will be an abridged version of your level one headline.
Your description is used to summarize the contents of your web site. Some search engines will display your description along with your title. (Others will summarize your page themselves automatically, and others will write a summary of your site by hand.)
Your description should be short, one or two lines at most, and descriptive of your site.
Give your page a title and a description, and then save it as “index.html”.
Some HTML tags can be contained within other tags. Emphasized text can be part of a paragraph, for example. And Paragraphs are part of the body, or document, of your web page. Netscape keeps track of all of the tags that enclose whatever text you currently have selected.
At the bottom of the page, you see a “tag trail” of the tags you’ve applied to your text. You can select wider amounts of your document by selecting higher levels of the tag trail. For example, if your cursor is flashing in an emphasized phrase, in a paragraph, in the body of your document, you can click on the ‘em’ tag in the tag trail and the entire emphasized phrase will be selected. If you click on the ‘p’ tag, the entire paragraph will be selected. If you click on the ‘body’ tag, the entire document will be selected.
While you want to use meaningful styles as much as possible, most of your web viewers will probably be viewing your site from a web browser (although with the advent of personal digital assistants, this may change). There are styles you can add to your page that are only visible in a visual browser. You have a large variety of stylistic variation available to you, but the most common ones are paragraph-level alignment and your page’s colors.
You can align paragraph-level text left, right, or centered. You can also justify the text, although in some cases web browsers are not good at justification. They do not, for example, have the option of hyphenating on the fly to provide aesthetic justification.
Most often, you will use the alignment buttons to change the alignment on your headlines. Alignment changes (other than perhaps justification) on paragraphs will generally make your page harder to read.
By default, your page is shown in whatever colors the reader of the page prefers. This is often the best choice. There are a lot of colors on a normal web page: the color of the background, the color of the text, the color of the links, the color of the visited links, and the color of “active” links. (The active link color is used while a viewer clicks on a link.)
When you change one color, you need to consider changing them all. If you change the background color to blue, it might seem nice with black text, but your links, which default to blue in many browsers, are likely to become invisible.
Unless your page specifically needs certain colors, it is easier to leave them alone. We’ve come a long way since the default black text on a grey background. Most browsers today default to dark grey or black on a white background--which is what most professional web editors choose anyway. By leaving your colors alone, you let the viewer choose whatever is easiest for them to read.
You can change the page colors from the “Page Colors and Background” item under the “Format” menu.
Besides an option for colors, you also can place a background image on your page. If you place a background image, it will override any background color you choose. We’ll talk about images later, but for now you should know that any image on your page, including background images, should be either a GIF file, a JPEG file, or a PNG file. You should also ensure that the content of your page is easily read over every part of your background. You don’t know how your readers will size their windows while they are reading your page. If the image is not as large as the viewer’s browser window, it will “tile” up and down.