HCI 201 - Multimedia and the World Wide Web

• Home
• Notes
• Homework
• Syllabus
• Resources

Lecture Summaries class 1

Prepared by: Anthony Larrain

These notes serve as an outline to the lecture, they are not intended to be complete.

---

Introduction

• Are you in the right room ?

This course assumes no experience with web site development. I will assume very little experience using computers beyond word processing and surfing the net. We will spend a large portion of the term learning to build web pages using HTML,CSS and Frontpage. Later, we will incorporate images, audio and simple animations. User-centered design principles and techniques will be covered. Web standards will also be discussed.

We will discuss collecting information from users, dynamic web pages and interacting with databases but will not implement these types of web pages.

If you have experience with web design you may want to drop. Please see me after class

• What you need.

• Depaul Student account

  This account will provide you with e-mail and server space to host your web pages. Please activate this account right away.

• Access to the Depaul computer labs

We will be spending allot of time in lab. Plus, the lab is a good place to do your work.

• Access to course online, COL.

This is where you will upload your assignments, view announcements, post questions, get course material etc... Please login and update your e-mail address.

• Textbook: Since the text is not available at this time, I will make it optional. The publisher has made available select chapters. Read these chapters and if you like the text you can purchase it later. There are plenty of online resources that I will make available later.

  Select Chapters

  USERNAME is peachpit

  PASSWORD is essentialbooks

• Course survey

---

Internet Basics

• A network is two or more computers interconnected so that they can communicate and share information.
• The Internet a worldwide collection of computer networks - a network of networks - sharing digital information via a common set of networking and software protocols.
• There are many parts to the Internet

• Newsgroups
• File Transfer Protocol
• Telnet
• Em ail
• The World Wide Web

• A Web server is a special computer on the Internet programmed to send certain types of files to computers that request those files.
• A client program, called a browser is used to request,read and display these files.

• Common Browsers:

• Internet Explorer
• Netscape Navigator
• Opera
• Safari

• The World Wide Web is the part of the Internet consisting of web servers and the files they deliver.
• Some types of files a web server can deliver are: web pages, image files, movie files, audio files.
• To request a web page, you need to know:

• The name of the server.
• The name of the file.
• Where to find the file on the server.

For example to request a web file named filetypes.html on the web server members.aol.com located in a folder(directory) called donnaskani you would type the following into the address or search box of your browser.

http://members.aol.com/donnaskani/filetypes.html

This is referred to as a URL.

• A URL or Uniform Resource Locator is like the address of the web page. It consists of three main parts:

  • Protocol. The http:// part, which stands for Hypertext Transfer Protocol.
  • The name of the server computer members.aol.com
  • Pathname /donnaskani/filetypes.html. The pathname tells the server which file and where to find that file on the server.

• The World Wide Web, WWW, is based on the client/server model. When you request a page, your browser becomes a client of the web server. The web server sends a copy of the file to your computer.
• What is in this file ?

The server does not store an image of what the web page looks like but instead, the file contains a description in the form of special codes on how the page should appear. When the browser receives this file it interprets the codes and creates the the web page image that we see.

To see the contents of this description file or codes, right click on a web page, and select View Source

• Web pages will often contain links, called hyperlinks that allow you to jump from page to page around the Internet.
• These special codes are usually written in the Hyper Text Markup Language, HTML.

---

Intro to HTML

• An HTML file is basically a text file with extra information, the markup, placed with the text to describe how the text should be interpreted by the browser.
• The HTML language is a collection of tags used to specify:

  • the logical structure of a web page. Such as headings, paragraphs, lists, newlines, tables etc..
  • the visual appearance of a page. Such as Bold, italics , size Color etc..
  • The linking of the page to other web pages, images, audio etc..

• To create an html file use any text editor, Notepad, Textpad etc..
• Some Examples of html code. See ex1 ex2 and ex3. Examples can be found where you get the notes. These files end with .html. If you click on these files your browser will interpret the code and display the web page.

• To view the source code:
• Click on the file and right click on the web page then select view source.
• If that doesn't work, right click on the hyper link, save the file to your computer, open the file in notepad.

---

Next Class, Monday Sept 12, 2005

• We meet in the lab. SAC 232
• Please have your student account activated
• Read chapters 1 and 2 provided online.