The Stone Age Meets the Information Age:
an introduction to archaeology
Professor Jeanne Sept
Student Building 038 (office)
Lisa Maiorino (intern)
Teter Hall room xxx
Digging the Web
Today we will meet in the computer lab to introduce you to the process of creating a web page. Hopefully, by the end of class, everyone will have created a simple home page, and be well on the way to finishing the "Web Assignment 1" due Monday afternoon.
If you really get into this, and feel ambitious... here's a link to the IU WebMaster's HomePage, with all sorts of tips....
1. Create a simple HTML page from a template and save it on the local hard drive (scratch disk)
- learn about the concept of HTML (go to introduction)
- get a copy of the HTML code of a sample WWW document (go to Step 1)
- replace the text on the HTML file with your own information and save it on your hard drive with your own name and then copy the file.
2. Set up a MyPage account
3. Move web pages and images from your computer into your MyPage www directory
(taken from TLTL page: http://www.indiana.edu/~ecopts/overview.html)
Creating a World Wide Web (WWW) course homepage means creating a computer file that contains special "codes" or "tags" that allow it to be viewed with WWW browser. Your computer file can contain links to other files you create and links to other sites or files on the Internet. The system of "codes" or "tags" used to format and link WWW files is known as HyperText Markup Language (HTML).
Generally, you will create the HTML files on your personal computer and then transfer them to another computer (the MyPage server) so they can be read by anyone who has a WWW browser and who knows the address, or Uniform/Universal Resource Locator (URL), of your files.
back to top
STEP 1: Look at a Web Page and View its HTML code
One simple way to create a WWW page is to find a simple one you like and then "adopt" the basic HTML formatting from it, replacing the text with your own. With a browser, you simply visit a page you like, go to the View menu, and select View Page Source. A file will open containing the source (HTML tags and text) for the page. You can save this file to your hard drive (or copy and paste it into a word processing document) and edit it to your liking.
- Under the View menu, choose Page Source, and the HTML file for that page will open on your screen
- Compare the HTML file side by side with the web page... can you spot the HTML tags listed below?
Here are some quick explanations of some <tags> that you will see on this page, and what they do:
<html> and </html> begin and end every HTML document (required) <head> and </head> begin and end the header information, which must include a title for the page window in the browser (e.g. QOOO), and can also include specific colors for the background and the links (If you don't include specific colors, it uses default colors, like a grey background.) <body> and </body> begins and ends the body of the text and images you want on your web page (required) <p> begins a new paragraph <center> and </center> begin and end a section of text that you want centered on the page. Without the <center> command, your text will default to the left margin. <font size =5> and </font> begins and ends an optional command for font size. If you don't use this command, your font will be the default set for your browser. <a href= "http://www.indiana.edu/~bot.html">Indiana University</a>
The <a href= .....</a> command includes a URL location (in quotes) you want to link to, and the text on the page you want underlined for the user to click on to follow the link (in this case Indiana University).
Note that it is important to include the HTML < > symbols in pairs!
<img src="http:// www.indiana.edu/~tltl/ images/owl_sm.jpg">
The <img src= ... > command includes a URL location (in quotes) for an image you want to display on your page in this location.
You should either include the complete URL of an image already on the WWW on another server, or include the complete URL of an image you have created and put in your own MyPage WWW directory.
These are really all you need to start... if you want to learn more HTML commands, here are some links you can use for reference:
In addition, an easy way to create your HTML files is to use your word processing package to type in the tags or codes needed to format an exisiting document. There are programs that make it easier to "mark up" a text file with the appropriate HTML tags. If you use recent versions of Word, you can save your files as HTML documents without having to do much extra typing at all. Other programs such as Dreamweaver make it easy to create HTML files.
There are a number of commercial HTML programs that make it easy to create web pages...
back to top