1 / 29

Recall

IP Address: 204.168.0.207. RR. My computer. Global DNS. http requests. Recall. A Host’s IP Address is associated with a domain name Mapping: DomainName  IPAddr This mapping is stored in multi-tiered set of Domain Name Servers. Domain Name Table … www.breimer.org  RR ….

aglaia
Download Presentation

Recall

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. IP Address:204.168.0.207 RR My computer GlobalDNS http requests Recall • A Host’s IP Address is associated with a domain name • Mapping: DomainName  IPAddr • This mapping is stored in multi-tiered set of Domain Name Servers Domain Name Table … www.breimer.org  RR … Domain Name Table … www.breimer.org  204.168.0.207 …

  2. Multi-tiered

  3. Internet Connections: Cost vs. Bandwidth

  4. Siena CS is consideringProfessional GradeCable Internet Connections: Cost vs. Bandwidth Home UsersMust be competitively priced 1990’s only option besides dialupLong term contractsstill holding Economy of scale

  5. Agenda • HTML • Dream Weaver’s HTML Styles vs • Cascading Style Sheets

  6. HTML • Hypertext Markup Language • Marks up a document with tags • Each tag specifies the format/appearance of the webpage

  7. HTML • Special tags are used to insert • Links to other documents • Images • Tables • Other Media • Flash • MP3 • Java Applets • Etc.

  8. Tags • An element is a fundamental component of the structure of a text document. • Examples: • Heads • Tables • Paragraphs • lists. • To denote the various components in an HTML document, you use tags.

  9. Tags • HTML tags consist of • a left angle bracket (<), a tag name, and a right angle bracket (>). • Tags are usually paired • <b> start tag • </b> end tag • The end tag looks just like the start tag except a slash (/) precedes the text within the brackets.

  10. Tags • Some tags may include an attribute, • which is additional information that is included inside the start tag. • Example<p align=center> • NOTE: HTML is not case sensitive. <title> is equivalent to <TITLE> or <TitLe>. • Not all tags are supported by all browsers. • If a browser does not support a tag, it will simply ignore it. • Any text placed between a pair of unknown tags will still be displayed, however.

  11. Browsers • Netscape – Once the best, now #2, polluted with AOL • Internet Explorer – Microsoft’s enormous monster • Mozilla – the original, still good, no gimmicks • Opera – very compact, skins • Amaya - W3C's testbed browser, seamlessly integrated with the editing and remote access • Lynx – text browser, why?

  12. Browsers • Neoplanet - offers diverse interface skins and customizable, sharable, content channels. • Apple Safari - KHTML-based web browser from Apple Computer optimized for Mac OS X. • Konqueror - Unix-based Web browser, file manager, and universal viewer from KDE. • iCab - web browser for Macintosh.

  13. <html> <head> <TITLE> A Simple HTML Example </TITLE> </head> <body> <H1> HTML is Easy To Learn </H1> <P> Welcome to the world of HTML. This is the first paragraph. While short it is still a paragraph! </P> <P> And this is the second paragraph. </P> </body> </html>

  14. A Teaching Tool • To see the HTML code of any website • select View Source

  15. Another Teaching Tool • Compose what you want • And see the resulting HTML

  16. <html> <body> <head> <a href> <img src> <p align> <span class> <table> <tr> <td> 10 Tags you should memorize

  17. <html> </html> • This tells the browser that • Everything inside this tag is HTML code • Some browsers won’t display a page unless you include this tag

  18. <body> </body> • Everything inside this tag makes up the body of the actual document • Web pages have elements that don’t appear in the body of a document • Examples • Meta info (key words, description, etc.) • JavaScript code • Title (appears in the title bar of the browser) • Etc…

  19. <head> </head> • Special place for storing info that does not appear in the body a document • More examples • Author’s comments • Code for linking style sheets • Information for different browsers • Etc.

  20. <a href> </a> • Example: • <a href=“resume.html”>Link to my resume</a> • a stands for anchor • href stands for hypertext reference • Everything inside this tag becomes a hyperlink • You can put text inside or other elements • like images.

  21. <img src> • Example: • <img src=“picture.jpg”> • img stands for image • src stands for source • This tag does not use an end tag </img> • Inserts an image into the document • Assuming src points to a valid image

  22. Standard Image Formats(supported by web browsers) • In the early days 2 types of images emerged • gif (Graphics Interchange Format) • CompuServe • outdated, only 256 colors, compact size • jpg (Joint Photographic Experts Group) • 16 million colors • compressed encoding • higher quality and sometime more compact than GIF • These image formats are still the standard

  23. Other Image Formats(not support by Web Browsers) • BMP: The Bitmap file format is used for bitmap graphics on the Windows platform only • JIF: JPEG Related Image format • PCT: Macintosh PICT format • PPM: Portable Pixel Map (UNIX) • TIFF: Aldus Corporation format • EPS: The Encapsulated PostScript • PNG: The Portable Network Graphics format will likely be the successor to the GIF file format

  24. <p align> </p> • Used to create paragraph • creates an indentation (depends upon the browser) • Option to align the paragraph

  25. <span class> </span> • Used to apply a cascading style to an element

  26. <table> • Creates a table • Has lots of attributes • <tr> defines a row • <td> defines a column in a row

  27. Web Styles vs. CSS • CSS (Cascading Style Sheets) • Web Styles are not as good as CSS • Why? • CSS allow you to separate content from style • An example shows it all • Why is this so important?

  28. Homework • Take a look at the HTML Guide • Memorize the purpose and format of the 10 tags I showed today • They’ll be on the first exam (Oct. 9th)

More Related