Web Design With Netscape Communicator

Web Design With Netscape Communicator - Transcript

Web Design with Netscape Communicator http 208 183 128 3 tutorials webdesign htm Connie Campbell campbelc k12tn net

Web Design
http 208 183 128 3 webdesign htm

Connie Connie Campbell Technology Instructor

Jefferson County Schools
campbelc k12tn net

1

Web Design with Netscape Communicator http 208 183 128 3 tutorials webdesign htm Connie Campbell campbelc k12tn net

Getting Started
1 Open Netscape Communicator 2 At the top line click Communicator Show Component Bar 3 Click Composer 4 Click File Save As 5 Type the name of your web page file and the location you wish to save it to a and click save Do not use capital letters or spaces in this file name 8 In the next dialog box type the title of the page using capital letters and spaces as needed This title will be the text which appears as a bookmark Anytime you wish to preview your page on a web browser click the Preview icon on the tool bar

1 Right click on a blank area of the page 2 Click Page Properties 3 Choose the text and link color Before creating your background you must decide whether you plan to use a solid color background or a background image Background images are located on the Internet Most can be used for free for non profit organizations It is best to locate the image first and download it before going to the next step 4 If you are not using a background image select the desired solid background color An image can also be tiled to create a background To download a background image Check inside Use Image and click Choose File Click location of background you downloaded from the Internet If you desire you can change the name of the background file Do not change the ending 3 letter extension 3 You will also need to decide the color of your links active and visited Consider the color of your background when you do so 4 Click OK

1 2 3 4 5

Type the text as you would in any word processing program You can change font style by clicking the arrow beside the text Variable Width To change the size click the next arrow Font color can be changed by clicking the arrow beside the black box Font can be made bold italicized and underlined by first highlighting it and then clicking the appropriate buttons on the tool bar 6 There are also three buttons on the tool bar to control text alignment once the text has been highlighted
2

Web Design with Netscape Communicator http 208 183 128 3 tutorials webdesign htm Connie Campbell campbelc k12tn net

Before you insert images pictures icons or bars you should first download and save them on diskette from the Internet Graphics found on the Internet are often for nonprofit use Some images on the Internet are very large and can be resized using an image editing program such as Soap to change the pixel size

To download an image from the Internet
1 Place the mouse over the image and press the right mouse button 2 Click save image as 3 Select the drive and location you wish to download to and if you desire change the name of the image to one which will be more meaningful to you Do not change the name of the ending 3 letter extension

To insert a graphic on your page
1 To insert a graphic click Insert Image Choose File 2 To insert a graphic from another file on your computer s hard drive click Browse and locate the file and image 3 If you click on the image you can also edit it onscreen Once an image is highlighted it can be aligned on the page by using the alignment buttons The image can be resized or moved onscreen using the mouse If you do not desire a frame for your image make sure the border under Space Around Images has a zero beside it The image can also be text wrapped see Text Alignment and Wrapping Around Images In order to view the effect of text wrap you must be in the Preview environment 4 You can also insert a bar by clicking the H Line button on the tool bar There are a variety of bars that can also be downloaded from the Internet

There are three types of hyperlinks

New Page
1 Click File New Blank Page 2 Right click on a blank area of the page and repeat the procedure for backgrounds text and images 3 Click File Save As 4 Type the name of your web page and the location you wish to save it to a and click save Do not use capital letters or spaces in this file name 5 In the next dialog box type the title of the page using capital letters and spaces as needed Remember this title will appear when the page is bookmarked
3

Web Design with Netscape Communicator http 208 183 128 3 tutorials webdesign htm Connie Campbell campbelc k12tn net 6 To hyperlink to this new page highlight the text on your previous page which you wish to link and click the link button on the top tool bar 7 Click Choose File and find the name of your new page 8 Click OK

URL Site Hyperlinks
1 To hyperlink to a URL site highlight the text you wish to link and click the link button 2 Beside link source type http and the entire address for example type http www cnn com to hyperlink to CNN Online 3 Click OK

Email Hyperlinks
1 To hyperlink to an email address highlight the text you wish to link and click the link button 2 Under hyperlink type mailto and the entire email address for example type mailto campbelc ten nash ten k12 tn us and click OK

1 To insert a table click Table on the tool bar 2 Choose the number of rows and columns you want in your table 3 You can also add color to your table by clicking Use Color and clicking the large button beside those words Then click the desired color 4 Select where you will place the table the percentage of width and height it will take up on your page and the border line cell spacing and cell padding width At this point you can choose if you will have equal column widths 5 Type information in the table by clicking in the cell Information in tables can be hyperlinked Text style and size can also be changed or realigned 6 To change the table you created right click inside the table and select Table Properties 7 You may add or delete tables rows columns or cells by right clicking inside the table and click Insert or delete Then select table row column or cell

4

Web Design with Netscape Communicator http 208 183 128 3 tutorials webdesign htm Connie Campbell campbelc k12tn net

Target words can be created on a page A targeted word links a word or passage to another location on that same page 1 Highlight the word you wish to target and click target button on the tool bar A name will be assigned to your target word You can change the name if you wish 2 Highlight the word you want to link to the target word and click the link button on the tool bar 3 In the dialog box click the target name 3 Click OK

