Slide 1
___________________________________
The World Wide Web
• A part of the Internet.
• Developed by a research institute called
CERN to share pictures and data.
• Early browsers include Mosaic.
• Allowed to grow when the backbones (high
bandwidth connections) were allowed to
become commercial in the early 90’s.
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
Slide 2
___________________________________
Web Browsers
• Clients connect to servers.
• They download data and interpret it.
• The data is in (HTML) source code and
binary form.
• Most are highly configurable.
– Can store preferences.
– Can store favorite sites.
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
Slide 3
___________________________________
Examples of Browsers
• Text browser – Lynx
• Graphical Browsers
–
–
–
–
Internet Explorer
Netscape Navigator
Mozilla
Opera
• Wireless/PDA browsers.
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
Slide 4
___________________________________
Browsing
• You can download and possibly upload
–
–
–
–
–
Webpages
Data files
Computer Programs
Music/Sounds
Pictures/Movies
• (But don’t steal! People work very hard to
make the things you enjoy!)
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
Slide 5
___________________________________
Browsing 2
• Browsers connect to servers using TCP/IP
– Like when I connected to www.umd.edu port
80 using telnet.
• They can be used as
–
–
–
–
Email clients
Newsreaders
Simple webpage makers
File viewers
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
Slide 6
___________________________________
Redundant Slide
•
•
•
•
•
•
•
To get this slide, start a browser.
Go to http://www.cs.umd.edu
Click on Class Web Pages.
Click on CMSC102 link at top of page.
Click on Part6.
View the slide in MS Word or Powerpoint.
Then you don’t need to view this slide.
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
Slide 7
___________________________________
Netiquette
• Don’t post or send inflammatory messages.
• Everything is (or can be) recorded.
• Assume that whatever you type will be
around forever.
• People use the ‘Net to check up on
prospective hires.
• So what you type now may haunt you
forever.
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
Slide 8
___________________________________
Netiquette 2
• Flaming – writing rude, obnoxious
messages – should be avoided.
• Spamming – should be avoided.
– Sending useless annoying messages to boards
or newsgroups.
– sending many pieces unsolicited email.
• Avoid off-topic or inappropriate messages.
___________________________________
___________________________________
___________________________________
___________________________________
– Things ok in alt.sex.bears but not elsewhere.
___________________________________
___________________________________
Slide 9
___________________________________
Lynx – A Text Browser
___________________________________
• Type lynx within a Unix account to use it.
• Move around with arrows.
___________________________________
– Left/Right are backward/forward keys.
– Up/Down move around links in current page.
___________________________________
• Go lets you open a new address
• Can toggle buttons and enter text.
• Can set options/preferences.
___________________________________
___________________________________
___________________________________
Slide 10
___________________________________
Netscape Browser – Menu
•
•
•
•
•
File -- open new pages/windows, edit page.
Edit -- Search, edit preference, find in page
View -- See page source, change fonts.
Go -- forward/backward/home
Communicator -- mail, news, AIM,
addressbook, bookmarks.
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
Slide 11
___________________________________
HTML
• HTML -- Hypertext Markup Language
–
–
–
–
–
Lets you send text.
Contains formatting information.
Can contain pictures, sounds, other things.
Extends presentation beyond text.
Lets you access other information by “linking”
to other documents.
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
Slide 12
___________________________________
Hypertext
• HTML is not the only markup language.
– TeX/LaTeX for mathematical typesetting.
– Example:
•
•
•
•
Name: John Arras
Credits: 68
GPA: 2.56
Housing: Off-Campus
___________________________________
___________________________________
___________________________________
___________________________________
– Select name to get John Arras, etc…
___________________________________
___________________________________
Slide 13
___________________________________
URL’s
• Uniform Resource locators.
• Ex: http://www.umd.edu/classes/index.html
• Resource type: http.
___________________________________
___________________________________
– Others: telnet, ftp, mailto, gopher, nntp
___________________________________
• Host: www.umd.edu
• Directory and file: classes/index.html.
___________________________________
___________________________________
___________________________________
Slide 14
___________________________________
Start using Netscape
• Some search engines
–
–
–
–
–
–
www.lycos.com
www.yahoo.com
www.google.com
www.overture.com
www.askjeeves.com
Your ISP’s homepage.
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
Slide 15
___________________________________
Customization
• Boomarks -- good sites to remember.
– List them
– Edit them
• Preferences -- change settings
– Fonts
– Mail/newsgroup settings
– Cache/cookies
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
Slide 16
___________________________________
Interesting sites
•
•
•
•
•
•
•
www.umd.edu
www.theonion.com
www.washingtonpost.com
www.nasa.gov
www.fark.com
www.slate.com
www.salon.com
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
Slide 17
___________________________________
Some File Types
•
•
•
•
•
•
•
•
.txt
-- Plain text file
.html -- html file
.mp3 -- mpeg3 sound (music file)
.wav -- WAVE sound file
.zip
-- PKZIP compressed file
.mpg -- MPEG compressed movie
.gif
-- Graphics Image Format
.jpg
-- JPEG compressed picture
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
Slide 18
___________________________________
Other features
• Plugins or viewers to listen/view different
file types.
• CGI (Common Gateway Interface) Lets
Web servers run programs.
• Servers may run Java or other scripts or
special HTML codes.
• Dynamically generated webpages.
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
Slide 19
___________________________________
Usability Issues
• http://www.otal.umd.edu/UUGuide/
• Blind -- Text vs. graphics.
– Lawsuits vs. major companies over this.
• Cognitively disabled --Alzheimer’s.
• Novice vs. Expert -- Learning Curve.
• Low Income -- Access to technology.
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
Slide 20
___________________________________
Usability Enhancements
•
•
•
•
Adaptive software, adjusts to the user.
Multiple Bandwidth options.
Online help.
Media conversion -- video to audio.
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________
___________________________________