CIS 1203Web Technologies

Introduction to the Internet and the WWW

Lesson Objectives

Students should:– Understand the Internet and its history– Understand the WWW, its history and how it

relates to the Internet– Discuss the evolution of the WWW– Identify and describe the fundamental

technologies of the Web– Explain how the Web works

Information Technology

IT all aspects of managing & processing information using technology– Mainly computers and computer networks:

• Hardware

• Software

• Connectivity (Networks)

Hardware

SoftwareNavigation software Steer clear of danger

Image compression software More image returns

Hardware

Software

Operating system Control HW and other SW

Web browser Surf the net

Photo gallery Organize photos

Text editor Compose and manage text messages

Connectivity

Computer networks and telecommunications infrastructure allow multiple hardware devices to connect and share data and information

Transmits voice and data to other

devices

Transmits data back to earth

Computer Networks

A network is a group of two or more computers connected– Why connected?

• To communicate, share resources and exchange information

Types Of Networks

LAN– Local Area Network

» Computers are connected in a confined geographical area

WAN– Wide Area Network

» Computers span a large geographical area

The Internet

A network of networks– A worldwide collection of computer networks, cooperating

with each other to exchange data using a common software standard

Multiple data systems– Email– FTP (File Transfer Protocol)– TELNET– The World Wide Web (WWW)– And more

History of The Internet The Advanced Research Projects Agency (ARPA) -1957

– A Department of Defense project to establish US lead in science and technology applicable to the military

Operation ARPANET– A need for a bombproof communications system– Link computers together throughout the US– Gradual shift from a military pipeline to communications tool for scientists

In late 1980s, DOD decommissioned the ARPANET to NSF (National Science Foundation) Network called NSFnet– Large telecommunication companies created high speed data lines and

connected to NSFnet The rest is history…

But What is The WWW?

Created in 1989 in CERN The “information superhighway”

– A method of posting and accessing interactive multimedia information

Hyper what?– The WWW is based on a concept called

hypertext• The organization of information units into

connected associations that a user can choose to make (links)

Web 1.0

Web pages connected together via hyperlinks Mostly static and very little interaction

between the user and the webpage Focus is companies that own create and own

their content

Web 2.0

Dynamic web pages that are data-driven and user-centric

High level of interactivity with user-generated content (blogs, forums, social networks, video sharing, etc.)

Rich interfaces made possible through AJAX– AJAX Asynchronous JavaScript And XML

AJAX Library Demo

jQuery: http://jqueryui.com/

Mobile Web

Web resources are being accessed via mobile devices

Companies are developing mobile versions for their websites

Mobile commerce is an emerging trend

The Client-Server Model

Internet

Server Side Client Side

Client-Server Model: describes the relationship between two computer programs in which one program, the client, makes a service request from another program, the server, which fulfills the request

HTTP request

HTTP response Web BrowserWeb Server

What is HTTP?

HTTP (Hypertext Transfer Protocol) is the foundation of data communication for the WWW

A protocol defines a set of rules that enable effective communications between computers

HTTP is part of a protocol framework called the Internet Protocol Suite which includes TCP/IP

TCP/IP Transmission Control Protocol (TCP):

– Establishes connections among sending and receiving Web computers– Handles assembly of packets at point of transmission, and reassembly

at receiving end

Internet Protocol (IP): – Provides the Internet’s addressing scheme

Internet Protocol (IP) Addresses IPv4:

– 32-bit number

– Expressed as series of four sets of separate numbers marked off by periods

• 201.61.186.227

• Class C address: Network identified by first three sets, computer identified by last set

New version: IPv6 has 128-bit addresses, able to handle up to 1 quadrillion addresses (IPv4 can only handle 4 billion)

sbaserver1.sba.muohio.edu 134.53.40.2

Routing Internet Messages: TCP/IP

Web Browser Overview

A tool for “traveling” the internet A “client” software for “surfing” the WWW Browser war

– Different vendors– Non standard extensions– Different viewing experience of the same web page

Then came the standards– World Wide Web Consortium (w3c)

• http://w3c.org • Internet Explorer• Safari• FireFox• Mozilla• Opera• Lynx

Web Browsers and Devices

The way a webpage is displayed depends on the monitor size and screen resolution

Some browser might not support flash or other multimedia objects

Some browsers are so small, the whole webpage layout must be different

How Browsers Work

Enter URL or click a link

The browser breaks the address into 3 parts1. Protocol2. Server and domain name3. The resource name (webpage)

1 2 3

How Browsers Work

The browser then communicates with a domain name system (DNS) server that translates the domain name into IP address

DNS Server 1

Sorry I don’t know this address. Let me check another server

DNS Server 2

I found it. The IP address is: Du Web Server

How Browsers Work

Your browser sends an HTTP request to the server using its IP address

Some level of authentication takes place The server sends the requested page coded in

HTML Your browser reads the markup of HTML and

interprets it into the web page that you view

Domain Names, DNS, and URLs Domain name

– IP address expressed in natural language

Domain name system (DNS)– Allows numeric IP addresses to be expressed in natural

language

Uniform resource locator (URL)– Address used by Web browser to identify location of

content on the Web– E.g. http://hct-portal.hct.ac.ae/students

Top-Level Domain (TLD) Names

Domain Signifies Domain Signifies aero Air-transport industry au Australia biz Business organization br Brazil com US commercial ca Canada coop Coooeratives cn China edu US educational de Germany info Unrestricted fi Finland gov US government fr France mil US military gb Great Britian museum Museums in India name Individuals it Italy net US network jp Japan org US non-profit ru Russia pro Professionals za South Africa

URL

Uniform Resource Locator

http://samer.ecommerce.hct.ac.ae/fw/index.php

File Name

Path

Domain Name

Double slash means a system address will follow

Access method or Protocol

A separator