1. ITEC 745 Instructional Web Authoring I Week 1

2. Required Entry Skills Grading –Homework + Midterm Exam + Final Project –No final exam Overview of Course Goals –Fluency with XHTML and CSS –Use of Adobe Dreamweaver (industry standard tool) –Using instructional design principles to craft effective web sites to support the needs of learners, instructors, and instructional designers Academic Honesty ITEC 715 Overview

3. No required textbook –The important Web standards and documentation are all freely available online Recommended book –Sams Teach Yourself Web Publishing with HTML and CSS in One Hour a Day by Laura Lemay and Rafe Colburn; Sams Publishing, 2006, ISBN: 0-672-32886-0 ITEC 715 Overview (cont.)

4. Each person, introduce yourself –Your name –How far along are you in your studies? –Any prior ID experience? –Any prior web authoring experience? –Any particular areas of interest? Take digital photos (we’ll need them for next week) ITEC 715 Introductions

5. Instructor: Ray Cole Some companies where I’ve helped to create e-learning: ITEC 715 Who Am I?

6. Instructional Uses of the Web (examples)

7. Instructional Uses of the Web Examples: http://www.sfsu.edu/ –School presence: info, identity… http://webcast.berkeley.edu/ –Course presence (ILT): syllabus, lectures, handouts, supplementary materials… http://home.znet.com/ikorn/teaching.html –Instructor presence: Biography, CV (resume), courses taught, contact info, special projects… http://www.ddiworld.com/WBT-course-demo/demo.html –Web-based training (WBT), also known as e-learning, or sometimes online learning

8. Terminology: The Basics What is a network? What is an internet? What is the Internet? What is the WWW? What is an intranet? Tim Berners-Lee: Invented the World Wide Web in 1989

9. What Is the World Wide Web? What is a network? network internet

10. What Is the World Wide Web? What is a network? Two or more computers connected by a wire (or, these days, by a radio wave or beam of light). network internet

11. What Is the World Wide Web? What is a network? Two or more computers connected by a wire (or, these days, by a radio wave or beam of light). What is an internet? network internet

12. What Is the World Wide Web? What is a network? Two or more computers connected by a wire (or, these days, by a radio wave or beam of light). What is an internet? Two or more networks connected by a wire (or, these days, by a radio wave or beam of light). network internet

13. What Is the World Wide Web? What is a network? Two or more computers connected by a wire (or, these days, by a radio wave or beam of light). What is an internet? Two or more networks connected by a wire (or, these days, by a radio wave or beam of light). What is the Internet? network internet

14. What Is the World Wide Web? What is a network? Two or more computers connected by a wire (or, these days, by a radio wave or beam of light). What is an internet? Two or more networks connected by a wire (or, these days, by a radio wave or beam of light). What is the Internet? The worldwide, publicly accessible internet commonly used to carry email, web, and other data traffic. network internet

15. What Is the World Wide Web? What is a network? Two or more computers connected by a wire (or, these days, by a radio wave or beam of light). What is an internet? Two or more networks connected by a wire (or, these days, by a radio wave or beam of light). What is the Internet? The worldwide, publicly accessible internet commonly used to carry email, web, and other data traffic. What is the WWW? network internet

16. What Is the World Wide Web? What is a network? Two or more computers connected by a wire (or, these days, by a radio wave or beam of light). What is an internet? Two or more networks connected by a wire (or, these days, by a radio wave or beam of light). What is the Internet? The worldwide, publicly accessible internet commonly used to carry email, web, and other data traffic. What is the WWW? A set of software services that run on the Internet (or any network that runs the appropriate networking software protocols). network internet

17. What Is the World Wide Web? What is a network? Two or more computers connected by a wire (or, these days, by a radio wave or beam of light). What is an internet? Two or more networks connected by a wire (or, these days, by a radio wave or beam of light). What is the Internet? The worldwide, publicly accessible internet commonly used to carry email, web, and other data traffic. What is the WWW? A set of software services that run on the Internet (or any network that runs the appropriate networking software protocols). What is an intranet? network internet

