Making your very first web page!  This is an exercise for people in our L530 class who have never done this before. You will be guided to create 2 simple pages and learn basic functions of Composer.

Other resources:
For people at the IUB campus, follow this tutorial: 

• School of Education Web page Tutorial http://www.indiana.edu/~educ/edpeople/webtutor/

• Netscape Composer Tutorial: Basic Introduction (Part I) http://www.cs.trinity.edu/~thicks/Communicator/Composer1/
• Netscape Composer:  An Introduction   http://www.furman.edu/~pecoy/mfl195/composer/index.htm
• Six-Step Netscape Composer Tutorial  (Separate help for Mac and PC users) http://www.msubillings.edu/tool/tutorial/

• Write some text in your 1st page.
• Make a link to our course website http://www.indiana.edu/~cell
• Write some text in your 2nd page.
• Build links so that your user can go from the 1st page to the 2nd and 2nd to the 1st.
• Choose a nice color for  your pages.
• Change font size and color.

How do I add a graphic to my page? 
 
 
 
 
 
 

How do I put photos on the web? 

Other search engines that I find useful are: 
(Type keyword 'clipart' in the box.) 
1. Google http://www.google.com
2. Excite  http://www.excite.com/
3. Alta Vista  http://www.altavista.com/

Once you find a graphic to use, put your mouse on it, click right mouse key, click on "save image as", save it in the place where your other html files are.  Now, go back to Composer, at the place where you want the graphic to show up, click  Insert at your tool bar --> Image --> Identify and select the graphic file. --> OK. 

If you highlight your graphic, you can insert a link (make it worked like a button) or center it in the page just as you do with text. 

This is for scanned photos: 
How to import a scanned photograph into Image Composer, Modify, and Save for the Web http://education.indiana.edu/workshops/icepitome.html
 

 
Insert a picture or graphic in your page.

(2) is the filename of your graphic in the directory/folder looked exactly the same as that indicated in your web page?  If not, you have to rename one of them to make both of the filename exactly the same (Case, spelling, everything has to be EXACTLY the same! 
The way to check it: 
A. In Composer --> put your mouse in the center of the spot where your graphic should be sitting --> click right mouse key --> click the first option:  Image properties --> the file name as spelled in your web page is in the "Image Location" box. 

B. Now check the filename in the directory/folder. If you use FTP program, you should see the graphic file listed in the right folder where your html page is. (If you can't see it there, you probably have sent the graphic file to the wrong place. You need to move your graphic to the right folder.) 

C. Compare filenames in A and B. If they aren't the same, rename one of them. (For example, if the file is CAT.GIF or Cat.gif in the directory and you typed in your web page as cat.gif -- it won't work. Must rename one.) 

(3) check the graphic links. In composer --> put your mouse in the center of the spot where your graphic should be sitting --> click right mouse key --> click the first option:  Image properties --> the file name in the Image Location box should be nothing but the graphic file name.  For example, "happy.gif" -- nothing else. Get rid of other stuff if there is any. --> click "apply" key and OK --> be sure to save --> send this html page again.  Go back to Netscape, press the Reload key. You should see it now. 

Every time you make a change to your html page, you must remember to save, upload, and go back to Netscape, reload. 
 

 
Insert a table in your page. Put text or graphics in the table, as appropriate. 

One way to do this is using the Half-Baked Software http://web.uvic.ca/hrd/halfbaked from the University of Victoria Language Center. This is  a suite of 5 authoring tools for creating interactive multiple-choice, short-answer, gap-fill, crossword. 
1. Down load the program on your computer. Double click to install. 
2. A tutorial is available in the program if you click the tutorial button at the right hand corner of the cover page of the program.  Follow it through. 

Some other easy quizmakers are: 
Puzzlemaker: http://puzzlemaker.school.discovery.com/
Quia!  http://www.quia.com/gamelist.cgi
Quiz Builder http://www.ccsf.cc.ca.us/Pub/Fac/quiz.html

Places online for making one's own quizzes.  http://eleaston.com/quizzes.html

To create a Web-based form or survey, use "Form Builder:" 
http://www.ccsf.cc.ca.us/Pub/Fac/survey2.html

Selecting the "HELP" link will send you to a page of step-by-step instructions which are very clear and useful. 

To learn more, see also "I want to learn more interactive functions. Where should I start?" 
 

 
If you like, you can try create a short quiz now.  Make it a separate page, and link to your existing pages.

Interactive JavaScript Quizzes for ESL Students 
http://www.aitech.ac.jp/~iteslj/quizzes/js/project.html

JavaScript for Language Learning Web Site 
http://deil.lang.uiuc.edu/JS4LL/

How to Make a Successful ESL/EFL Teacher's Web Page 
by Charles Kelly 
http://www.aitech.ac.jp/~iteslj/Articles/Kelly-MakePage/
Forms, Image Maps & CGI 
http://www.aitech.ac.jp/~iteslj/Articles/Kelly-MakePage/other.html

Scripts for Educators 
by Kristina L. Pfaff-Harris 
http://www.linguistic-funland.com/scripts/

Echoecho.com
http://www.echoecho.com/index.html

These are beyond basics, including other web functions, such as forms, image maps, frames, or other interactive functions. 

Not required, but you are encouraged to challenge yourself.

IUB students see the information provided by UICS Knowledge Base: At IUB, how can I put personal pages on the World Wide Web?

Distance students: Free home pages (with limited web space) are now available through many commercial sites, such as 
http://www.geocities.com
http://www.tripod.com
http://www.msn.com

Expect sharp learning curves! 

2. When you know where to put your file, you have 2 options: 
A. you can then follow this instruction to send your files 
http://www.indiana.edu/~educ/edpeople/webtutor/publish.html
It uses Composer to send the file, but of course you need to adjust it according to your server address. 
B. you use a FTP program, which gives you much more control and feedback. Follow the steps here. 

Remember: If you have graphics in your page, those graphic files have to, must, be sent to the same place/folder/directory as the html page that they are embedded in.
 

Publish your pages.

If you are an instructor here in IU, you can apply for an SSF conference. You can apply for an SSF forum for your class. An SSF forum is applied through TLTL (Teaching and Learning Technology Lab) here in IU. 
IU SSF home page: 
http://www.indiana.edu/~ssf/
The application form: 
http://www.indiana.edu/~ssf/ssf-request.htm

As to other options,

You can create a class (free of charge) with Internet Classroom Assistant at http://www.nicenet.org and make a link from your page. This will give you a free web board for on-line discussion. Quite intuitive.  A FAQ is here: http://www.nicenet.org/ica/ica_faq.cfm

http://www.blackboard.com also provides online classroom space for free to teachers.

Motet Web Conference tool 
http://www.motet.com/index.html
Haven't figured out how this works, but heard it is good.  If you are to try, let us know.