Mozilla Composer Directions

VERSION 1.7.5 for Mac and Windows

New Composer Document || Page Properties || Page & Background Colors || Inserting Text || Using Lists ||
Inserting Graphics || Inserting Video and Audio || Adding Links/Anchors || Saving & Viewing ||
To Edit your WebPage || Inserting a Table || Editing a Table

1. Starting a new Composer Document: Composer is a program in the Mozilla Suite. Open Mozilla. In the Winow menu, select Composer.
2. Identifying Page Properties Under the Format menu choose Page Title and Properties. This title information is available when people make a bookmark or favorite of your page. You will not see the other information on the page. It is visible in the HTML code and search engines can read it from this code.
3. Identifying Page Color and Background Under the Format menu choose Page Colors and Background, This menu option allows you to select your background color, insert a picture as a background, and identify your text and link colors. (There seems to be a bug in the program when you go back to change your colors, they DON'T change!) First select Use custom colors if you wish to select your own colors. Then click on the colored box to change the color. A color grid should appear and you can select your color you would like for the text and each link type. You also have the option to insert an image to be used as the background but be careful. Sometimes this doesn't work well in this program. Most likely you will want to lighten the picture in Adobe Photoshop Elements.
4. Inserting Text There are only three system fonts that you can be sure are on all computers. "Arial", "Times" and "Courier". These are the fonts to use! Just start typing like your would on a word processor. It is considered a good design practice to indent from the margins because it makes it easier to read the text. Highlight the text you write to add formatting.	Hover your mouse over the menu icons to see their options.
5. Using List Functions Lists can help organize information on your page. Lists are commonly used in two forms: bullets and numbers. Bullets and numbers can be combined with the Indent Right command to create an outline. To create items in a list, click your mouse to put the cursor where you want to add the list. Click on the bullet or numbered list icons to use this formatting. To remove a bullet or number, highlight the lines to be changed and click on the bullet or numbered list icon.	Table of Contents Scholarship Courses Undergraduate Graduate Presentations Publications Service UVM State Community Research Table of Contents Scholarship Courses Undergraduate Graduate Presentations Publications Service Research
6. Inserting Graphics Make sure you have placed all the pictures you wish to use in your web folder. Pictures must be formatted for the web as a .gif or .jpeg. Go to the Insert menu and select image use the image icon to insert a picture into your file. Alternate text is short description of what the graphic shows. Some visually impaired users have text readers that will describe your alternate text even though they can't see the pictures. Dimensions: (don't use) You should do all your resizing of pictures in a graphic program like Adobe Photoshop. Appearance refers to where the picture will appear in relation to your text. You can align it to your text in a variety of ways but you will best be able to control where your graphics and text will appear when you learn to use tables.
7. Inserting Audio and Video You can link to or insert a video or audio clip into any of your webpages but you must write some simple code to do this. Go to the page you wish to insert the video into or create a new page, just for the video. Go to the Insert/HTML Menu on the top of your screen and a blank dialog box will appear. Other settings that can be manipulated include: CONTROLLER=true (this includes a bar on the bottom of the video). You can change this to CONTROLLER=false to remove this bar LOOP=true (it will play over and over), LOOP=no, it will only play once. AUTOPLAY=no (it will not play automatically.) You need to click on it. AUTOPLAY=yes means when you come to that page, the movie will automatically play. To see your movie play, save your page and look at it in Netscape NAVIGATOR. Just like a graphic, you must have the actual movie or audio file in the same folder as the page and upload it to your public_html folder for it to play on the web. Make sure you write the code exactly in this format except to substitute your movie's name for campapple.mov.	<embed src="campapple.mov"pluginspage ="http://www.apple.com" width=280 height=220 controller=true loop=false autoplay=no> The example above demonstrates the code for a Quicktime Movie entitled "campapple.mov" that is 280 by 220 pixels in size. It includes a link to download a free Quicktime Plugin for their Browser for people that may not already have it installed on their computer. You can adjust the size of the movie by altering width and height but make sure you are not devaluating the quality. Remember to keep movies short - 2-3 minutes is recommended. Insert an audio file in the same way. If you wish the audio file to play with your web page, embed your code at the beginning of the body text. <embed SRC="aftermidnight.mp3" Width=280 Height=220 Controller=true loop=false autoplay=no> Note: You must respect copywrited material and cannot play segments of someone else's work without their permission.
8. Adding links You can make text or a picture link to another website, another one of your pages, or to a specific place on one of your pages. . Highlight the words or picture you wish to make into a link. Hint: Keep text short and simple but descriptive. Then go to the Insert /Link menu or click on the link icon. To link to one of your own pages, you can just Choose File (make sure it is in the same folder as the page you are working on. If you are linking to any other page, include the entire address starting with http://............ You can also link to documents. If you have a Microsoft Word document that you want others to access, make sure that file is also in your web folder, Write some words like-to download the syllabus. Also make sure the document you saved has the correct file extension ie.. (syllabus.doc, syllabus.pdf) If you would like to add an e-mail link, you can do so also. First its a good idea to actually write your e-mail address on the page, then highlight it as you would any link. Go to the Insert/Link menu and in the choose file dialogue box write: mailto:jmorris@zoo.uvm.edu replacing your e-mail address for mine. Note there are no spaces in the mailto command. Anchors: Anchors are links to specific places on a webpage. This is a two phase process. First you have to identify the anchors or places you want to link to on your webpage. Highlight a word in the place you want to link to and go to the Insert/Named Anchor menu. This lets you identify the name of your Anchor. You can indentify as many anchors as you wish on a page. The next step is to link to these anchors. Hightlight the word that will appear as the link. Go to Insert Link menu icon and when the dialogue box appears go to the text field and pull down the arrow on the right of the field and a list of the page's anchors are listed. Click on the one you wish to link to.	To add an e-mail link To Identify an anchor To link to an anchor
9. Saving and viewing your pages on Navigator. Never save your file in Navigator! Make sure you are in Composer when you save. To see what your page will look on on the web, select the Browse icon. You will be prompted to save because Navigator can only read saved files. To return to your composer window, go to the top menu called Window and all your open Netscape files will be listed.	COMPOSER NAVIGATOR
10. To Edit your web page. Go to the File menu in Netscape Navigator and select Open File. Go to the folder where you are saving all your web pages and you will fine your composer html file. To turn it into a Composer page so you can work on it again go back to the file menu and select Edit Page. This will open up your page in Composer and let you edit it. If you wish to edit a page already on the Internet, use Navigator and go to File/ Open Web Location and put in the URL. Once the web ge is open in Navigator, Go to the File menu and select edit page.
11. Inserting a table. Tables help you organize, control and present information in a grid of columns and rows. You can use one or more tables on a page when you want to have greater control over the layout of your text and images. To insert a table click your mouse where you want it to appear on your page. Click on the table icon or menu Insert/table. Your table can be customized. Indicate the number of rows and columns (this can be changed later). In choosing a width, you should decide whether you want % of window or a pixel neasure. Note: % of window will be controlled by the user and the size of the window they select. When you put in a specific # of pixels you control the layout, regardless of how the user resizes their window. Border Note : Composer uses a red dotted line to indicate tables with a zero border; the dotted line disappears when the page is viewed in a browser.
12. Editing a table/cells Select the table that you wish to edit, or click anywhere inside it. To move from one cell to another in a table, use the tab key to go from left to right. Open the Table /Table Properties and the dialogue box menu appears with two tabs: Table and Cells. Click the Table tab to edit that table. Use this to respecify the number of rows and columns and width of the table. You can also redefine your border and designate customized spacing and cell padding qualities. Spacing refers to the space between cells, and the cell padding (the space between the contents of the cell and its border). Table Alignment: Use this to align the table within the page. Choose an option from the drop-down list. Caption: Choose the caption placement from the drop-down list. Background Color: Use this to choose a color for the table background, or leave it as transparent.o view, change, or add properties for one or more cells: To change cell, row, or column properties: Select the row, column, or cell, then open the Table menu and choose Table Properties. The Table Properties dialog box appears. Click the Cells tab to edit the following properties: Selection: Choose Cell, Row, or Column from the drop-down list. Click Previous or Next to move through rows, columns, or cells. Size: Type a number for Height and Width, and then choose "% of table" or "pixels." Content Alignment: Select a vertical and horizontal alignment type for the text or data inside each cell. Cell Style: Select Header from the drop-down list for column or row headers (which centers and bolds the text in the cell); otherwise choose Normal. Text Wrap: Select "Don't wrap" from the drop-down list to keep text from wrapping to the next line unless you insert a paragraph break. Otherwise, choose Wrap. Background Color: Select a color for the cell background or leave it as transparent. Click Apply to preview your changes without closing the dialog box, or click OK to confirm them. Note: To change the text color or background color of one or more selected cells or the entire table, select the cells or click anywhere in the table and then click the text color or background color icon in the Format toolbar. Note To change the color of cells to the color last used, select the cell, then press Shift and click on the background color picker. This is useful when you want to use one color for individual cells. To learn more about creating Complex Tables