1 / 27

COMS 161 Introduction to Computing

COMS 161 Introduction to Computing. Title: HTTP and HTML Date: October 15, 2004 Lecture Number: 22. Announcements. Material Chapter 5 (Creating Documents) pp 92 Have a great break Keep it safe Make sure you come back to us!. Review. World Wide Web Client/Server URL Web Browser

ailish
Download Presentation

COMS 161 Introduction to Computing

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. COMS 161Introduction to Computing Title: HTTP and HTML Date: October 15, 2004 Lecture Number: 22

  2. Announcements • Material • Chapter 5 (Creating Documents) pp 92 • Have a great break • Keep it safe • Make sure you come back to us!

  3. Review • World Wide Web • Client/Server • URL • Web Browser • HTML and HTTP

  4. Outline • HTML and HTTP

  5. Web Browsers and Servers • Web browsers are clients • Request, receive, and display Web documents • Web sites are servers • Store Web information • Process browser requests • Send information back to the browser • The protocol used is called “HTTP” • Hypertext Transfer Protocol • Method by which browsers and servers communicate

  6. Web Publishing • HTTP defines how browsers and servers communicate • “HTML” is the language they use • Hypertext Markup Language • HTML signifies both content (elements) and structure (presentation) • Content and structure are specified separately

  7. Web Publishing • HTML -- Hypertext Markup Language • Hypertext • Links to a variety of information, local or remote • Markup • Originally from print publishing: handwritten marks on text to indicate presentation instructions to the typesetter • Text size, bold or italic, headlines vs. body text, column layout, etc. • Language • Standardized set of instructions for a computer

  8. Web Publishing • HTML is designed to be: • Platform independent • Any computer, any browser • Resolution independent • Any screen or printer size • Multimedia • Text, images, video, sound, interactive tools, etc. • Hyperlinked • Immediate links to other content, local or remote

  9. HTML • Plain text with markup tags • Plain text: standard (ASCII) characters • Markup tags: embedded commands (still in plain text) identifying content and structure

  10. Tags This is some sample HTML. HTML Tags • Not case-sensitive • Textbook uses UPPER case; lower is now more common • Many tags are “paired tags” • Example: <p>This is some <b>sample</b> HTML.</p> Appears as:

  11. Basic Document Structure <html> (Signifies an HTML document) <head> (Descriptions of the document go here) </head> <body> (Page content goes here) </body> </html>

  12. Setting a Page Title • Titles help give the user a frame of reference • Titles appear in taskbar and browser’s title bar • Example:<title>Hampden-Sydney College, Virginia</title> • Appears as: http://www.hsc.edu/

  13. The rain in Spain stays mainly on the plain. Text in HTML • Simple text is in enclosed in paragraph tags • Automatically wraps to fit • Example: <p> The rain in Spain stays mainly on the plain. </p> • Appears as:

  14. Audrey Hepburn played Eliza Doolittle in the movie version of "My Fair Lady" even though that role was played by Julie Andrews on stage. Text in HTML • Break tags help to format lines • Example:<p> Audrey Hepburn played Eliza Doolittle in the movie version of<br>"My Fair Lady“<br>even though that role was played by Julie Andrews on stage. </p> • Appears as:

  15. Roses are red, violets are blue… Text in HTML • Font face, color, style, etc. may be specified • Example:<p>Roses are<font color="red">red</font>,<br><font face="Arial,Helvetica">violets are blue…</font></p> • Appears as:

  16. Some other kinds of text formatting: Italics This is<i>italic</i>text. This is italic text. Bold This text is<b>bold</b>. This text is bold. Underline And this is<u>underlined</u>. And this is underlined. Superscript Here is a<sup>super</sup>script. Here is a superscript. Subscript And, here’s a<sub>sub</sub>script. And, here’s a subscript. Text in HTML

  17. Text in HTML • Font sizes • Absolute font size: a number between 1 and 7 • Example: A <font size=7>B </font>C Appears as: ABC • Relative font size: use a number like –n or +n(where n is some digit) • Example: X <font size=+2>Y </font>Z Appears as: XYZ • “basefont” size is 3

  18. My Autobiography Part 1: My Early Years Chapter 1: I Am Born It was a dark and stormy night … Headings in HTML • Headings of different weights are used to introduce sections • Example:<h1>My Autobiography</h1><h2>Part 1: My Early Years</h2><h3>Chapter 1: I Am Born</h3><p>It was a dark and stormy night…</p> • Appears as:

  19. My Autobiography Part 1: My Early Years Chapter 1: I Am Born It was a dark and stormy night … Comments • Comments may be added to an HTML file • Information for someone reading the HTML file • Comments do not appear in the browser • Example:<h1>My Autobiography</H1><!-- I hand coded this HTML! I hope there aren’t any errors! --><h2>Part 1: My Early Years</h2><h3>Chapter 1: I Am Born</h3><p>It was a dark and stormy night…</p> • Appears as:

  20. Lists in HTML • Three kinds of lists: • Ordered lists (automatically numbered) • Unordered lists (bullet points) • Definition lists (terms and definitions)

  21. Automatically numbered Example:Outline:<br><ol><li>Introduction</li><li>Body</li><li>Conclusions</li><li>Appendices</li></ol> Appears as: • Outline: • Introduction • Body • Conclusions • Appendices Ordered Lists • Is “list item” (<li>) a paired or an unpaired tag?

  22. Bullet points Example:HTML has three types of lists:<br><ul><li>Ordered</li><li>Unordered</li><li>Definition</li></ul> Appears as: • HTML has three types of lists: • Ordered • Unordered • Definition Unordered Lists • Exactly the same syntax as ordered lists, except “<ul>” instead of “<ol>”

  23. Terms and definitions Example:Glossary:<br><dl><dt>HTTP</dt><dd>A protocol: the mechanism that computers use to exchange web documents.</dd><dt>HTML</dt><dd>A language: the terms and symbols used in web documents to define the content and layout of a web page.</dd></dl> Appears as: Glossary: HTTP A protocol: the mechanism that computers use to exchange web documents. HTML A language: the terms and symbols used in web documents to define the content and layout of a web page. Definition Lists

  24. Audrey Hepburn played "Eliza Doolittle" in My Fair Lady. Inline Graphics • Images may be placed on the page along with text and other elements • Only standard image formats: .gif, .jpg, a few others • Example:<img src="audrey.jpg"> <br>Audrey Hepburn played "Eliza Doolittle" in <i>My Fair Lady.</i> • Appears as:

  25. Web site for the textbook Exploring the Digital Domain. Hyperlinks • The key to the Web • Cross references to other elements: pages, images, multimedia, etc. • Clicking on a hyperlink causes an automatic request for the linked element • Example:<a href="http://cs.furman.edu/digitaldomain/">Web site</a> for the textbook <i>Exploring the Digital Domain.</i> • Appears as:

  26. Web Publishing Tools • Text editors (e.g. Notepad) • Create and edit plain text files with HTML tags • Tag editors (e.g. Dreamweaver’s “code view”) • Tools that make it easier to place tags in text files • HTML generators (e.g. Dreamweaver’s “design view”) • Tools that automatically create HTML codes much like a word processor • Site Managers (e.g. Dreamweaver’s “Site” menu) • Help organize and keep track of all files that make up a site • HTML files, images, databases, programs, etc. • Assist with keeping files on the server in synch with local files

  27. Censorship • Why would someone want to censor the Web? • Is censorship right? Who decides? • How, technically, would one actually control Web content? • Blocking software • PICS ratings • Communications Decency Act (1996–1999) • Other ideas? • How does this relate to Spam filters?

More Related