CSIS-390 Some Web History

1. CSIS-390Some Web History Dr. Eric Breimer

2. How it came to be… • Before developing web applications it is important to know these two things evolved • Internet • World Wide Web (WWW)

3. Are these things the same? • Internet • World Wide Web

4. ARPAnet • ARPANETAdvanced Research Projects Agency • 1969, Cold War, Military Applications

5. 1969

6. 1970

7. 1971

8. 1972

9. 1977

10. ARPAnet • Originally, network applications for sharing data and messages 1968-1973 • 1971 Email concept developed • Person can have an identifier name@network • Virtual mailbox • By 1973 Email was 75% of the ARPAnet traffic • File Transfer Protocol (FTP) was developed in 1973

11. ARPAnetInternet • Transition Period 1971-1983 • Packet Switching developed and perfected • Instead of point-to-point persistent connections • Robust, fault-tolerant, efficient, survivable • Network of Networks realized on a large scale • The ability to connect different types of networks TCP/IP

12. Early Internet 1983-1989 • No web browsers, no web pages at all… • Only… • Email • FTP (document and image sharing) • Early message board systems (BB systems) • Custom client-server applications • Banking • Early business to business E-commerce

13. In 1989 came the WWW • The concepts existed, but one man implemented the concepts and made them real… • WWW concepts • Hypertext concept – Documents can have links to other documents, just click the text • URL concept – Documents, computers, virtual mailboxes, networks can all have uniform identifier to help locate them

14. Tim Berners-Lee (TBL) • Programmed the first widely-used • web browser • web server • which formalized the • HTTP protocol, and • HTML as a standard language • Also, prompted the widespreaduse of • URLs

15. Before the WWW, finding stuff was hard • To find data on the Internet you had to • Know numeric IP addresses to locate FTP servers • Login anonymously or with a user account • Know the folder hierarchy and file name of the document/data. • People would share this information via Email. • browsing the Internet was no possbile, you just couldn’t do it. • Only “insiders” had access to stuff.

16. Understanding the WWW • HTTP instead of FTP • Web Browser instead of FTP client • Web Server instead of FTP server • URLs instead of numeric IP addresses • Clicking Hyperlink instead of navigating through folder hierarchies • HTML instead of postscript (meant for print typesetting) and plain text documents.

17. So these are not the same thing… Internet • Physical network • Hardware • TCP/IP • Packet Switching • Network of Networks concept World Wide Web • The content • Software • HTTP • URLs • Hyperlinks

18. WWW Infancy1989-1995 • 1989 TBL invents first web browser and server • 1991-93 Al Gore proposes a bill that funds major Internet initiatives. • Money spent on new fiber optic national network • Mosaic(first good graphical web browser) was a funded project • InterNIC, which eventually becomes ICANN, is another notable product of the Gore Bill. • By 1995, Internet traffic moves off NSFnetand on to commercially operated networks (Verizon, UUNet, Sprint, AT&T, and Genuity) • ARPAnet NSFnet  Internet II

19. WWW Commercialization Period 1995-2000 • 1995 – Netscape become a household name • Sells web server software…gives away browser for free • Reached almost 90% market share by 1996 • 1995 – 1996 Microsoft scrambles to come out with competing software (Internet Explore and Web Server) • 1996-1999 – Browser Wars between Microsoft and Netscape • Two versions of HTML are used in practice • Browser specific plug-ins become the norm: Flash, RealMedia, etc. • 1997-2000 – E-commerce Commercial Explosion • Amazon, E-bay, Online Stock Trading, MP3 trafficking, etc.

20. Browser Wars 1996-1999 • Microsoft (Internet Explorer) and Netscape compete to be the #1 browser. • In ’96 Netscape dominated • By ‘99 Internet Explorer was #1 • Microsoft Integrated IE into the Windows OS • Forced upon people as the default browser • Microsoft paid billions in lawsuit (EU mostly) but still won the war • Netscape makes its source code open, so developers can build upon it. • Leads to the Mozilla Foundation, which eventually develops Firefox. • In 2000, AOL buys out Netscape, which is was failing financially • This marks the end of the war and beginning of Microsoft’s dominance in the WWW.

21. Browser Wars - Significance • Early competition pushed web browsers to the limit. • Browsers use to be simple client applications that could render HTML code. • Browsers became heavy-weight applications • Microsoft’s dominance was terrible. • Use proprietary (secret) languages and often fought against establishing open standard languages.

