HCI 201

1. HCI 201 Multimedia and The World Wide Web

2. About Me • Contact info: • CTI Building 738 • aburns@cs.depaul.edu, http://facweb.cs.depaul.edu/aburns • (312)362-8237 • Education • Ph.D. in Management Information Systems, Kent State University • MBA, Kent State University • BS Mechanical Engineering, GMI Engineering & Management Institute • Teaching • IS, IT, HCI, ECT courses • Research • Knowledge Management • Virtual workplace design

3. About You • Please fill out the profile sheet I will pass out in class. • It’s available as a COL Course Document also.

4. About this course • Required Textbook The Non-Designer’s Web Book, 3rd Edition, Williams & Tollett, Peachpit Press, 2006. ISBN 0-321-30337-7.

5. Course format • Two places for information • “facweb”: http://facweb.cs.depaul.edu/aburns • COL: https://dlweb.cti.depaul.edu/login/login.asp • Use your CampusConnect username and password • Submit homework • Check grades • Make sure you have your correct email on file • Lectures • Some Powerpoint, discussion • Lab • I am working on lab reservations. More on this later. • Student presentations • More on this later.

6. Course Assignments • General information on facweb • Detailed assignment information will always be posted on COL • Submit assignments to COL

7. The Internet

8. History of Internet • Started 1960s - Packet Switching • Research project by U.S. Department of Defense • ARPAnet (Advanced Research Projects Agency) • Really took off in 1993

9. History of the World Wide Web • CERN (Tim Berners-Lee) developed authoring language and distribution system for creating and sharing multimedia-enabled, integrated electronic documents over the Internet • World Wide Web and HTML was born • Allows relationships between documents and elements • NCSA developed Mosaic to view these documents

10. Overview • The Internet • The WWW • How does it all work? • Hardware • Software • Networking • Protocols

11. Internet and World Wide WebWhat’s the difference between the two terms?

12. The Internet and the WWW • The Internet (late 60s): “It’s a worldwide collection of computer networks – a network of networks – sharing digital information via a common set of networking and software protocols.” HTML & XHTML – The Definitive Guide • The World Wide Web (early 90s): the monster application that runs on the Internet infrastructure (over 2 billion pages). • With the invention of GUI -> color, voice and video were added to the Internet.

13. URL http://www.isoc.org/internet/history/ History of the Internet • Started 1960s - Packet Switching • Research project by U.S. Department of Defense • ARPAnet (Advanced Research Projects Agency) • Really took off in 1993, why?

14. URL http://www.isoc.org/internet/history/ History of the World Wide Web • CERN (Tim Berners-Lee) developed authoring language and distribution system for creating and sharing multimedia-enabled, integrated electronic documents over the Internet • World Wide Web and HTML was born. • Allows relationships between documents and elements. • NCSA developed Mosaic to view these docs.

15. Overview • The Internet • The WWW • How does it all work? • Hardware • Software • Networking • Protocols

16. Hardware • The difference between hardware and software is you can touch hardware. • The hardware you need to be connected to the Internet is • A computer • A networking device, e.g. a modem or network card • A connection, e.g. • At home, an Internet Service Provider • At school, a LAN connection

17. Telephone (Dial-Up) Modem: Low Speed but Inexpensive & Widely Available • Modem - device that sends and receives data over telephone lines to and from computers • Most modems today have a maximum speed of 56 Kbps.

18. Internet Service Provider (ISP) • ISP - a company that connects you through your communications line to its servers, or central computer, which connect you to the Internet via another company’s network access points

19. Software • Software is a term used to describe programs that allow the hardware to do things for you. • You need a few pieces of software to connect to the Internet • An operating system, e.g. Windows XP • A browser, e.g. Internet Explorer, Firefox, Opera • If you want to develop web sites or pages, you need a few more • Authoring tool, e.g. Notepad, Dreamweaver or Frontpage • FTP program, to transfer files from your client machine (in front of you) to the server (your students account), e.g. SSH

20. Protocols • Because networks use a wide variety of hardware and software, protocols are needed to coordinate communication and data transmission. • A protocol is a set of rules for the exchange of data across communication lines. • Protocols make the whole thing work!

21. URL http://www.w3c.org http://www.ietf.org Standards Organizations • World Wide Web Consortium (W3C) • Internet Engineering Task Force (IETF)

22. What protocols do • Identify the different devices in the communication path. • Establish the speed and method for transmission of data. • Alert the receiving device to the incoming data. • Determine the method of error checking and correction.