To insert sound file 1 Locate sound file If on the Internet right click sound file select Save Link as Be sure the sound file ends with the three letter extensions wav or mid before saving Save file to the folder that contains your web site 2 In Composer click Insert HTML tag 3 A dialog box will appear In the box type the following text Replace the with the name of your sound file Change the wav extension to mid if your sound file is a midi file embed src wav autostart true loop false width 0 height 0 There are spaces after embed wav true false width 0 If you would like to add audio controls to your page along with sound type the following text instead The controls will appear wherever you have the insertion point The controls will be inserted wherever the mouse is located embed src wav autostart true loop false width 95 height 33 There are spaces after embed wav true false width 95
5

Web Design with Netscape Communicator http 208 183 128 3 tutorials webdesign htm Connie Campbell campbelc k12tn net

Saving your work
1 Click Tools Check Spelling to check your page for errors After errors are corrected continue to step 2 2 Click File save as 3 When the name and location of your file appears click OK

Sites to Visit
Web Construction http user icx net campbelld elementary projects web htm

Web Page Creation Resources
Web Page Design with Netscape Composer http 208 183 128 3 tutorials webdesign htm Web Page Creation and Graphics http user icx net campbelld web design tetc98 htm Creating A Classroom Web Page http 208 183 128 3 tutorials classweb html Online Classroom Newspapers http 208 183 128 3 tutorials indexnews html Jefferson County Tech Update http 208 183 128 3 techupdate

Website Garage This is a great place to test your site It will be evaluated online and recommendations given http www websitegarage com Multinet Web Broadcast Once your site has been uploaded promote visits to it through Web Broadcast This site will help you announce your site through the top search engines on the web http www nzsearch com nzsearch broadcast

6

Web Design with Netscape Communicator http 208 183 128 3 tutorials webdesign htm Connie Campbell campbelc k12tn net

Free Web Space

1 CyQuest http cqws com 2 Yahoo Free Web Space http www yahoo com Business and Economy Companies Internet Services W e b Services Free Web Pages 3 Buffalo Free New http freenet buffalo edu 4 Community Ware http www communityware com 5 Howdy Neighbor http www communityware com 6 Spider City http www spidercity com 7 Phrantic Web http phrantic com 8 Free Web Space http www showoffs com freewsp html 9 Free Web Space for Public Schools http www cuacs ncsu edu wis wisk12 htm 10 Free Space for Your Pages http www dsenter com faqs free html 12 Planet Tripod http www tripod com planet 13 Geocities http www geocities com

7

Web Design with Netscape Communicator http 208 183 128 3 tutorials webdesign htm Connie Campbell campbelc k12tn net

Uploading Your Web Page to Geocities
Your Geocites username is Your Geocities password is After your page has been created it has to be uploaded to the web If you used images you must upload each one too so you will be uploading html files the web page text and gif or jpg files the pictures or background Here s how 1 Open Netscape and go to Geocities Type http www geocities com in the location line 2 Log in to your account by clicking Sign in

3 On the left side of the screen you will see I m already registered with Yahoo Then type in your username and password and press the Sign in button

4

You will then click the Upload Files button

5

Now you are ready to upload your first file Click the first Browse button and locate that file It will probably be a html file 8

Web Design with Netscape Communicator http 208 183 128 3 tutorials webdesign htm Connie Campbell campbelc k12tn net

You will use this same process as you locate each file After all of your html files are listed you will be ready to upload the images You will need to change on thing to see your image files 6 Before you can upload images pictures backgrounds you must change the File of Type option to view All Files

After you have located all of the files you used on your page click the Upload Files button

To check your page locate the html file name and click the View link beside it

9

Web Design with Netscape Communicator http 208 183 128 3 tutorials webdesign htm Connie Campbell campbelc k12tn net

FTP Your Files to Geocities

Installation
1 2 Close all programs If you do not have WinZip installed on your machine insert the disk with WinZip Open My Computer and double click the a drive Then double click the WinZip 70 exe file An screen will take you through the WinZip installation allowing you to click Next to install the program After WinZip has been installed you are ready to install FTP Explorer Again make sure all programs are closed and insert the FTP Explorer disk Double click My Computer and double click the a drive Then double click the FTPx zip file

3

An WinZip screen will open Click the Accept button to unzip FTP Explorer

The next screens will demonstrate the installation of FTP Explorer Click the Next button on this screen

10

Web Design with Netscape Communicator http 208 183 128 3 tutorials webdesign htm Connie Campbell campbelc k12tn net
Click Install Now An FTP Explorer Setup Welcome Screen will appear Click Next A Choose Destination Directory Screen will appear click Next

After installation you will be directed to restart your computer An icon for FTP Explorer will be placed on the desktop

Using FTP Explorer
1 Open the program by clicking the FTP Explorer icon

11

Web Design with Netscape Communicator http 208 183 128 3 tutorials webdesign htm Connie Campbell campbelc k12tn net 2 To set up the preferences for your server click the Add button and type in the following information

Geocites ftp geocities com 21 Geocities username Geocities password

Uploading To log on click Connect after this information is completed After your school s folder is opened click File Upload to move the html and image files from your computer to the server Next select the drive in which your web page files are stored

12

Web Design with Netscape Communicator http 208 183 128 3 tutorials webdesign htm Connie Campbell campbelc k12tn net
After the files have been located click each file you wish to upload To select files in a series click the first file name hold down the Shift key as you click the last file If the files are scattered click the first file name hold down the Ctrl key as you click each file Then click Open after all files have been selected The transfer will begin

Each file will move across the screen You will be informed when the transfer is complete To close the FTP session you can click the X in the top right corner or click the disconnect button onscreen

Common Tasks
To remove a file click it once then click File Delete To rename a file click the file once then click File Rename

13