INTERNET & EMAIL

Unit 5

1
 Internet 1
 Simply it is a network.
 It is the world largest public
wide area network which
connect other wide area
networks, other MANs, LANs
and even isolated computer
devices.

2
 1
 No one owns it.
 To access the Internet, an existing network need
to pay a small registration fee and agree to certain
standards based on the TCP/IP (Transmission
Control Protocol/Internet Protocol) .

3
 www(World Wide Web) 2
 www is one of the major service running on the
internet.
 Internet provides infrastructure to many services
such as www, email, instant massagers, remote
assess, etc..
 www is just a service. And therefore it is not
similar to the internet.

4
 www is navigatable? 3
 Websites are interlinked and therefore we can
search and follow links.

5
 5
 IS THE FIRST NETWORK.
 First published in 1967

6
 Protocol 5

 A set of rules and conventions used in a network

environment to standardize communication.

7
 HTTP - Hyper Text Transfer Protocol 5
 To transfer web documents

 Protocol which is used to transfer hypertext

documents over the internet is called HTTP.

8
HTTPs - Hyper Text Transfer Protocol service version
5
 To transfer web documents in more safer
manner(with encryption)
 Ex:
 Google use https-have gmail logins

9
 Packet 5

 When communicating over a network data and

information are divided into small parts/chunks
called packets.

10
 IP (Internet Protocol)
5
 Every machine on a network has a unique identifier.
 We use the TCP/IP protocol to communicate on the
network.
 In the TCP/IP protocol, the unique identifier for a
computer is called its IP address.
 Concerns about packet switching.

11
5

12
 Packet switching
 Packet switching is the approach sending and
receiving packets over a network.
 Each packet contains address information to identify
the sending computer.
 It is Hop to Hop transferring process.

13
 Circuit switching

 Sending and receiving signals in a pre built path.

 Ex:

 Telephone network

14
TCP/IP(Transmission control protocol /Internet Protocol)
5
 TCP assures reliable delivery of packets.(positive and
negative acknowledgements)

15
5

16
 IPV4(Internet Protocol version 4) 5
 IPV4 has addressing mode & 32 bit,4 portions, dotted
octet binary number is uniquely assign to a network
computer.
 So that we can identify network components.

17
 Max IP

 255 . 255 . 255 . 255

 11111111 . 11111111 . 11111111 . 11111111

18
 Min IP

 0.0.0.0

 00000000 . 00000000 . 00000000 . 00000000

19
 IPV6
 IPV4 can provide 232 unique addresses. It was not
sufficient to provide IP addresses to the world
population.
 Therefore IPV6 was introduced and it can provide
2128 addresses.
 Ex:
 Ipconfig/all

20
 Static IP

 Pre assigned IP which is given to a network card/adapter.

 Control panel  network Network adapter  right click

 properties

21
22
 Dynamic IP

 IP which is auto acquired by network connected

device(Given by a DHCP service)-on demand

23
 Public IP

 A unique IP in the internet.

 When requesting such IP you have to pay extra

amount.

24
 Private IP

 IP which is used in private network such as

LAN.

25
URL-Uniform Resource Locator 5

26
 URI(Uniform Resource Identifier) 5

 URN(Uniform Resource Name)

27
 Domain 5
 A unique name given to a server to hide its
IP address.
 Ex: www.google.com

 IP : 74.125.68.147

28
29
 Domains can be further divided into sub
domains.
 Ex:
 Images.google.com
 Maps.google.com
 Mail.google.com

30
 Domain categories 5
Top Level Domains:

 .com  .gov
 .info  .me
 .biz  .tv
 .org  .lk
 .edu

31
DHCP-Dynamic Host Configuration protocol
5
 It will assign dynamic IPs on demand.

32
 FTP - File Transfer protocol 5
 Direct file manipulation facility over a network or
internet
 A very common method of moving files between two
internet sites.

33
 5
 FTP is a way to login to another internet site for the purpose
of retrieving and /or sending files.

 Users are able to transfer files (download) to their computer

or to transfer (upload) their own files to the server
(computer).

34
 SFTP - Secure File Transfer Protocol 5
 The Secure File Transfer
Protocol ensures that
data is securely
transferred using a
private and safe data
stream.
 Use encryption

35
 Host 5

 A network connected computer.

36
 DNS - Domain Name Server 5
 It will convert domains to IP s and IPs to domains.

37
38
 Server 5

 A computer which provides one or more services.

 Typically this is high-end machine.

