Lab 2
Part 2

World Wide Web Basics

What's the World Wide Web?

The World Wide Web, more commonly referred to as WWW or "the Web" is a collection of documents stored on computers across the world which know how to communicate with each other in a certain way. Each of these documents is written in a hyper-text language (see below) and is stored on a computer known as a web server. This web server knows how to talk to other web servers using something called the hyper-text transfer protocol.

You've probably noticed that when you view web pages in Netscape, the address always begins with "http", but when you were uploading files, it began with "ftp". This is because http and ftp are protocols -- ways of transmitting information so that different computers can understand each other. Because Windows, Mac and Unix computers all store things differently, they need common protocols for transferring files so that, for instance, your Windows computer can understand a web page being stored on a Unix machine.

How Web pages work...

Web Pages are text documents written in a language called Hyper-Text Markup Language (HTML). Basically, it looks like regular text, but includes extra information about how to display that text. If, for example, you wanted the word "dog" to be in italics, you would write something like "<i>dog</i>". The "tags" around dog tell your browser when to turn on and turn off the italics so that it displays the word as dog. You can always look at this HTML code by selecting "Page Source" from the "View" menu. You'll learn all of the different tags and how to compose HTML documents next week.

Once you written a document in HTML, you can view it with any Web Browser or HTML editor/viewer. What's important is where you put it. If it's on your own computer, then most likely you are the only one who will be able to see it. If, however, you upload it to a web server and make it world-readable then anyone in the world should be able to see it. At Princeton, you do this by creating a directory on your Unix account called "public_html". Almost anything you put in this directory will be viewable by anyone in the world.

Of course, with so many computers and HTML documents all over the world, it's important to have a good scheme for locating them. A Web address is known as a URL (Uniform Resource Locator) and follows a distinct pattern. For instance, in the following address:

http://www.princeton.edu/index.html


• http -- tells us the protocol one must use to read it
• www -- tells us the name of the web server that is going to find the page and serve it to you. A good number of web servers are named (or aliased) "www" in order to make it easier to locate them.
• princeton -- gives us the name of the group of computers which includes that web server. You may notice that this lab page is located in the cs.princeton group of computers.
• edu -- tells us that this is an educational site. Other possible endings include:
  
  • gov - government
  • com - commercial
  • org - organizational
  • mil - military
  Sometimes you will see other codes after this one. These are usually country codes and most non-American sites use them. For example, japanese sites are suffixed with ".jp".
• index.html - tells us the name of the HTML document

Put all together, it reads nicely from left to right. First, we're told the protocol to use. Then comes the domain name, which gets bigger from left to right. Finally, we see the location of the file at that domain (which may include directory names).

Designing a Web page...

Of course, designing a Web page is a lot more than simply knowing HTML and having a place to put it. Because anyone with these resources can publish their own web page, it is more important than ever to follow certain style standards. As you browse the web, you'll see some pages you like and some you hate. Copy the locations of both kinds into your Notepad file for reference. Next week, you may want to use this to go back and copy the style of a page you like a lot and avoid the mistakes of one you thought was bad.

For now, we'll just list a few issues which you may want to keep in mind. Feel free to skim them and refer back next week when you're actually designing your page.

• Color Scheme: Pages with black text on white backgrounds may be boring, but they're much easier to read than red on orange. Similarly, noisy background images make text difficult to read. Notice which combinations you find most attractive and keep watch for appropriate graphics which eliminate the need for some text entirely.
• Load Time: Some lovely graphical pages are stunning to look at but impossible to load. This is because graphics files are so huge in comparison to plain HTML files. It takes a lot more time to transfer them and every single image increases th is load time. For this reason, good designers try to strike a balance, looking for small graphics which are genuinely useful or very appealing to the user.
• Navigation: It's easy to get frustrated in a web site with insufficient navigational buttons. The Web is so named because of the myriad of links connecting every page with every other page. Instead of relying on the user's back button, it is usually better to include many links/escapes. Sites which trap users are unpopular and seldom revisited. Ideally, the user should never need to use their back-button at all.
• Organization: Rather than having many layers of randomly assorted pages and dead ends, web pages should follow well-defined hierarchies. For example, it would be very difficult for you to follow this lab if there was a link from Page 1 to Page 2, but you had to return to Page 1 and then go to Page 5 in order to get to Page 3. Designers should always think about the logical flow of information and try to provide convenient links.
• Content: The most important thing about every web page is content. If there's nothing to say, it does matter how well the web page tries to say it, it will fail. Thus one of the most important and yet most difficult things to do is to find something worthwhile to say. A very useful page will get visited no matter how ugly it is.