World Wide Web Copyright 2008 Pearson Prentice Hall. All rights
reserved. 1 CSCI 104 Class 11
Slide 2
Agenda Copyright 2008 Pearson Prentice Hall. All rights
reserved. 2 Internet Basics Website Design Website Homework
Slide 3
Copyright 2008 Pearson Prentice Hall. All rights reserved. 3
Internet Basics
Slide 4
Internet History Copyright 2008 Pearson Prentice Hall. All
rights reserved. 4 Created by folks at MIT and Defense Advanced
Research Projects Agency (DARPA) First iteration of the Internet
was called ARPAnet (Advanced Research Projects Agency Network)
Slide 5
ARPAnet Advances Copyright 2008 Pearson Prentice Hall. All
rights reserved. 5 Packet Switching Cut up the message into bite
sized chunks and ship them all to the destination separately
Slide 6
Circuit Switching http://www.explainthatstuff.com/internet.html
6 Suppose you want to move home from the United States to Africa
and you decide to take your whole house with younot just the
contents, but the building too! Imagine the nightmare of trying to
haul a house from one side of the world to the other. You'd need to
plan a route very carefully in advance. You'd need roads to be
closed so your house could squeeze down them on the back of a
gigantic truck. You'd also need to book a special ship to cross the
ocean. The whole thing would be slow and difficult and the
slightest problem en-route could slow you down for days. You'd also
be slowing down all the other people trying to travel at the same
time. Circuit switching is a bit like this. It's how a phone call
works.
Slide 7
Packet Switching http://www.explainthatstuff.com/internet.html
7 Well, what if you dismantled your home instead, numbered all the
bricks, put each one in a zip-log bag, and mailed them separately
to Africa? All those bricks could travel by separate routes. Some
might go by ship; some might go by air. Some might travel quickly;
others slowly. But you don't actually care. All that matters to you
is that the bricks arrive at the other end, one way or another.
Then you can simply put them back together again to recreate your
house. Mailing the bricks wouldn't stop other people mailing things
and wouldn't clog up the roads, seas, or airways. Because the
bricks could be travelling "in parallel," over many separate routes
at the same time, they'd probably arrive much quicker. This is how
packet switching works. When you send an email or browse the Web,
the data you send is split up into lots of packets that travel
separately over the Internet.
Slide 8
Protocols via Wikipedia Copyright 2008 Pearson Prentice Hall.
All rights reserved. 8 A protocol is a set of guidelines or rules.
A communications protocol is a formal description of digital
message formats and the rules for exchanging those messages in or
between computing systems Network engineers have written rules for
communication that must be strictly followed for successful
host-to-host communication. These rules apply to different layers
of sophistication such as which physical connections to use, how
hosts listen, how to interrupt, how to terminate communications,
which language to use and many others.
Slide 9
Protocols Copyright 2008 Pearson Prentice Hall. All rights
reserved. 9 TCP/IP TCP: Transmission Control Protocol Controls the
form and route that data takes across a network IP: Internet
Protocol Handles addressing on the Internet Application Protocols
HTTP: Hypertext Transfer Protocol FTP: File Transfer Protocol
Telnet: Terminal Emulation Protocol
Slide 10
Questions? Copyright 2008 Pearson Prentice Hall. All rights
reserved. 10 History of the Internet Packet Switching
Protocols
Slide 11
Internet Protocol (IP) Addresses Copyright 2008 Pearson
Prentice Hall. All rights reserved. 11 Every computer connected to
the Internet has one or more unique IP Addresses associated with
it. IP Address is made up of 4 sets of numbers separated by dots
Google.com == 72.14.209.99 ESPN.com == 199.181.132.250
ErieBlogs.com == 69.7.102.82 http://aruljohn.com/hostname2ip.html
http://aruljohn.com/track.pl
Slide 12
Uniform Resource Locator (URL) Copyright 2008 Pearson Prentice
Hall. All rights reserved. 12 Remembering 4 sets of numbers for
every site you want to visit is too difficult. URLs act as an alias
for IP addresses and when used online they are automatically
converted into the IP address by devices on the Internet. Minimum
of 3 parts (usually 3-5): Subnet. Second Level Domain. Top Level
Domain
Slide 13
Uniform Resource Locator (URL) Copyright 2008 Pearson Prentice
Hall. All rights reserved. 13 Top Level Domains (Examples) com:
commercial organizations org: other organizations net: network
resources gov: governmental organizations edu: educational
organizations mil: military resources jp, nl, uk, ca, etc:
international organizations
Slide 14
Uniform Resource Locator (URL) Copyright 2008 Pearson Prentice
Hall. All rights reserved. 14 Second Level Domains (Examples)
Edinboro.edu Google.com Facebook.com Whitehouse.gov Netspace.org
Subnets (Examples) not always present, used to split up content
cs.edinboro.edu tac.edinboro.edu dev.sourceforge.net
Slide 15
Uniform Resource Locator Copyright 2008 Pearson Prentice Hall.
All rights reserved. 15 http://www.annex.com/southwest/museum.htm
Means of Access (HyperText Transfer Protocol) Internet Address (web
site) Path (directory or folder) Document (file)
Slide 16
Questions? Copyright 2008 Pearson Prentice Hall. All rights
reserved. 16 IP Addresses Uniform Resource Locators (URLs) Top
Level Domains, Second Level Domains, etc.
Slide 17
Copyright 2008 Pearson Prentice Hall. All rights reserved. 17
Website Design Basics
Slide 18
Common parts of a website Copyright 2008 Pearson Prentice Hall.
All rights reserved. 18 Hyperlinks Images Text Flash ActiveX
Required Client Application: Browser
Slide 19
Browsers Copyright 2008 Pearson Prentice Hall. All rights
reserved. 19 Client application which displays websites on a client
device. Popular Windows supported browsers: Microsoft Internet
Explorer Mozilla Firefox Google Chrome Popular Apple supported
browsers: Apple Safari Mozilla Firefox Google Chrome Browsers also
exist on other devices such as SmartPhones
Slide 20
Slide 21
Slide 22
Slide 23
Hyperlinks Copyright 2008 Pearson Prentice Hall. All rights
reserved. 23 Clickable text or images on a page that aid in
navigation to content Visited links often appear as a different
color than unvisited links www.microsoft.com www.googleinc.com
Links can point you to different pages, different parts of a page
(anchor links), or to e-mail (mailto links)
Slide 24
Flash Copyright 2008 Pearson Prentice Hall. All rights
reserved. 24 Proprietary format created by Adobe to add animation,
video, and interactivity to web pages. Frequently used for ads,
video games, and video on the Internet Requires a Adobe Flash
Player on your browser Common flash example
www.youtube.comwww.youtube.com
Slide 25
ActiveX Copyright 2008 Pearson Prentice Hall. All rights
reserved. 25 Proprietary format created by Microsoft to add
animation, video, and interactivity to web pages. Frequently used
for feature rich applications on the Internet to extend
capabilities not found directly within the browser Requires the use
of Microsoft Internet Explorer browser Common ActiveX example:
www.myitlab.comwww.myitlab.com
Slide 26
Copyright 2008 Pearson Prentice Hall. All rights reserved. 26
Website Assignment
Slide 27
Overview Copyright 2008 Pearson Prentice Hall. All rights
reserved. 27 You will be creating a personal website and providing
me a link to your site when completed Due Today at end of class
(10pts): Selection of two or three website builder sites chosen to
evaluate, e-mailed to Prof. Sullivan Due Tuesday 11/23 at end of
class (20pts): Rough draft of website created and e-mailed to Prof.
Sullivan Due Monday, 11/29 (70pts): Final website completed and
address e-mailed to Prof. Sullivan
Slide 28
Website Builder Sites Copyright 2008 Pearson Prentice Hall. All
rights reserved. 28 The new school of website development Build
your own website easily (hopefully) using tools provided on the
Internet Typically Adobe Flash based, rich environments for
creating websites. Typically WYSIWYG for the most part
Website Requirements Copyright 2008 Pearson Prentice Hall. All
rights reserved. 30 You are to create a personal website. You can
make the website about yourself, a club, or other topic if youd
like. You should include the following somewhere on your site:
Contains at least three distinct pages One page must be exist to
explain the two website builders you tried, both tools pros and
cons, and why you selected the one over the other. Suggestions:
Info about your major, Hobbies, Hometown, etc. At least 3
hyperlinks to external websites At least 3 photos or images An
e-mail link or contact me forme-mail link Something embedded such
as: Google Map or Calendar YouTube Video MP3 Music Player
Slide 31
Website Examples Copyright 2008 Pearson Prentice Hall. All
rights reserved. 31
https://sites.google.com/site/eupexample/home
Slide 32
Walk thru using Google PagesGoogle Pages Copyright 2008 Pearson
Prentice Hall. All rights reserved. 32 At least: 3 Pages One must
explain pros and cons of tools attempted 3 External Hyperlinks 3
Photos or Images An e-mail link or contact me form Something
embedded such as: Google Maps or Calendar YouTube Video MP3
Audio
Slide 33
Due Dates Again Copyright 2008 Pearson Prentice Hall. All
rights reserved. 33 Due Today at end of class (10pts): Selection of
two or three website builder sites chosen to evaluate, e-mailed to
Prof. Sullivan Due Tuesday 11/23 at end of class (20pts): Rough
draft of website created and e-mailed to Prof. Sullivan Due Monday,
11/29 (70pts): Final website completed and address e-mailed to
Prof. Sullivan
Slide 34
Todays Lab Copyright 2008 Pearson Prentice Hall. All rights
reserved. 34 Open this presentation from my website and go to slide
29 which contains the list of Website Builder sites Browse through
these tools and choose at least two of them that look like they are
appealing to you. ONLY CHOOSE FREE OPTIONS, PERIOD. E-mail Prof.
Sullivan ([email protected])[email protected] Subject:
Website Lab 1 Include in the message of the e-mail a link to the
websites that have been created by the website builder tools.