39
 client 5
 A computer which consumes the service.

40
 P2P 5
 In peer to peer network both parties are acting
as servers and clients.

41
 ISP-Internet service provider 5
 Provides the service based
on traffic. Based charging or
time based charging.
 Ex:
 SLT, Dialog, Lanka com,
 Mobitel

42
 Modem 5
 Modulator, demodulator

 Converts digital signals to

analog signals and analog
signals to digital..

 Computer use digital signals

but telephone network use
analog signals.
43
 Topology

 The way the network is arranged.

 Physical arrangement-physical topology

 Logical communication process-logical topology

44
 Browser 5
A software(client software) used to access web sites and
resources.
 Ex:
 Opera  Safari
 Mozilla  Internet
Firefox explorer
 Google  Netscape
chrome Navigator

45
 Search engine 5
 Special website which allows you to search other
websites.
 Ex:
 www.ask.com
 www.google.com
 www.yahoo.com
 www.answers.com
 www.mama.com
46
 HTML Vs XHTML 5
HTML-Hyper Text Markup
Language
XHTML-Extensible Hyper
Text Markup Language

47
 SMTP - Simple Mail Transfer Protocol 5
 Transferring emails between servers.

48
 POP - Post office protocol 5
 Receiving emails

POP3-Post office protocol

version 3

49
IMAP - Internet Message Access Protocol
5
 Receiving emails

50
 ISDN(Integrated Service Digital
Network) 5
 ISDN is the original high-speed internet service
 It can transmit data and phone conversations digitally over
normal telephone wires.
 This makes it both faster and of higher quality than dial-up
internet service.

51
 PSTN (public switched telephone 5
network)
 Refers to the international telephone system based on copper
wires carrying analog voice data.
 This is in contrast to newer telephone networks base on digital
technologies, such as ISDN and FDDI.

52
Dial Up 5
 Dial-up refers to an Internet connection that is established
using a modem.

53
SDSL/DSL- Symmetric Digital subscriber Line
5
 Downloads and uploads capacities are same.

54
ADSL-Asymmetric Digital subscriber Line
5
 More download capacity

55
 To search information need..

 Web browser

 Connectivity

 Search engine

56
 To access internet we need?

 Computer/device

 Connectivity

 Connection given by ISP

 Network Interface

57
Examples for Client Server Software & Related Protocols

1. File Transfer 7
 Protocol- FTP, SFTP

 Server software programs - Filezilla, samba

 Client software – FileZilla client

58
 7
2. Email
 Protocol- SMTP,POP3,POP,IMAP
 Server software programs – Microsoft
exchange server
 Client software – outlook express , Ms office
outlook, Eudora ,Thunderbird

59
 7
3. News groups
 A newsgroup is a discussion group.
 People on computers all over the Internet connect
to each other to ask questions and discuss specific
topics.
 Anyone is allowed to participate.
 Some newsgroups have completely free and open
discussions

60
 Remote access 7
 Remote access refers to the ability to access a computer, such as
a home computer or an office network computer, from a
remote location.

 This allows employees to work offsite, such as at home or in

another location, while still having access to a distant computer
or network, such as the office network.

61
 7
 Remote access can be set up using a local area network (LAN),
wide area network (WAN) or even a virtual private network
(VPN)

 so that resources and systems can be accessed remotely.

 Ex: Team Viewer

62
7

63
 Malware 8
 Malicious software
 Ex:
 Virus
 Trojans
 Adware
 Spyware
 Sniffers
 worms
64
 Spyware 8
 Software with spying intention.

65
 Adware 8
 Display unwanted advertisements

66
 Worm 8
 A virus replicating over the network

67
 Virus 8
 Software which has unwanted
functionality and it will waste resources.

68
 Spam 8
 Unsolicited emails and messages.

69
 Why spamming is not good? 9
 Spamming will duplicate messages in the server in an
unnecessary way.
 Ex:
 Sending messages to 100 people will sent it back to
another 100 and there will be 100 x 100 duplicates
in the server.
 It waste resources and generate unnecessary traffic.

70
How you will see a web page from a browser
10

Network

Client
Database

Client Server
browser

71
Number Action 10
1 User type the url and request a page
2 Request is sent to the internet
3 User request reaches the server through internet
4 Server accept user request
5 Server sends response
6 Response reaches client browser
7 User sees the web page

72
 Snail mail E-mail
Definition Traditional Electronic mail
11
speed slow High
Address format

Personal feel High Low

