1. CE80N Introduction to Networks & The Internet Dr. Chane L. Fullmer UCSC Winter 2002

2. February 19, 20022 General Information TA Office… –Trailer #15 is no more –TA offices moved to the ISB Rm 110.. same times as posted previously

3. February 19, 20023 Web Search based Essay Essay based on Web search results –1-2 pages on any topic of interest –Must include results from at least four Web page references –References must be listed in a bibliography Due Tuesday, February 26, 2002

4. February 19, 20024 Class Information Web page tutorial available on-line Web page submission: –Email to venkat@cse.ucsc.eduvenkat@cse.ucsc.edu Subject: cmpe080n-assgn4 Final Exam –Last class session March 14, 2002

5. February 19, 20025 Personal Web Page No new pages received... So, here’s mine :) –http://www.cse.ucsc.edu/~chane –My Home Page...My Home Page...

6. Chapter 23

7. February 19, 20027 Display Hardware Varies A variety of computers around the world are used to display web pages.

8. February 19, 20028 A Browser Translates And Displays A Web Document A Web page is created to be used with any display hardware. The computer language provides general display guidelines without giving details.

9. February 19, 20029 A Consequence of the Web Approach The same web page may appear differently. –Using different browsers –Using different computer hardware

10. February 19, 200210 HTML Each web page is written in HyperText Markup Language (HTML). –Has its own grammar rules –Uses punctuation symbols in unusual ways –Does not show spaces on displayed page uses free format input.

11. February 19, 200211 Instructions In A Web Page Control The Output Tags are instructions that tell a browser how to display the page. –Uses brackets to indicate a tag –Uses tags in pairs (usually)

12. February 19, 200212 A Web Page is Divided Into Two Main Sections The two main sections of a web page are: –Heading –Body –Example Web PageExample Web Page

13. February 19, 200213 Indentation Can Make HTML Readable Indentation makes it easier for people to read. –Place tags on separate lines –Indent items This is important when updating. –Not done by the original creator as a rule –Machine generated HTML can be ugly... i.e. HTML from M$ Word Machine Generated HTML

14. February 19, 200214 HTML Text HTML uses tags to organize text into paragraphs. –Tells the browser to end one paragraph and begin the next –Tells the browser to end the line and start a new line –Example PageExample Page

15. February 19, 200215 A Web Page Can Link To Another Page Items that correspond to a link are anchored. –Use tags: –Use HREF to specify a link to a page: Link –Example PageExample Page

16. February 19, 200216 HTML Allows Numbered And Unnumbered Lists HTML can be used to create a numbered (Ordered) list. –Uses tags: For an unnumbered (Unordered) list. –Use tags: Example Page

17. February 19, 200217 Images must be converted into numbers stored in a file. –Quantized and digitized.... Two methods of digitizing a picture are: –To use a digital camera –To use a scanner Images On A Web Page Are Digital

18. Figure 23.8 Figure 23.8 Illustrations of (a) a digital scanner, and (b) a digital camera. Either produces a file stored on the computer’s disk.

19. February 19, 200219 Digital Image Formats There are two popular forms of representing digital images. –Including: Graphics Image Format (GIF) Joint Picture Encoding Group (JPEG)

20. February 19, 200220 HTML Allows A Web Page To Include An Image Once an image has been stored on a hard disk, a web page can reference the file. –Uses the tag:

21. February 19, 200221 Text Can Appear Adjacent To An Image An image on a web page can appear by itself or adjacent to text. HTML treats an image like an oversized “word” Example Page

22. February 19, 200222 Images Can Be Aligned within Text HTML provides a way to control the details of how an image is aligned with surrounding text. –Using the ALIGN tag ALIGN=TOP ALIGN=CENTER ALIGN=LEFT ALIGN=RIGHT Example Page

23. February 19, 200223 More about Images Image size may be controlled.. –Size Height and Width (in pixels) Borders can be added Example Page -- No Control Example Page -- Size Control Example Page -- Borders

24. February 19, 200224 Images Can Link To Another Web Page HTML uses the same pair of tags for text links as for image links. –Use: Example Page

25. February 19, 200225 Some Browsers Can Stretch Or Shrink Images The IMG tag may include image height and width. Caveat: –Not all browsers can resize images. It is best to store images in the desired size.

26. February 19, 200226 The Background Can Be Controlled HTML allows one to specify the background of a Web page. –Choose the color –Specify the image Example Page

27. February 19, 200227 Other Features Of HTML When a browser displays a table, it –Aligns information into Rows Columns Multiple links may be associated with a single image.

28. February 19, 200228 Importance of HTML Before HTML, displayed combinations of text and graphics required complex computer programs. –Often was hardware specific CGA,EGA,VGA,SVGA, X,Mac...... Resolution of screens non-uniform

29. February 19, 200229 GUI Tools Help With Web Page Creation Web authoring tools make it possible to compose a web page without learning HTML. Files are saved as HTML. –Or *.htm for M$ systems

30. February 19, 200230 HTML reference HTML The Definitive Guide Musciano & Kennedy, O’Reilly & Associates, Inc.

31. February 19, 200231 Summary HTML is the language of the Web. HTML is hidden to the average user. Browsers and servers handle the details and display the results HTML is significant in that: Sufficiently general to be widely used Useable by people without computer programming knowledge

32. February 19, 200232 Glossary Homepage –A page of information accessible through the World Wide Web that is the main page for an individual or a company. Hot List –The original term used for a list of bookmarks. Now essentially obsolete.

33. February 19, 200233 Glossary Hypermedia –An information storage system in which each page of information can contain embedded references to images, sounds, and other pages of information. GUI –(Graphical User Interface) An interface that presents the user with pictures and icons rather than words.

34. February 19, 200234 Glossary Hypertext –A system for storing pages of textual information that each contain embedded references to other pages of information. Mosaic –The first browser program for the World Wide Web.

35. February 19, 200235 Glossary Multimedia –A term describing any facility that can display text, graphics, images, and sounds. Uniform Resource Locator –(URL) A short character string used by browsers to identify a particular page of information on the World Wide Web.

36. February 19, 200236 Glossary World Wide Web –(WWW) An Internet service that organizes information using hypermedia.