22. Why Standards? Advantages • Accessibility • Forward Compatibility • Simpler and Faster Development • Faster Download & Display

23. Why Standards? • Accessibility • Forward Compatibility • Simpler and Faster Development • Faster Download & Display • Standardized web pages look good (and sound good) on all browsers and devices • Device to consider: • B&W Kindle • Cheap Smartphone • Computer connect to Jumbotron at Stadium • Screen readers for the visually impaired

24. Why Standards? • Accessibility • Forward Compatibility • Simpler and Faster Development • Faster Download & Display • Future standards are built on top of current standards • A forward compatible design can accept data from a future version of itself and pick out the "known" part of the data. • text-only browser ignoring <img> tag from a future version. • An extensible design is one that can be upgraded to fully handle the new input format. • An example is a text-only word processor that can be upgraded to handle picture data.

25. Why Standards? • Accessibility • Forward Compatibility • Simpler and Faster Development • Faster Download & Display • Faster: You don’t have to build separate websites for separate browsers/devices • Concurrent Development:Content and style can be developed separately by different teams.

26. Example: <center> <b> <font face="Georgia, Times New Roman, Times, serif" color=“#880000" size="+2">Sub-title</font></b></center> Why Standards? • Accessibility • Forward Compatibility • Simpler and Faster Development • Faster Download & Display • Style/Appearance tags are bloated • Rather than load bloated HTML for every page, just load one style sheet for an entire website

27. Rendering Engines • Browsers can have two or more rendering engines • Example: parsing standard and non-standard HTML code. • The <!doctype>and <html> tag tells the browser which engine to use. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

28. Rendering Engines & Validation • Validated HTML code can be rendered faster. • Rendering engine doesn’t have to handle special cases and errors • Non-standard HTMLwill cause a rendering error • Browser will re-render using a more forgiving “error correcting” engine. • Don’t you wish Java had an “error correcting” compliler?

29. Validate Validate Validate • http://validator.w3.org/ • It’s a pain but… • At least you know that your web page will display properly on about 400 different browser variations.

30. Who cares if the rendering engine is a little slow? • True, on modern PCs you won’t notice the difference. • However, consider that the device rendering the web page could bea tiny device with a 133 MHz processor.

31. Standards: The Big Motivation • Consider how many different smart phones exist • Each uses a slightly different variation of Safari, Chrome, or some special browser. • W3C wants web developers to follow the rules so browsers do not have to be overly complex • W3C wants browser developers to follow the rules so web page look as similar as possible on different devices.

32. Some key things to remember: • TBL is the most under-rated inventor in the last 100 years. • Web Browsers weren’t always so consistent but they may be in the future. • Device-specific apps may not survive if the W3C can continue to innovate.

33. Tim Berners-Lee (TBL) • Widely recognized as the inventor of • HTML (perfecting the concept of hypertext) • URLs (paving the way for web browsing) • Implemented first web browser (text based) and web server (unix daemon). • Should be a billionaire but then the WWW wouldn’t be so cool and free. • I love the man! You should love him too.

34. Web Browser History • 1991: TBL makes the first web browser in his physics labs. Dr. B gets his braces off and discovers Clearasil. • 1993: Mosaic (the first real graphical browser) is built. Free, open source, works for Mac’s, Windows, and UNIX. The birth of free porn. • 1994: Netscapeemerges and starts to sell a lot of software. • 1995: Microsoft wakes up, makes a browser, and tries to monopolize the market.

35. Browser History • 1996-1999: BrowserWars…different versions of JavaScript, CSS, and HTML emerge. While standards go down the toilet…at least a lot cool sh*t was developed. • 1998: Microsoftintegratesits browser into Windows 98 and 2000 making it #1. • before dying Netscape makes its code Open Sourceallowing developers to build upon it. • 2000: Microsoft wins! Netscape gets bought by AOL. The .com Bust happens!Dr. B contemplates becoming a pop star but then decides to be a professor.

36. Browser History • 2002: Kelly Clarkson (not Dr. B) wins American Idol! • 2003: Programmers who once worked for Netscape form the Mozilla Foundation • 2005: Firefoxstarts to make a serious dent in Microsoft’s monopoly. • 2006: Developers start to follow the standards instead of Microsoft • CSS is revitalized. • 2012: Chrome is poised to overtake IE, which has been #1 for nearly 15 years.