Advantages Reach to place Reach to person cost is low
cost is high
Disadvantages Physical goods Physical goods cannot be
can be sent sent
73
• Search Strings to Search Following in the
“Google” Search engine
12
 pdf document about services of the internet

services of the internet file type.pdf

 programming languages only within Wikipedia web site

programming languages site.wikipedia.org

74
Parts of an email

75
 The parts of an email 14
 To : enter the exact email address of your recipient
(remember: [email protected])
 For multiple recipients, separate each address
with a comma
 CC : carbon copy
 BCC : BLIND carbon copy – is anonymous
 Subject : the topic of your email – very important
 Body : the message of your email
 Attachments : the paperclip symbol - files or photos

76
 CC (carbon copy)
 When you send a message to more than one
address using the Cc: field, both the original
recipient and all the recipients of the carbon
copies see the To: and Cc: fields including all
the addresses in them.
 This means that every recipient gets to know
the email addresses of all the persons that
received your message.

77
 BCC (Blind Carbon Copy)
 The Bcc: field helps you deal with the problems created
by Cc:.
 As it is the case with Cc:, a copy of the message goes to
every single email address appearing in the Bcc: field.
 The difference is that neither the Bcc: field itself nor the
email addresses in it appear in any of the copies.
 The only recipient address that will be visible to all
recipients is the one in the To: field.

78
 Privacy on the Internet
 Use a password manager
 Disable GPS and Wi-Fi on your mobile device until you need them
 Read the access privileges for apps carefully, and make good choices
 Make yourself more difficult to find on social media
 Encrypt your connections
 Install the latest antivirus software on your devices
 Make sure shopping sites are secure
 Use strong passwords

79
 HTML
Hyper Text Markup Language

80
 What is a Web Page? 14
 A Web page is a simple text file that contains
 Text

 A set of HTML tags that describe how the text should be

formatted when a browser displays it on the screen.

81
 Tags

 The tags are simple instructions that tell the Web browser how the
page should look when it is displayed.

 The tags tell the browser to do things like change the font size or
color, or arrange things in columns.

 The Web browser interprets these tags to decide how to format

the text onto the screen.

82
 What is HTML? 16
 HTML is a markup language for describing web documents
(web pages).

83
 What is markup language? 17
 A "markup language" is a computer language that describes
how a page should be formatted.

84
 Creating HTML Pages

 HTML files can be created with text editors:

 NotePad, NotePad ++, PSPad

Or HTML editors :
• Microsoft Word
• Microsoft FrontPage
• Visual Studio
• Adobe Dreamweaver
• Netscape Composer

85
HTML BASICS

86
 19
HTML Paragraphs
HTML paragraphs are defined with the <p> tag.
.a
<html>
<body>
<p>This is a paragraph.</p>
<p>This is a paragraph.</p>
<p>This is a paragraph.</p>
</body>
</html>

87
 HTML Headings 19
HTML headings are defined with the <h1> to <h6> tags.
<html> .b
<body>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
</body>
</html>
88
19
.c

89
HTML / CSS Name
Black
Hex Code#RRGGBB
#000000
Decimal Code(R,G,B)
(0,0,0) 19
White #FFFFFF (255,255,255)
Red
Lime
#FF0000
#00FF00
(255,0,0)
(0,255,0)
.d
Blue #0000FF (0,0,255)
Yellow #FFFF00 (255,255,0)
Cyan / Aqua #00FFFF (0,255,255)
Magenta / Fuchsia #FF00FF (255,0,255)
Silver #C0C0C0 (192,192,192)
Gray #808080 (128,128,128)
Maroon #800000 (128,0,0)
Olive #808000 (128,128,0)
Green #008000 (0,128,0)
Purple #800080 (128,0,128)
Teal #008080 (0,128,128)
Navy #000080 (0,0,128)

90
HTML entity examples 19
.d

91
 <div> tag 19
.f
 <div> tag defines a division or a section in an
HTML document.
 The <div> tag is used to group block-
elements to format them with CSS.

92
 Example:
<html>
<body>
<div >
<h3>This is a heading in a div element</h3>
<p>This is some text in a div element.</p>
</div>
</body>
</html>

93
HTML Text Formatting Tags
Tag Description
<b> Defines bold text
<em> Defines emphasized text
<i> Defines Italic text
<small> Defines smaller text
<strong> Defines important text
<sub> Defines subscripted text
<sup> Defines superscripted text
<del> Defines deleted text

