1 / 147

The Internet

The Internet. Overview. An introduction to HTML Dynamic HTML Encryption Public Key Infrastructure Development of the Internet Web Browsers. Top 10 uses of Internet at Work (2000). 1 . E-mail : 73 % 2 . Business related research : 35 3 . Academic Research : 23

lara
Télécharger la présentation

The Internet

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. The Internet

  2. Overview • An introduction to HTML • Dynamic HTML • Encryption • Public Key Infrastructure • Development of the Internet • Web Browsers

  3. Top 10 uses of Internet at Work (2000) • 1. E-mail: 73% • 2. Business related research: 35 • 3. Academic Research: 23 • 4. General browsing/surfing: 17 • 5. IT information: 11 • 6. Downloading Software: 11 • 7. News information: 10 • 8. Searching for personal information: 9 • 9. Reading Magazines/Newspapers: 7 • 10. Sports information: 7

  4. Overall Structure of Internet

  5. How does the World Wide Web works? • User must have a program called "browser" running on the computer: Internet Explorer (IE) or Netscape • User establishes a connection with an ISP (Internet Service Provider) via dial-up or LAN (local area network). • User types in an URL (Uniform Resource Locator) as the target webpage address in browser's address field. For example, http://www.csd.uwo.ca/~cs031

  6. (4-6 are behind the scene) Through ISPs, the English URL is translated into a numerical IP (Internet Protocol) address. Eg:130.100.11.3  • User's browser uses the IP address to establish a connection via local, regional, and/or national ISPs, with the target computer (a web server). • The web page that the user wants, HTML page, is sent back to user's browser.  • User's browser interprets HTML commands, and displays the page with nice format to the user. HTML pages can have • Formatting information (text formatting, framing, etc.) • Hyperlinks (user clicks on and browser repeats steps 3-6) • Multimedia (pictures, audio, video, animations)

  7. A Simple Example (simple.html) <h1>A very simple web page</h1> My name is <b>Charles Ling</b> <br><br> Here is a picture of mine <br> <IMG SRC=../c_ling2.jpg width=150> <br><br> My favourite thing to do is <ul> <li>Adventurous travelling around the world <li>Watching good movies <li>Reading news at <a href="http://www.cnn.com">CNN</a> </ul> For more info about me, click my <a href="http://www.csd.uwo.ca/faculty/ling">home page at UWO.</a>

  8. Building Webpages • Writing html files directly (using notepad or other text editors) • Using MS Word and save as html • Using specialized software: MS Frontpage, Dreamwaver, etc. • Adding animations, forms, java, javascript, database functionality, …

  9. Writing Simple html pages • Start notepad and writing html code directly • Save it as an html file (eg, my.html) • Start browser (eg, Internet Explore) • Click file > open, click browse to locate and open the html file (eg, my.html). • You will see how the html file is displayed!

  10. HTML • HTML – HyperText Markup Language • A language used to define the content of, and the presentation instructions for, a Web document

  11. When a browser presents a Web document, the browser scans the document and applies the presentation instructions to the content • Content that does not have presentation instructions will be presented using default instructions built into the browser

  12. HTML documents must employ a simple format so anyone can create documents • HTML documents are stored in text (ASCII) files • This type of document can be created using any editor that allows you to save the document as a text file

  13. To combine the content and the presentation instructions in the same file, there must be a way to distinguish between these two components • In HTML, the presentation instructions are inserted as “tags” • Anything that isn’t a presentation instruction is content

  14. HTML tags normally occur in pairs • The pair of tags surround the content to which they apply • A start tag is indicated with angle brackets • <TAG> • An end tag is indicated with a slash after the opening angle bracket • </TAG>

  15. HTML has a set of predefined tags • These tags can be used to • Control how the text in the document is displayed • Insert images into the document • Insert links to other documents

  16. Document Tags • HTML documents are enclosed within <HTML> and </HTML> tags • Every HTML document will have a head and a body • The document head is enclosed within the <HEAD> and </HEAD> tags • The body is enclosed within the <BODY> and </BODY> tags

  17. The basic structure of an HTML document is • The <TITLE> within the <HEAD> is displayed in the title bar of the browser

  18. The <HEAD> of the document contains information used by the browser • All of the content for the document and the associated presentation instructions are placed inside the <BODY> tags

  19. Formatting Tags • HTML contains tag definitions that allow you to control • Headings • Style • Ordered Lists • Unordered Lists • Definition Lists • etc.

  20. Heading Tags • There are six heading levels • The levels are named H1, H2, H3, … H6 where H1 is the largest and H6 is the smallest • To create a heading, you enclose the text of the heading inside the opening and closing tags for the heading level

  21. Heading Examples

  22. Physical Style Tags • Used to control the display of text • <B> - bold • <I> - italics • <U> - underline • <TT> - typewriter type face

  23. Physical Style Tag Example

  24. Logical Style Tags • Examples of logical style tags • <EM> - for emphasis • <STRONG> - stronger emphasis • <CITE> - citation • <CODE> - computer code

  25. Logical Style Tag Example

  26. Layout Style Tags • Used to control text layout • <CENTER> - center the text • <P> - new paragraph • <BR> - break, start a new line • <HR> - horizontal rule, draw a line

  27. Layout Style Tag Example

  28. Lists • Lists of data can be defined using • Ordered List – enumerated lists • Unordered List – bulleted lists • Definition List – lists that are made of terms and their associated definitions

  29. Ordered List • Use the <OL> and </OL> tags to start and end an ordered list • Within the ordered list, the list item (<LI>) tag is used to indicate the items on the list • The VALUE tag can be used to set the value of a list item • The START parameter is used to control the value of the first item

  30. The TYPE parameter controls what enumeration scheme is used • The types are: • 1 – numbers (default) • a – lower case letters • A – upper case letters • i – small Roman numerals • I – large Roman numerals

  31. Ordered List

  32. Ordered List

  33. Ordered List

  34. Unordered List • Use the <UL> and </UL> tags to start and end an unordered list • Within the unordered list, the list item (<LI>) tag is used to identify the items on the list

  35. The TYPE parameter can be used to control the look of the list • The types are: • Disc – a solid disc • Circle – a hollow circle • Square – a square symbol

  36. Unordered List

  37. Unordered List

  38. Definition List • The <DL> and </DL> tags define the Definition List • The <DT> tag is used to indicate a definition term • The <DD> tag is used to indicate a definition

  39. Definition List

  40. URL • An URL is a Uniform Resource Locator • An URL contains information about • The address of a document on the Internet • The protocol that will be used to access the document

  41. Protocols • HTTP – HyperText Transfer Protocol • Designed to transmit files on the World Wide Web • FTP – File Transfer Protocol • Designed to transmit files over the Internet (before the Web developed) • ftp://ftp.csd.uwo.ca • Email: mailto:ling@csd.uwo.ca • These protocols are sets of rules that dictate how files are transmitted between computers

  42. URL Example • In the following URL example, the protocol to be used is HTTP (before the “://”) • The document is “browse.html” and it is located in the “selected” folder at the World Wide Web site for UWO in Canada

  43. Images • Images are added to documents using the <IMG> tag • A </IMG> tag is not required • The SRC parameter is used to indicate the SouRCe of the image

  44. Image Formats • Standard image formats are needed so images can be • stored • retrieved • transmitted over the Web

  45. Examples of image formats used on the Web are: • GIF – Graphics Interchange Format • JPG ( JPEG ) – Joint Photographic Experts Group • PNG – Portable Network Graphics • BMP – Windows Bitmap

  46. Graphics Interchange Format • Uses the Lempel-Ziv Welch (LZW) compression algorithm • The algorithm searches the image for big blocks of the same color and then compresses these blocks • This compression reduces the size of the image

  47. The algorithm also uses an indexed color scheme, in which a custom color palette for the image is selected using only 256 of the over 16 million available colors • This format is used when the image does not contain a wide range of colors or color shades

  48. Joint Photographic Experts Group • Images can contain millions of colors • Uses Lossy compression algorithm • When the image is compressed it permanently loses some of its quality • The algorithm looks for similar colors (like a range of reds) and chooses the same red for very close shades

More Related