23. HyperText Transfer Protocol • HTTP is the protocol responsible for transferring and displaying web pages. • HTTP uses the client/server model of computing. • The clientis the user’s web browser: a software program that retrieves the page and displays it. (I.E, Netscape). • A Web browser can either be text-based, or graphical. • A Web page is stored on a Web server, which makes the page available to users of the Web. • Theserveris the web server where the page resides. (Ex: www.nyt.com)

24. TCP/IP protocol • TCP – Transmission Control Processing • IP – Internet Protocol TCP: Rules to control on how messages are broken down into packets, and then reassembled at the final destination. IP: Rules to label packets for delivery and to control the packet’s path from sender to recipient. TCP/IP software processes data transmission through the Internet.

25. Internet protocols • Simple Mail Transfer Protocol (SMTP): transferring email messages from one machine to another • File Transfer Protocol (FTP): transferring files between local and remote machines. • Telnet: a terminal emulation protocol used to remote login. • Others? TCP/IP HTTP POP

26. IP addresses: dotted quads • Each node in the IP world is identified by a unique 32-bit number called an IP address. • IP addresses appear as a series of four 8-bit numbers separated by dots (dotted quads).Each number ranges from 0 to 255. 14.192.1.100 students.cs.depaul.edu • IP addresses are usually assigned human-readable names (domain names).

27. 126.1.1.1 15.35.200.2 126.12.1.1 15.35.200.1 15.35.200.3 126.12.1.6 132.12.1.5 126.12.1.5 132.12.1.7 132.12.1.6 126.12.1.7 132.12.1.2 245.12.50.6 126.12.1.2 126.12.1.3 132.12.1.4 245.12.50.9 126.12.1.4 152.123.200.1 245.12.50.8 132.12.1.3 152.124.20.8 245.12.50.7 152.124.20.7 132.12.1.1 172.11.11.16 245.12.50.5 152.124.20.6 172.11.11.14 152.124.20.2 152.124.20.5 145.12.50.1 172.11.11.15 146.182.5.5 152.124.20.3 146.182.0.1 172.11.11.10 152.124.20.4 146.182.0.7 146.182.0.2 172.11.11.12 172.11.11.8 146.182.0.6 172.11.11.11 172.11.11.1 172.11.11.13 146.182.0.3 172.11.11.9 172.11.11.7 146.182.0.4 172.11.11.2 146.182.0.5 172.11.11.6 172.11.11.3 172.11.11.4 172.11.11.5 IP Address

28. Domain Name Server (DNS) IP addresses are hard to remember. www.yahoo.com(Domain Name) 64.58.76.223(IP Address)

29. news.com amazon.com cnn.com chicago.com yahoo.com depaul.edu microsoft.com Domain

30. news.com Amazon. COM cnn.com chicago.com yahoo.com depaul.edu microsoft.com Domain Name www.chicago.com www.cti.depaul.edu www.yahoo.com www.microsoft.com www.depaul.edu

31. Organization name Host name bach.cs.depaul.edu Organization name Org. type (top level domain) Domain Name Server • A Domain Name Server is responsible for the mapping between domain names and IP addresses. .com .org .gov .mil .net .fr .museum .biz IP address: 140.192.33.6

32. A Typical HTTP Exchange Netscape’s URL Window Client: Please open a connection to ‘www.nytimes.com’ and send me the default file. I am located at IP Address 140.192.1.6. NY Times Web Server Server: Let me check…. Okay, the default file at this site is of type HTML. It is 1749 bytes in size. The date is Tue, May 2nd at 15:33:33. NY Times Web Page

33. Web Pages and Web Browsers • A Web page is stored on a Web server, which makes the page available to users of the Web. • To view a Web page, the user runs a Web browser, a software program that retrieves the page and displays it. • A Web browser can either be text-based, or graphical.

34. URL: Uniform Resource Locator • People on the Web use a naming convention • called the uniform resource locator (URL). • A URL consists of at least two and as many as four parts. • A simple two part URL contains the protocol used to access the resource followed by the location of the resource. • Example: http://www.cs.depaul.edu/ • A more complex URL may have a file name and a path where the file can be found.

35. A Web URL deconstructed The user is a directory in the system http://facweb.cs.depaul.edu/aburns/research/res_interests.html The protocolused path that indicates the location of the document in the host’s file system domain document name

36. Anatomy of an e-mail address aburns @ cs . depaul . edu Handle Top leveldomain Host/Server Domain • Others: • students • hawk • condor • Others: • com, net, org, • mil, gov • fr, uk, dz • info, biz, name, • pro, museum, coop