94
 HTML Formatting Tags
HTML uses tags like <b> and <i> for formatting output,
like bold or italic text.
<html>
<body>
<p><b>This text is bold</b></p>
<p><strong>This text is strong</strong></p>
<p><em>This text is emphasized</em></p>
<p><i>This text is italic</i></p>
<p><small>This text is small</small></p>
<p>This is_subscript and ^superscript</p>
</body></html>

95
 Ordered Lists: <ol> Tag 19
 Create an Ordered List using <ol></ol>:
<ol type="1">
<li>Apple</li>
.g
<li>Orange</li>
<li>Grapefruit</li>
</ol>

 Attribute values for type are 1, A, a, I, or i

1. Apple i. Apple
2. Orange ii. Orange
3. Grapefruit iii. Grapefruit
A. Apple a. Apple I. Apple
B. Orange b. Orange II. Orange
C. Grapefruit c. Grapefruit III. Grapefruit

96
 ordered lists 19
<html><body>
<h4>Numbered
<h4>Letters
list:</h4>
.g
list:</h4> <ol type="A">
<ol> <li>Apples</li>
<li>Apples</li> <li>Bananas</li>
<li>Bananas</li> <li>Lemons</li>
<li>Lemons</li> <li>Oranges</li>
<li>Oranges</li> </ol>
</ol> </body></html>

97
 Unordered Lists: <ul> Tag 19
.g
<ul type="disc">
<li>Apple</li>
<li>Orange</li>
<li>Grapefruit</li>
</ul>

98
 Unordered Lists: <ul> Tag 19
 Create an Unordered List using <ul></ul>: .g
 values for type are:
 disc, circle or square

• Apple o Apple  Apple

• Orange o Orange  Orange
• Pear o Pear  Pear

99
 19
.h

HTML TABLES

100
 HTML Table Tags
Tag Description
<table> Defines a table
<th> Defines a header cell in a table
<tr> Defines a row in a table
<td> Defines a cell in a table

101
<html>
<body>
<table border="1">
< tr>
< td>row 1, cell 1</td>
< td>row 1, cell 2</td>
< /tr>
< tr>
< td>row 2, cell 1</td>
< td>row 2, cell 2</td>
< /tr>
< /table>
</body>
</html>

102
 HTML Table Headers

<html><body>
<h4>Table headers:</h4> <tr>
<table border="1"> <td>Bill Gates</td>
<tr> <td>555 77 854</td>
<th>Name</th> <td>555 77 855</td>
<th>Telephone</th> </tr>
<th>Telephone</th> </table></body></html>
</tr>

103
<html><body>
<h4>Vertical headers:</h4>
<tr>
<table border="1">
<th>Telephone:</th>
<tr>
<td>555 77 855</td>
<th>First Name:</th>
</tr>
<td>Bill Gates</td>
</table>
</tr>
</body></html>
<tr>
<th>Telephone:</th>
<td>555 77 854</td>
</tr>

104
 Cell Spacing and Padding
 Tables have two important attributes:

 cellspacing  cellpadding

cell cell cell cell

cell cell cell cell

 Defines the empty  Defines the empty space

space between cells around the cell content

105
 Cell Spacing and Padding
<html>
<head><title>Table Cells</title></head>
<body>
<table cellspacing="15" cellpadding="0">
<tr><td>First</td>
<td>Second</td></tr>
</table>
<br/>
<table cellspacing="0" cellpadding="10">
<tr><td>First</td><td>Second</td></tr>
</table>
</body>
</html>

106
 Column Span
<html> <td>Bill Gates</td>
<body> <td>555 77 854</td>
<h4>Cell that spans two <td>555 77 855</td>
columns:</h4> </tr>
<table border="1"> </table>
<tr> </body>
<th>Name</th> </html>
<th colspan="2">Telephone</th>
</tr>
<tr>
107
 Row span
<tr>
<html> <th>rowspan="2">Telephone:</th>
<body> <td>555 77 854</td>
<h4>Cell that spans two </tr>
rows:</h4> <tr>
<table border="1"> <td>555 77 855</td>
<tr> </tr>
<th>First Name:</th> </table>
<td>Bill Gates</td> </body>
</tr> </html>

108
 Relative Referencing Absolute referencing

 An absolute URL - points to another web site (like

href="http://www.example.com/theme.css")
 A relative URL - points to a file within a web site (like
href="/themes/theme.css") 19.
k.l
109
 HTML Links 19
