1. COMP 14: HTML & the Web June 20, 2000 Nick Vallidis

2. Announcements zP5 due today zP6 due Friday

3. Homework zread 1.6 (p. 40-41), 2.9-2.10 (p. 92-100), 3.10 (p. 157-164), 4.7 (p. 211-212) zIt'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.

4. Today zThe web zWriting HTML

5. The Internet za group of computers in the same location are connected by a network called a local- area network (LAN) yUNC is a good example of a LAN. yA LAN is usually owned by one company zMultiple LANs are connected to form a wide-area network (WAN) ythe Internet is a WAN that spans the globe

6. Talking over the Internet zA protocol is like a language to a computer. It's the language it speaks over a network. zThe internet uses a pair of protocols called TCP/IP yTCP = Transmission Control Protocol yIP = Internet Protocol

7. Internet addressing zEvery computer on the internet has two addresses: yIP address xThese take the form 192.154.67.1 xFour numbers from 1-255 separated by periods yInternet address xtake the form evans.cs.unc.edu xThe first word is the name of the machine xthe rest of the words are collectively called "the domain"

8. the World Wide Web za way to facilitate information transfer over the Internet zbased on the concept of hypertext - that information doesn't follow a linear flow like it's presented in a book zthe users of the Web have settled on HTML (HyperText Markup Language) as the way to represent hypertext

9. Using the web zYou need a program called a web browser - these basically understand HTML and how to retrieve information through the Internet zYou need the address of the information you want. This is called a Uniform Resource Locator (URL) yhttp://computer.unc.edu/blah/blah.html yftp://ftp.cs.unc.edu/public/application.doc

10. Writing Web Pages zIn order to create a web page, we have to learn how to write HTML. zHTML is NOT a programming language. zHTML 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.

11. Tags zHTML works based on the concept of tags. A tag is some text surrounded by zTags are not printed to the screen zExample tags: y,,, zA lot of the time they work in pairs: y and

12. Very simple web pagesimple Simple web page This is the text on a web page.

13. What do the tags mean? z, - go at the beginning and end of EVERY page z, - introduction of the document z, - what goes in the title bar of the window z, - the text (and other stuff) that is displayed in the window

14. Doesn't matter how you type it... zIn HTML, where you put enter is ignored. The web browser decides this for you based on the size of the window zThese two will print the same thing: firstfirst: Why not fly? secondsecond: Why not fly?

15. How do you do it then? zPutting at the beginning of a paragraph and at the end will put a blank line between two pieces of text yexampleexample zYou can also use to insert a carriage return (aka ) yexampleexample

16. What else can I do? zmake text bold - use and zmake text italic - use and zmake text blink - use and yreally annoys the heck out of people too! zcenter text - and zmany others on p. 582 in the bookmany others

17. Hierarchical structure zFor documents having a hierarchical structure, you can use heading tagsheading y marking chapter in a book y marking section of a chapter y marking subsection of a chapter y and so on down... y

18. Lists zThere are two kinds of lists: yOrdered lists (surrounded by and yUnordered lists (surrounded by and zBoth use and to indicate List Items (things in the list) zexampleexample

19. Links! zThis is the important part. This is how you go from page to page. z link text zExampleExample

20. Color and images zYou can add color or an image to the background: ycolor: make body tag OR color yimage: make body tag image

21. Inserting images zYou can also just add an image into the middle of the page zUse zIt's that easy! Here's the exampleexample

22. Applets zUse the tag zIt has some attributes you need to set: y (you need to fill in the !!!) ythere's also a CODEBASE to tell where the code is (in case it's not on your machine) zExample:Example y

23. Parameters to applets zSometimes applets need parameters zUse the tag before zExample:Example