COMP 14: HTML & the WebAnnouncementsHomeworkTodayThe InternetTalking over the InternetInternet addressingthe World Wide WebUsing the webWriting Web PagesTagsVery simple web pageWhat do the tags mean?Doesn't matter how you type it...How do you do it then?What else can I do?Hierarchical structureListsLinks!Color and imagesInserting imagesAppletsParameters to appletsCOMP 14: HTML & the WebJune 20, 2000Nick VallidisAnnouncementsP5 due todayP6 due FridayHomeworkread 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.TodayThe webWriting HTMLThe Interneta 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 companyMultiple LANs are connected to form a wide-area network (WAN)the Internet is a WAN that spans the globeTalking over the InternetA 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/IPTCP = Transmission Control ProtocolIP = Internet ProtocolInternet addressingEvery computer on the internet has two addresses:IP addressThese take the form 192.154.67.1Four numbers from 1-255 separated by periodsInternet 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 Weba way to facilitate information transfer over the Internetbased on the concept of hypertext - that information doesn't follow a linear flow like it's presented in a bookthe users of the Web have settled on HTML (HyperText Markup Language) as the way to represent hypertextUsing the webYou need a program called a web browser - these basically understand HTML and how to retrieve information through the InternetYou need the address of the information you want. This is called a Uniform Resource Locator (URL)http://computer.unc.edu/blah/blah.htmlftp://ftp.cs.unc.edu/public/application.docWriting Web PagesIn 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.TagsHTML 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 windowDoesn'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 windowThese 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 textexampleYou can also use <BR> to insert a carriage return (aka <enter>)exampleWhat else can I do?make text b old - 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 bookHierarchical structureFor 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>ListsThere 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)exampleLinks!This is the important part. This is how you go from page to page.<A HREF=put URL here>link text</A>ExampleColor and imagesYou 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 imagesYou can also just add an image into the middle of the pageUse <IMG SRC=put URL here>It's that easy! Here's the exampleAppletsUse 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 appletsSometimes 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
View Full Document