Lecture Notes - Tues Feb 4

Computer Science @ Marlboro

Introduction to the Internet, Spring 2003

Lecture Notes - Tues Feb 4

Go over homework.
- IP address as "base 256 number".
  - baseConvert.cgi
  - Do an example in class.
  - Another number example: color specifications in web pages: #FFFFFF or #DD0033
    See htmlrgb.gif
- Creating an HTML text file and putting it on akbar.
  - Edit with ... NotePad, Composer, XEmacs, TextPad, etc.
  - Get it to the right place with ... mount remote disk on desktop (i.e. "Map Network Drive) or SFTP client (i.e. FileZilla) or command line "sftp".
  - Note again that there are many addresses (depending on how you're getting there) for a file you publish on the web at http://akbar.marlboro.edu/~you/stuff/file.html
- Questions about anything so far?
  At this point you should be able to edit text files and put them in the right place.
A bit more about the behind the scenes
- "ports" - different kinds of servers listen at different virtual addresses on the same computer. (Search "tcp/ip ports" on Google)
- HTTP - Hyper Text Transfer Protocol - is the language used to ask for web pages, on port 80.
- HTML - Hyper Text Markup Language - is what actually arrives within the HTTP.
- Here's the whole picture of the layers and addresses
```
(physical-wire 
   (ethernet 00:60:97:98:1E:6B 
     (ip 12.6.230.2 
        (tcp port 80 
           ( HTTP 
               (HTML ))))))
```
- Quick quiz: how many ethernet addresses per capita worldwide? how many IP addresses? How do you figure that out?
- Example: let's talk some HTTP.
```
 $ telnet akbar.marlboro.edu 80
 GET / HTTP/1.0
 Host: akbar.marlboro.edu

 HTTP/1.1 200 OKHTTP/1.1 200 OK
 Date: Tue, 04 Feb 2003 06:40:35 GMT
 Server: Apache
 Last-Modified: Thu, 30 Jan 2003 20:38:15 GMT
 ETag: "316cb-62-3e398d37"
 Accept-Ranges: bytes
 Content-Length: 98
 Connection: close
 Content-Type: text/html

 <HTML>
 <HEAD>
 <META HTTP-EQUIV="Refresh" content="0;URL=http://www.marlboro.edu">
 </HEAD>
 </HTML>
 Connection closed by foreign host.
```
  We'll do this in class. There are several voices in this conversation: some of it is me, speaking client-side HTTP, some of it is the remote server, answering with server-side HTTP, some of it is the HTML that the remote server is sending me, and some of it is talk to and from the telnet program handling the connection. Can you see which is which?
- How to follow up on this if you want to learn more.
  - Type "HTTP tutorial" into google.
    For example, http://www.jmarshall.com/easy/http/.
  - Type "HTML tutorial" into google.
    (This is what we're doing next in the text.)
    For example, http://www.cwru.edu/help/introHTML/toc.html.
HTML Tags Intro - chapter 3 in the text
- file MIME type (Content-type: text/html) is specified in though HTTP headers, though some browsers incorrectly look at the .html extension.
- anatomy of a typical HTML and XML-ish "tag":
  <NAME OPTION1="this" OPTION2="that"> ... content ... </NAME>
- tag name and option can be upper or lower case; irrelavant.
- tags can go be embedded (nested) inside each other.
- some tags are only allowed in certain parts of the document.
- Different browsers format things differently; hard to predict. (So stick with common forms and don't sweat it.)
- HTML cast of characters
  - page skeleton : (html (head (title ...)) (body ... ))
  - text format: big, small, i, b, font
  - vertical space: br, p, hr
  - horizontal space: problematic
  - section headings: h1, h2, h3, h4, h5, h6
  - pre, blockquote
  - lists: ul, li
  - links: <a href="url">link</a>
- Show some examples.
- Don't be shy about "View Source" when you find pages you like.
Assignment for next time: play around with all this. (See the course homepage.)

Jim Mahoney (mahoney@marlboro.edu)
Last modified: Mon Feb 10 18:43:42 EST 2003