[content]

Southern Illinois University Carbondale

web

Class webpages
for busy writing teachers

This page is designed to help all teachers get started in basic html. It is the homepage of the CALL-IS Internet Fair Classics I presentation, "Web pages for Busy Writing Teachers" (TESOL 2003, Baltimore MD, Mar. 27, 2003). For more on web design and marketing, scroll down to the links.

Getting motivated

Consider the following: 1) The web is rapidly becoming the most important way people worldwide get information. 2) Most of the world does not speak English as a native language. 3) Most of the web is in English. Let's add these up. Yes, it is very important what ESL/EFL teachers do on the web!

Now consider these: 1) HTML is a very simple language: millions have learned it with little or no trouble. 2) For the price of a little of your (valuable) time, you will have control of your pages, will be able to change them at will, and will have the opportunity to get your students directly involved with the web. 3) We are language teachers....we should be able to learn a simple communication device to help our students (and ourselves) adjust better to the new world.

The following page is the basis for the TESOL 2003 presentation: Webpages for busy writing teachers. It is intended to get busy teachers to master and use the web in ways that can be class-specific, and which can allow them to teach students the all-important skills of finding, evaluating, citing and making references for background material on the web.

Many people use what is known as the WYSIWYG (What you see is what you get) programs to make pages. I have never used these, though I probably would if I were pasting huge amounts of copy onto pages every day. Learning code myself has been a little time-consuming (I also am a writing teacher), and I am definitely not an expert, but in a practical way, I make many pages for my classes and those of others, can do it simply and quickly, and can change them at will, as the class changes or as people want them changed. So it's a system that works well for me, and can work well for you too.

Using HTML yourself

Want your own page? Want one for your classes? It's not that complicated. There are a few simple steps you should follow.

1. You'll need the PASSWORD to upload your pages onto the server at your university (if you don't have one, free webpages are available on the market, but you may have to tolerate flashing banners on whatever you make). These passwords are not usually hard to find or get, but, needless to say, all of your work will be in vain, if you don't have one. Keep that password under your hat until you get started.

2. Open up Simple Text on your machine. On mine it's under Applications. Anything you type in Simple text will become code. If you copy and paste from a Word document, remember that HTML is slightly different from your word processor; it doesn't honor returns (marked specially in html); it reads quotation marks in a special way, etc. Simple Text will allow you to put everything in a way that every computer will be able to understand it and represent it on the web, once it's uploaded onto the server. But it has to be in a simple language (Simple text) first.

3. Find a simple page that you like. You can start with our writing class's page from this term (Jan.-Mar. 2003) if you'd like. Now go to View and click on Page Source. You will see the code that produced that page. Your page can be like that page; you can steal the whole page if you like (html is not copyrighted, but the "content" is). You can even Select All, copy, go back to Simple text, and paste the whole thing on your own document. You'll make changes, I assume; maybe you'll put in your own e-mail address, for example. Now you have the beginnings of your own page.

4. Notice several things as you go along. You must tell the computer that the document is in HTML. You must have a "Head," which is what the computer uses to label your page. The title in the head is what the viewer will see as a title of the page; this may be different from the title you see when you open the body of the page. In this document, the title in the head does not capitalize "page", while the title on the page does. When a search engine labels your page, it will use this title, not the one on your page. Your computer will also label it in its "Go" functions.

5. If you like a certain font, or a certain color, from a page, you can simply find out how someone put it there, and put that on your page. Each color, for example, is represented by a combination of numbers and letters; if you see one you like, just copy it and put it on yours. I can't really give you a complete lesson on what everything else means, or why, but it's not that complicated, and you can always look it up, if you're really curious. Let me just admit that I'm no expert, yet I've made dozens of pages with this process, finding out slowly or not at all what some things really mean and why they may be easy or difficult for other machines to read. Eventually you can use this same process to put any kind of moving, whistling things, or even movies or interactive and dazzling additions. You can even give your viewer a headache if you really want to.

6. But, remember, effective webpages are simple, pleasing to the eye, and useful. For more on what works and what doesn't, read What makes people click, a manual for marketers, especially chapters 4 and 5.

7. Now, from Fetch, use your password to upload your page onto the server using the "PUT" command. I get momentarily confused when I press "PUT" until I remember that the file I want is on my desktop in a Simple text folder, waiting for me to put it up there. So, I find it and label it what I want; I end the label with "htm" or "html" so all old machines will read it as html. Remember, you always upload the code (Simple text document), not the picture (Netscape file or IE file). Now you have a webpage! Go show your friends. And make some more!


-Tom Leverett, 1-00
updated 3-03

Links to HTML Design Pages

Resources for web designers
What makes people click: Marketing an IEP program on the web (TESOL 2003)
Jim Leverett's HTML Links page
Yale Web Style Guide
Webpage Workshop: Style Guide (for ESL teachers)
HTML Layout guidelines for ITESL-J (good advice for pages with international audiences)
Quotes from professionals on Webpage Design
Webmonkey
Doghause
Warren Steel's Hints for Web Authors
F-right.html
WebCom HTML Guide
Yahoo's HTML Links

HTML Color Codes

WWWebfactory's Graphics page

[ Effective Webpage Design ] [ Issues in Web Design ] [ What makes people click ] [ Bibliography on web design ]

[CESL] [ CESL Teachers' Pages ] [ Tom's own page ]

IL Page maintained by
Thomas Leverett, CESL, SIUC
photo above (Spider Web) by Jim Leverett