Internet and Web

1. Module No #3
Internet and the Web
Presented By
DHIVIYA ROSE J
School of Computer Science Engineering

2. Networking Fundamentals

3. DSIT 1001 Business Computing
Network history
• In the 1980s users with stand-alone computers started to share files using
modems to connect to other computers. This was referred to as point-
to-point, or dial-up communication
• Bulletin boards became the central point of communication in a dial-up
connection. Drawbacks to this type of system were:
▫ That there was very little direct communication
▫ Availability was limited to only with those who knew about the location
of the bulletin board
▫ Required one modem per connection. If five people connected
simultaneously it would require five modems connected to five separate
phone lines
• From the 1960s-1990s, the DoD developed large, reliable, WANs for
military and scientific reasons.
• In 1990, the DoDs WAN eventually became the Internet

4. DSIT 1001 Business Computing
Data networks
• One early solution was the creation of local-area network (LAN)
standards.
• Because LAN standards provided an open set of guidelines for creating
network hardware and software

5. DSIT 1001 Business Computing
Data networks
• What was needed was a way for information to
move efficiently and quickly, not only within a
company, but also from one business to another.
• The solution was the creation of metropolitan-
area networks (MANs) and wide-area
networks (WANs).

8. DSIT 1001 Business Computing
• Network topology defines the structure of the network.
• Physical topology, which is the actual layout of the wire or media.
• Logical topology, which defines how the media is accessed by the hosts
for sending data.
• The logical topology of a network is how the hosts communicate across
the medium.
• The two most common types of logical topologies are broadcast and
token passing.

11. DSIT 1001 Business Computing
1.Physical Topology
• Bus
▫ Uses a single backbone cable
▫ All hosts connect directly to backbone
• Ring
▫ Connects each host to the next, and the last to
the first
▫ Physical ring of cable

12. DSIT 1001 Business Computing
Bus Topology
“A bus topology uses a single backbone segment (length
of cable) that all the hosts connect to directly.”

13. DSIT 1001 Business Computing
Ring Topology
“A ring topology connects one host to the next and the
last host to the first. This creates a physical ring of
cable.”

14. DSIT 1001 Business Computing
Physical Topology
• Star
▫ Connects all cables to a central
point of concentration
▫ Usually a hub or switch at center
• Extended Star
▫ Links stars by linking hubs or switches

15. DSIT 1001 Business Computing
Star Topology
“A star topology connects all cables to a central point of
concentration. This point is usually a hub or switch.”

16. DSIT 1001 Business Computing
Extended Star Topology
“An extended star topology uses the star topology to be created. It links
individual stars together by linking the hubs/switches. This, as you will
learn later in the chapter, will extend the length and size of the
network.”

17. DSIT 1001 Business Computing
Physical Topology
• Hierarchical
▫ Similar to extended star
▫ Links star LANs to a computer that controls network traffic
• Mesh
▫ Each host is connected to all other hosts
▫ No breaks, ever!

18. DSIT 1001 Business Computing
Importance of bandwidth
• Bandwidth is the amount of information that can flow through a
network connection in a given period of time.
• Bandwidth is finite
▫ the bandwidth of a modem is limited to about 56 kbps by
both the physical properties of twisted-pair phone wires and
by modem technology
• Bandwidth is not free
▫ For WAN connections bandwidth is purchased from a service
provider
• A key factor in analyzing network performance and designing new
networks
• The demand for bandwidth is ever increasing

19. Bandwidth
• Bandwidth Analogy 2
Rick Graziani graziani@cabrillo.edu

20. DSIT 1001 Business Computing
How Network Works
Video Clip

21. THANK YOU

22. Internet Basics

23. DSIT 1001 Business Computing
What is WWW?
• WWW = World Wide Web = Web
The world wide web (web) is a network of
information resources.
23

24. DSIT 1001 Business Computing
Common Terms / Internet Terminology
• An Internet Browser is a software program that enables you
to view Web pages on your computer. Browsers connect
computers to the Internet, and allow people to “surf the Web.”
• Internet Explorer is one of the browsers most commonly
used. There are other browsers available as well, including
Netscape.

25. DSIT 1001 Business Computing
• A site or area on the World Wide Web that is accessed by its
own Internet address is called a Web site.
• A Web Page is like a page in a book. Websites often have
several pages that you can access by clicking on links. A Web
site can be a collection of related Web pages.
• Each Web site contains a home page (this is the original
starting page) and may also contain additional pages.

26. DSIT 1001 Business Computing
WWW Components
The web relies on three mechanisms to make these
resources readily available to the widest possible
audience:
1. A uniform naming scheme for locating resources
on the web (e.g., URIs).
2. Protocols, for access to named resources over the
web (e.g., HTTP).
3. Hypertext, for easy navigation among resources
(e.g., HTML).
26

27. DSIT 1001 Business Computing
UNIFORM RESOURCE LOCATOR(URL)

28. DSIT 1001 Business Computing
Domain Name Addressing
• Internet hosts or servers have a Domain Name
System (DNS) address, which uses words.
• A domain name identifies the type of institution
that owns the computer.

29. DSIT 1001 Business Computing
• Endings of web pages tells us a bit about the page. Some
common endings to web addresses are:
• com (commercial)
• edu (educational institution)
• gov (government)
• net (network)
• org (organization)
• You might also see addresses that add a country code as
the last part of the address such as:
• ca (Canada)
• uk (United Kingdom)
• fr (France)
• us (United States of America)
• au (Australia)