HTML links are defined with the <a> tag. .i
<html>
<body>
<a href=http://www.esoft.lk>This is a
link</a>
</body>
</html>
110
<html>
<body>
<a href="http://www.esoft.lk"
target="_blank">Visit www.esoft.lk!</a>

<p>If you set the target attribute to "_blank", the link will
open in a new browser window tab.</p>
</body>
</html>
111
 19
Image attributes: m
src Location of image file (relative or absolute)
height Number of pixels of the height
width Number of pixels of the width
border Size of border, 0 for no border

112 112
 HTML Images 19.
HTML images are defined with the <img> tag.
m
<html>
<body>
<img src=“image1.jpg”>
<img src=“image1.jpg" width="104" height="142">
</body>
</html>

113
 HTML Comment
<html>
<body>
<!--This comment will not be displayed-->
<p>This is a regular paragraph</p>
</body>
</html>

114
 HTML Line Breaker

<html>
<body>
<p>This is<br>a para<br>graph with line
breaks</p>
</body>
</html>

115
 Sounds 19
<audio controls> .n
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3"
type="audio/mpeg">
Your browser does not support the audio tag.
</audio>

116
 Bookmarks 19
.o
 HTML bookmarks are used to allow readers to jump
to specific parts of a Web page.
 Bookmarks can be useful if your webpage is very
long.
 To make a bookmark, you must first create the
bookmark, and then add a link to it.
 When the link is clicked, the page will scroll to the
location with the bookmark.

117
 Bookmarks-example
<body>
<a name="top"></a>
<a name="bookmark"></a>
<h2>Hyperlink Bookmark Code</h2>
<a name="example"></a>
<h2>Example Bookmark Layout</h2>
<a name="example2"></a>
<h2>Another Example Layout</h2>
<ul>
<li><a href="#top">Top of Page</a></li>
<li><a href="#bookmark">Hyperlink Bookmark Code</a></li>
<li><a href="#example">Example Bookmark Layout</a></li>
<li><a href="#example2">Another Example Layout</a></li>
</ul>
</body>

118
 HTML forms 19
Text Boxes
<html> .p
<body>
<form>
First name:<br>
<input type="text" name="firstname">
<br>
Last name:<br>
<input type="text" name="lastname">
</form>
</body>
</html>
119
 Button 19
.p
<input type=“submit” name=“Submit”
value=“click”>

120
 Radio Buttons 19
<html>
<body> .p
<form>
<input type="radio" name=“Gender“ value="male" checked> Male
<br>
<input type="radio" name=“Gender" value="female"> Female
</form>
</body>
</html>

121
<body>
<h1>Sample form page</h1> 19
<form id=“sampleform” method=“post” action='‘” >
<div>
Name: <input type='text' name='Name' />
.p
</div>
<div>
Email: <input type='text' name='Email' />
</div>
<div>
<input type='submit' name='Submit' value='Submit' />
</div>
</form>
</body>
</html>
122
 HTML Drop Down List: 19
.p
<select name="selectionField">
<option value="CA" >California -- CA </option>
<option value="CO" >Colorado -- CO</option>
<option value="CN" >Connecticut -- CN</option>
</select>

123
 19
<select size="3" name="selectionField" multiple="yes" > .p
<option value="CA" >California -- CA </option>
<option value="CO" >Colorado -- CO</option>
<option value="CN" >Connecticut -- CN</option>
</select>

124
 What is css? 19
 CSS stands for Cascading Style Sheets .q
 CSS describes how HTML elements are to be displayed on
screen, paper, or in other media CSS saves a lot of work.
 It can control the layout of multiple web pages all at once

125
 Css-example 19
<html>
<head> </style>
</head>
.s
<style>
h1 { <body>
color: blue;
font-family: verdana; <h1>This is a heading</h1>
font-size: 300%; <p>This is a paragraph.</p>
}
p { </body>
color: red; </html>
font-family: courier;
font-size: 160%;
}
126
 Add background - color 19
<html>
.s
<body style="background-color:yellow;">
<h2 style="background-color:red;">This is a
heading</h2>
<p style="background-color:green;">This is a
paragraph.</p>
</body></html>

127
 Add Font 19
<html> .s
<body>
<h1 style="font-family:verdana;">A heading</h1>
<p style="font-family:arial;color:red;font-
size:20px;">A paragraph.</p>
</body>
</html>

128
 Text Align 19
.s
<html>
<body>
<h1 style="text-align:center;">Center-aligned
heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
129
Thank you!

130