Making a Web Page using Mozilla Composer
Computing Resources >> Tutorials >> Web Development >> Mozilla Composer 

Make Hyperlinks

Modify Page Properties

Preview in Browser

Evaluate this tutorial

Handout for this Tutorial


Getting Started using Mozilla Composer

This portion of the tutorial will cover getting started using Mozilla Composer and introducing the different tools available.

Step 1:
Start by launching Mozilla; the icon looks like a red Dinosaur head.

Step 2:
Once Mozilla is launched, you’ll see a typical web browser window. To start creating a web page, go to the menu item:
File > New > Composer Page

Step 3:
At the top, you see many icons that are similar to those found in a word processing application such as new, open, save and print.

top tier of tools in Composer toolbar

Other icons are unique to web authoring, such as image, which lets you insert an image in your page, and table, which lets you insert a table. Also, you see the link icon which lets you create a hyperlink in your page. Notice the publish icon; this is Mozilla’s FTP function which allows you to publish your web page to a server and make it viewable on the worldwide web.

On the next tier of icons, you have many of your text formatting tools.

second tier of tools in Composer toolbar

On the very left, you can choose the format for the type of text you are typing, whether part of the text body or a heading. Next you can choose the color of your text by clicking on the black box in the foreground and the color of your background by clicking on the white box in the background. The small and large A’s let you change font size, and you can also choose if you want your text bold, italicized or underlined. Finally, you can add in bulleted or numbered lists and choose a justification for your text.

At the bottom of the window you see tabs.

tabs at bottom of Composer window

These will allow you to toggle between different views. There is normal view, which is the default view you see now, and the tags view, which shows what part of the page you are working on. The code view shows the HTML code for your page and the preview tab will show you what your page will look like in a browser window.

next section >


Watch the video
Mozilla logo
choose format/speed
real media dial-up | broadband
windows media dial-up | broadband
quicktime dial-up | broadband

tutorial transcript

© 2003 Emily Hebard | iSchool | UT Austin | webmaster