1. CIS 228 The Internet 1/15/11 HTML 4.01

2. URL's Uniform Resource Locator protocol://domain:port/path#fragment Protocol – a scheme for exchanging information http (hypertext transfer protocol), ftp, etc. Domain – identifies a server Port – optional number for the protocol to use Path – specifies a file on the server Fragment – specifies a location within the file

3. Domain Names Top level: com, org, net, edu, mil, … Second level: google.com, cuny.edu, … You can acquire these Provided by Domain Name Registrars ($10/year) Go Daddy, eNom, Tucows, Melbourne IT, Key-Systems Deeper level: www.abc.com, lehman.cuny.eduwww.abc.com Administered by the second level name owner Typically, the first name identifies a machine media.lehman.cuny.edu

4. The Image Element An inline element that identifies an image to display Tag: (an empty element, no closing tag) src attribute, where to find the image Relative path to a local file, or Uniform Resource Locator alt attribute, text to display when src can't be found width attribute, coveys size information to the browser height attribute, also resizes the image Use width (and height) to inform the browser Not to resize an image

5. Common Image Formats jpg Variable, lossy data compression Good for photos (lots of colors) gif (depricated ??) Good for logos (small number or colors) Transparency png Newer format with transparency (replacing gif ?) psd Proprietary, Adobe Photoshop format

6. Image Processing Software Adobe Photoshop – the gold standard GIMP – open source Photoshop replacement Image Converter – change image file format Pixlr – web based image processor Splashup – web based image processor

7. History of the Browser WorldWideWeb 1991 (Tim Berners-Lee, Cern) Mosaic 1993 (Marc Andreessen, NCSA) Netscape Navigator 1994 (Marc Andreessen) Opera 1994, 1996 (Norway) Internet Explorer 1995 (Microsoft) Safari 2003 (Apple) Firefox 2004 (Mozilla Foundation, open source) Chrome 2008 (Goggle)

8. Browser Wars 1996 – 2001 Internet Explorer crushes Netscape Netscape business model Navigator free for non-commercial use Sales to businesses fund research & development Differentiate to hold market share Internet Explorer business model IE free to everybody Bundled with Window Windows monopoly profits fund R&D Differentiate to gain market share

9. Browser Wars (continued) In October 1997, Internet Explorer 4.0 was released. The release party in San Francisco featured a ten-foot-tall letter "e" logo. Netscape employees showing up to work the following morning found the giant logo on their front lawn, with a sign attached that read "From the IE team... We Love You". The Netscape employees promptly knocked it over and set a giant figure of their Mozilla dinosaur mascot atop it, holding a sign reading "Netscape 72, Microsoft 18" representing the market distribution.[8] - Wikipedia

10. Browser Wars (continued) Rapid (and buggy) development / release cycles Proprietary HTML tags:, Blurring the line between “document” and “program” Security problems Some web developers took sides “best viewed in Netscape / Internet Explorer” logos Linked to the download page for the indicated browser Neither browser was interested in standards But the need became obvious to web developers

11. Browser Wars (continued) When Microsoft won It stopped innovating Internet Explorer was the (de facto) standard When Netscape lost It created the non-profit Mozilla Foundation It made the code for Navigator open-source W3C continued to recommend standards Separate structure (HTML 4.01) and presentation (CSS) Upstarts (Firefox, Safari, Opera, Crome, etc) Competed on their support for the W3C standards Eventually, Internet Explorer followed

12. “Quirks” Mode Today, all browsers support standards Compliant pages are displayed similarly There are multiple standards HTML 4, HTML 4.01, XHTML 1.0, XHTML 1.1, … Browsers need to know which standard a page adheres to Browsers still need to support old web pages Each browser does this differently (and slowly) To avoid “quirks” mode DOCTYPE announces the standard your page uses Make sure your page obeys that standard.

13. DOCTYPE On the top line of your html file Only a handfull to choose from Spelling (including capitalization) must be identical HTML 4.01 (transitional) <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> HTML 4.01 (strict) <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> XHTML 1.0 (strict) <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

14. Compliance Issues Images need an alt attribute Specify a character encoding Don't leave off end (or start) tag html element required Containing head and body elements (and nothing else) title element required in head element Only block elements nest directly in body or blockquote Block elements cannot be in p or inline elements a elements cannot contain other a elements