comp 14: html & the web june 20, 2000 nick vallidis
Post on 20-Dec-2015
219 views
TRANSCRIPT
COMP 14: HTML & the Web
June 20, 2000Nick Vallidis
Announcements
P5 due todayP6 due Friday
Homework
read 1.6 (p. 40-41), 2.9-2.10 (p. 92-100), 3.10 (p. 157-164), 4.7 (p. 211-212)
It's not a lot of pages, they're just scattered about… basically, it's most of the pages with the orange on the edge for the first 4 chapters.
Today
The webWriting HTML
The Internet
a group of computers in the same location are connected by a network called a local-area network (LAN) UNC is a good example of a LAN. A LAN is usually owned by one company
Multiple LANs are connected to form a wide-area network (WAN) the Internet is a WAN that spans the globe
Talking over the Internet
A protocol is like a language to a computer. It's the language it speaks over a network.
The internet uses a pair of protocols called TCP/IP TCP = Transmission Control Protocol IP = Internet Protocol
Internet addressing
Every computer on the internet has two addresses: IP address
These take the form 192.154.67.1Four numbers from 1-255 separated by periods
Internet addresstake the form evans.cs.unc.eduThe first word is the name of the machinethe rest of the words are collectively called "the
domain"
the World Wide Web
a way to facilitate information transfer over the Internet
based on the concept of hypertext - that information doesn't follow a linear flow like it's presented in a book
the users of the Web have settled on HTML (HyperText Markup Language) as the way to represent hypertext
Using the web
You need a program called a web browser - these basically understand HTML and how to retrieve information through the Internet
You need the address of the information you want. This is called a Uniform Resource Locator (URL) http://computer.unc.edu/blah/blah.html ftp://ftp.cs.unc.edu/public/application.doc
Writing Web Pages
In order to create a web page, we have to learn how to write HTML.
HTML is NOT a programming language.
HTML just tells the computer how to format text and images--it's like using Word, but having to type in what you want things to look like.
Tags
HTML works based on the concept of tags. A tag is some text surrounded by < and >
Tags are not printed to the screenExample tags:
<HTML>, <TITLE>, <P>, <H1>A lot of the time they work in pairs:
<HTML> and </HTML>
Very simple web page
<HTML><HEAD><TITLE>Simple web page</TITLE></HEAD><BODY>This is the text on a web page.</BODY></HTML>
What do the tags mean?
<HTML>, </HTML> - go at the beginning and end of EVERY page
<HEAD>, </HEAD> - introduction of the document
<TITLE>, </TITLE> - what goes in the title bar of the window
<BODY>,</BODY> - the text (and other stuff) that is displayed in the window
Doesn't matter how you type it...
In HTML, where you put enter is ignored. The web browser decides this for you based on the size of the window
These two will print the same thing:first:<BODY>Why not fly?</BODY>
second:<BODY>Whynot fly?</BODY>
How do you do it then?
Putting <P> at the beginning of a paragraph and </P> at the end will put a blank line between two pieces of text example
You can also use <BR> to insert a carriage return (aka <enter>) example
What else can I do?
make text bold - use <B> and</B>make text italic - use <I> and </I>make text blink - use <BLINK> and
</BLINK> really annoys the heck out of people too!
center text - <CENTER> and </CENTER>
many others on p. 582 in the book
Hierarchical structure
For documents having a hierarchical structure, you can use heading tags <H1> marking chapter in a book <H2> marking section of a chapter <H3> marking subsection of a chapter <H4> and so on down... <H5> <H6>
Lists
There are two kinds of lists: Ordered lists (surrounded by <OL> and
</OL> Unordered lists (surrounded by <UL>
and </UL>Both use <LI> and </LI> to indicate
List Items (things in the list)example
Links!
This is the important part. This is how you go from page to page.
<A HREF=put URL here>link text</A>
Example
Color and images
You can add color or an image to the background: color: make body tag <BODY
BGCOLOR=RED> OR<BODY
BGCOLOR="#FF23FF"> image: make body tag <BODY
BACKGROUND="image.gif">
Inserting images
You can also just add an image into the middle of the page
Use <IMG SRC=put URL here>
It's that easy! Here's the example
Applets
Use the <APPLET> tagIt has some attributes you need to set:
<APPLET code=!!! HEIGHT=!!! WIDTH=!!!> (you need to fill in the !!!)
there's also a CODEBASE to tell where the code is (in case it's not on your machine)
Example: <APPLET CODE=Marquee WIDTH=100
HEIGHT=50></APPLET>
Parameters to applets
Sometimes applets need parametersUse the <PARAM> tag before
</APPLET>Example:
<APPLET CODE=Map WIDTH=100 HEIGHT=5><PARAM NAME="state" VALUE="North Carolina"><PARAM NAME="city" VALUE="Chapel Hill"></APPLET>