Transcript Lecture 3

IS1811 Multimedia Development
for Internet Applications
Lecture 3: Introduction to basic Web and
Internet Technologies
Rob Gleasure
[email protected]
http://girtab.ucc.ie/rgleasure/index.html
IS1811

Today’s class
 TCP/IP and OSI models
 Http and file transfer protocols
 Common browsers
 Internet demographics
 Introduction to HTML
TCP/IP

Transmission Control Protocol / Internet Protocol (TCP/IP) is the
communication protocol for the Internet.
 Your browser uses TCP/IP to access Internet servers, and
servers use TCP/IP to send HTML back to your browser.

An Internet address or IP address "193.120.116.180" is a part of the
standard TCP/IP protocol, as is the domain name www.website.com
 The IP part encompasses the connectionless packet-switching
discussed in lecture 2
OSI Model

Open Systems Interconnection (OSI) Basic Reference Model

Developed by International Organisation for Standardization (ISO) in
1984 to provide a reference model for the complex aspects related
to network communication
OSI and TCP/IP Models
OSI and TCP/IP Models

Both models divide the different functions and services provided by
network hardware and software into discrete and separate layers.
 The benefits of this?
 Modular engineering (may be built in chunks)
 More simple to teach and learn network technologies
 Easier to isolate problems
 Allows vendors to focus on just the layer(s) in which their
hardware or software is implemented and be able to create
products that are compatible, standardized and interoperable.
Universal Resource Locators (URL)

URLs
 Used to identify resources on the Internet
 Are also called “Uniform Resource Locators”
 Have the following general format:
network-protocol:resource-location/file


Networking protocols can be
 http, ftp, gopher, telnet, file, mailto, news
Resource location
 //domain_name/directory/file
E.g. http://www.site.ie/en/index.html
HTTP

Hypertext Transfer Protocol (HTTP)

Designed within the application layer of the TCP/IP architecture
to distribute hypertext documents

Works on the client-server principle and is the foundation of
data communication on the Web

Files are sent with accompanying meta-data headers
describing details such as the content type, last modified date,
etc

Composed of standards supported by W3C

Currently, version 1.1 is most commonly used
HTTP (continued)

Hypertext Transfer Protocol (HTTP)

HTTP has 2 important features:
 As well as basic web files such as html documents, a
server can also return other miscellaneous data from
applications running on a server to a client, e.g. database
records
 It can also pass data sent from a client to various serverside CGI programs for additional processing via the HTTP
URL
FTP

File Transfer Protocol (FTP)

Used to copy a file from one machine to another

Also works within the application layer of the TCP/IP
architecture and also client-server based

Unlike HTTP, FTP transfers include no meta-data

Uses two connections: one to establish
communication/exchange commands and one to stream data
 Less secure
 Tends to be blocked by firewalls
Other Protocols

Telnet

Allows you to use the resources of a distant computer
somewhere else in the world
 often used to share the power of a large single machine
amongst many remote users using less advanced terminals

Mailto

Allows emails to be send directly from an email interface within
the browser, e.g. mailto:[email protected]
Common File Types

Types of webpage
 .html
 .xhtml
 .mhtml
 .xml
 Often academic sites or sites where large volumes of
information is managed and shared.
 .asp/aspx
 Created using Microsoft Visual Studio
 Often used for elaborate or high-processing sites, or those
where large amounts of user input is received.
 .php
 Similar suitability as .aspx
Common File Types

Types of image
 .gif
 Graphics Interchange Format
 Traditionally the “Darling of the web”
 Largely used for icons or simple images.
 Lessening of importance as bandwidth increases in Internet
users. Still very common though.
Common File Types

Types of image
 .jpeg
 Joint Photographic Experts Group
 Still the most common format used for photographs
 Same format as digital cameras use
 Issues with “lossy” compression
Common File Types

Types of image
 .png
 Portable Network Graphic
 Put forward by w3c as an alternative format
 Lossless compression
 Variable quality/file-size
 Gaining popularity all the time
What browsers are out there?

The Web consortium generally consider Internet Explorer (IE),
Firefox, Chrome, Opera and Safari to the main families of
browsers
IE
Firefox
Chrome
Safari
Opera
July
2014
8.5 %
24.9 %
59.8 %
3.5 %
1.7 %
July
2012
16.3 %
33.7 %
42.9 %
3.9 %
2.1 %
July
2010
30.4 %
46.4 %
16.7 %
3.4 %
2.3 %
July
2008
52.8 %
41.0 %
-
2.5 %
1.9 %
Statistics from http://www.w3schools.com/browsers/browsers_stats.asp
What Are Mobile Applications?

Mobile applications are applications and/or services that are used
on a mobile device

Mobile applications can be developed to be
 Mobile Web (viewed on browsers within mobile devices)
 Native (Installed as programs on mobile devices)
Growth of Mobile Applications
Mobile Applications Internationally
Internet Usage
Taken from http://www.internetworldstats.com/stats.htm
Internet Usage
Taken from http://www.internetworldstats.com/stats.htm
Internet Usage
Taken from http://www.internetworldstats.com/stats.htm
Hypertext Markup Language (HTML)

What is HTML?
 HTML stands for Hyper Text Markup Language

An HTML file is a text file containing simple markup tags
 These tags tell the Web browser how to display the page

An HTML file must have an .htm or .html file extension

An HTML file can be created using a simple text editor
 We’ll be using Notepad or Notepad++
HTML (continued)

How does HTML work?
 The basic principle is to “wrap” everything in tags.
 These tags are organised in a concentric manner.
A simple web page

Open up either Internet Explorer or Firefox (double-click on either
OR
on your desktop)

Open up Notepad
 go to start menu  all programs  accessories  notepad

Save the file to the desktop with the name “hello.html”
 Make sure you save it as “All Files”.
A simple web page


Type or copy-and-paste in the following
<html>
<head>
<title>Hello</title>
</head>
<body> This is my first homepage.
<b>Hello World!</b>
</body>
</html>
Click on ‘save’ in the file menu
A simple web page

In Firefox
 file  open file and navigate to desktop  select your page

Or else in Internet Explorer
 file  open file  browse and navigate to desktop  select
your page
A simple web page

You should see something like this
IS1811

Next week
 Working with HTML
Want to read more?

Links and references
 http://www.w3schools.com/
 http://www.internetworldstats.com/stats.htm
 http://www.isoc.org/internet/stats/
 http://www.internettrafficreport.com/
 http://www.w3schools.com/tcpip/default.asp
 http://www.yale.edu/pclt/COMM/TCPIP.HTM
 http://cybernetnews.com/