30. DSIT 1001 Business Computing
IP Addressing Scheme
• An IP address is a unique global address for a
network interface
• An IP address:
- is a 32 bit long identifier
- encodes a network number
- host number

31. DSIT 1001 Business Computing
• IP addresses are written in a so-called dotted
decimal notation
• Each byte is identified by a decimal number in
the range [0..255]:
• Example:

32. DSIT 1001 Business Computing
• How do we know how long the network
prefix is?
▫ The network prefix used to be implicitly defined
(class-based addressing, A,B,C,D…)
▫ The network prefix now is flexible and is indicated
by a prefix/netmask (classless).

33. Working of Internet

34. DSIT 1001 Business Computing
Flow Diagrams

36. Working of Internet (Video Clip)

37. Layout of a Web Page
1. Title bar – tells you the name of the web page
2. Menu bar – has commands for moving around the webpage,
printing, etc
3. Tool bar – short cuts to commands. Each picture
represents a command
4. Address bar – webpage address. If you want to go directly
to a web page, you will need to know the address.

38. DSIT 1001 Business Computing
Main Components of WWW: HTML
• Hyper Text Markup Language (HTML)
▫ Notation for describing formatted text with
images and hyperlinks
▫ Interpreted and displayed by the Web browsers
• A Web (HTML) page consists of:
▫ HTML file
▫ CSS stylesheet file (optional)
▫ A bunch of images (optional)
▫ Other resources (optional)
38

39. DSIT 1001 Business Computing
Main Components of WWW: HTML
• HTML is straight-forward and easy to learn
▫ HTML documents are plain text files
 Easy to add formatting, hyperlinks, bullets, etc.
 Images can be added as separate files
▫ Can be automatically generated by authoring
programs
 Tools to help users creating HTML pages
 E.g. FrontPage, Dreamweaver, Visual Studio
39

40. <HTML>
<HEAD>
<TITLE>The title of the webpage</TITLE>
</HEAD>
<BODY>
<P>Body of the webpage
</BODY>
</HTML>

42. Headings, <Hx> </Hx>
<HTML>
<HEAD>
<TITLE> Example Page</TITLE>
</HEAD>
<BODY>
<H1> Heading 1 </H1>
<H2> Heading 2 </H2>
<H3> Heading 3 </H3>
<H4> Heading 4 </H4>
<H5> Heading 5 </H5>
<H6> Heading 6 </H6>
</BODY>
</HTML>
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
42

43. Break,HORZONTAL LINE <BR> & <HR>
<HTML>
<HEAD>
<TITLE> Example Page</TITLE>
</HEAD>
<BODY>
<H1> Heading 1 </H1>
<P>Paragraph 1, <BR>
Line 2 <BR> Line 3 <BR>….
</P>
<HR>
</BODY>
</HTML>
Heading 1
Paragraph 1,….
Line 2
Line 3
….
_______________
43

44. Paragraphs, <P> </P>
<HTML><HEAD>
<TITLE> Example Page</TITLE>
</HEAD>
<BODY></H1> Heading 1 </H1>
<P> Paragraph 1, ….</P>
<H2> Heading 2 </H2>
<P> Paragraph 2, ….</P>
<H3> Heading 3 </H3>
<P> Paragraph 3, ….</P>
<H4> Heading 4 </H4>
<P> Paragraph 4, ….</P>
<H5> Heading 5 </H5>
<P> Paragraph 5, ….</P>
<H6> Heading 6</H6>
<P> Paragraph 6, ….</P>
</BODY></HTML>
Heading 1
Paragraph 1,….
Heading 2
Paragraph 2,….
Heading 3
Paragraph 3,….
Heading 4
Paragraph 4,….
Heading 5
Paragraph 5,….
Heading 6
Paragraph 6,….
44

45. DSIT 1001 Business Computing
16 Basic Colors
45

46. DSIT 1001 Business Computing
HTML – Example
46
<html>
<head><title>HTML Example</title></head>
<body>
<h1>Heading 1</h1>
<h2>Sub heading 2</h2>
<h3>Sub heading 3</h3>
<p>This is my first paragraph</p>
<p>This is my second paragraph</p>
</body>
</html>

47. DSIT 1001 Business Computing
Bold, Italic and other Character Formatting
Elements
▪ <FONT SIZE=“+2”> Two sizes bigger</FONT>
▪ The size attribute can be set as an absolute value from 1 to 7 or
as a relative value using the “+” or “-” sign. Normal text size is
3 (from -2 to +4).
▪ <B> Bold </B>
▪ <I> Italic </I>
▪ <U> Underline </U>
▪ Color = “#RRGGBB” The COLOR attribute of the FONT
element. E.g., <FONT COLOR=“#RRGGBB”>this text
has color</FONT>
▪ <PRE> Preformatted </PRE> Text enclosed by PRE tags
is displayed in a mono-spaced font. Spaces and line breaks are
supported without additional elements or special characters.
47

48. DSIT 1001 Business Computing
Images
▪ Width (WIDTH): is the width of the image in
pixels.
▪ Height (HEIGHT): is the height of the image in
pixels.
▪ Border (BORDER): is for a border around the
image, specified in pixels.
▪ HSPACE: is for Horizontal Space on both sides of
the image specified in pixels. A setting of 5 will put 5
pixels of invisible space on both sides of the image.
▪ VSPACE: is for Vertical Space on top and bottom of
the image specified in pixels. A setting of 5 will put 5
pixels of invisible space above and bellow the image.
48

49. Thank You