18. What Is the World Wide Web? What is a network? Two or more computers connected by a wire (or, these days, by a radio wave or beam of light). What is an internet? Two or more networks connected by a wire (or, these days, by a radio wave or beam of light). What is the Internet? The worldwide, publicly accessible internet commonly used to carry email, web, and other data traffic. What is the WWW? A set of software services that run on the Internet (or any network that runs the appropriate networking software protocols). What is an intranet? Just like the Internet, but private to an institution of limited set of users. network internet

19. What Is the World Wide Web? What is a network? Two or more computers connected by a wire (or, these days, by a radio wave or beam of light). What is an internet? Two or more networks connected by a wire (or, these days, by a radio wave or beam of light). What is the Internet? The worldwide, publicly accessible internet commonly used to carry email, web, and other data traffic. What is the WWW? A set of software services that run on the Internet (or any network that runs the appropriate networking software protocols). What is an intranet? Just like the Internet, but private to an institution of limited set of users. network internet

20. A Quick History of the Internet and the World Wide Web

21. Internet History: The Beginning 19581969 1973 1. Bell Labs develops the Unix operating system. 2. ARPAnet's first four computers are put in place at university sites. 1. The network becomes international with the addition of sites in Norway and England. President Eisenhower announces the creation of the Advanced Research Projects Agency (ARPA) under the umbrella of the United States Department of Defense.

22. Internet History: Early Years 1983 1984 1. TCP/IP becomes ARPAnet’s standard protocol. 2. UC Berkeley comes out with its own version of Unix which includes support for TCP/IP. 1986 1. The National Science Foundation (NSF) takes over administration of ARPAnet. 2. Host count climbs to over 1000. The NSF creates NSFnet and links five supercomputing centers with a 56 kbps backbone.

23. Internet History: Birth of the Web 1989 1. CERN makes the World Wide Web available. 2. NSFnet upgrades the internet backbone by installing T3 lines (44.736 Mbps). 3. Host count passes one million. 1992 1. Marc Andreesen, an undergrad at the University of Illinois, releases the first version of the Mosaic Web Browser. 2. Host count reaches two million. 1993 1. Berners-Lee founds the World Wide Web Consortium (W3C) to draft technical standards for web technologies. 2. Host count reaches 3.5 million. 1994 1. Tim Berners-Lee invents the world wide web while working as an independent contractor at the European Center for Nuclear Research (CERN).

24. Web Components

25. Web Browsers –Firefox, Internet Explorer, Safari, Opera, Netscape, etc. Web Servers –Apache, Microsoft IIS, etc. Web Sites –Where all the content is located WWW: Pieces and Parts Mosaic: The first popular graphical web browser, first released in 1993

26. What a web browser does (not a complete list): Accepts a Uniform Resource Locator (URL) from the end-user Based on the URL, sends requests for each web page and web page component (e.g., any embedded graphics or multimedia components) to the appropriate web server Receives a copy of the requested document from the web server, along with some additional information, such as the document’s associated MIME type Decides, based on the Multipurpose Internet Mail Extension (MIME) type and “helper app” associations, whether to display the document directly, or to launch it into a helper application Renders the document if it decided to display it directly. It does this by interpreting the Hypertext Markup Language (HTML) or Extensible Hypertext Markup Language (XHTML) code in the document, and translating that into a particular way of displaying the document Keeps local copies of recently-viewed web pages in order to display them more quickly if accessed again in the near future (local files stored in the browser’s “cache”) The Web Browser

27. View Source  See the code that makes the web page you are currently viewing Forced Reload  Force the browser to reload the page from the web server, even if there is a recent copy of the page still in the browser’s cache –Mozilla/Firefox: Shift reload –Internet Explorer: Control refresh –Safari: Option refresh Browser Tricks

28. Clear Cache  Empty the browser’s cache by deleting all files stored in it; this guarantees that the next page you load will not be from the local cache Open in New Window  Leave the current web page open, but follow a link and load it into a new browser window (allows you to see two or more pages at once). Can be done programmatically, too More Browser Tricks

29. Browse the web and view the source for some of your favorite pages. You can prepare for next week by going to the class web site (http://www.oldkingcole.com/itec745/) and downloading and reviewing the Week 2 slides.http://www.oldkingcole.com/itec745/ For Next Week