Você está na página 1de 31

Web and Web Applications:

an Overview of the Technology Landscape IT 4203 Advanced Web Development

Jack G. Zheng Fall 2010


What is the web? What is web application? How does it work? What are the major and latest technologies?

What is the Web?

The Internet

A world-wide network of networks and computers based on the Internet Protocol

World Wide Web, or Web

An Internet application based on the HTTP protocol A client/server application for information and services

Web Related Terms

Web page: usually refers to a static HTML file, or a dynamically generated HTML document displayed in a browser. Web site: a collection of web pages, applications, etc., that serve a common purpose. Web (based) information system: an information system that utilizes web technologies to deliver information and services, to users or other information systems/applications. Web application: a specific functionality-oriented component that utilizes web technologies to deliver information and services to users or other applications/information systems.

A web information system usually consists of one or more web applications, together with information components and other non-web components. Webware: usually refers to web applications (or programs or software) that directly serves users through web browsers. Web service: A software component that utilizes web technologies to deliver information and services to other applications/information systems.

Evolution of the Web Application

Pre-web (before 1990) Early/simple web (1990s)

Dynamic web (since second-half 1990s)

Current web

Infrastructural web (21st century) Web 2.0 (since 2005)



Before there was the Web, there was the Internet

TCP/IP (Transmission Control Protocol/Internet Protocol) architecture

Internet Applications

Usenet, BBS, Telnet Email, FTP Web P2P Video streaming Instant messaging, VoIP Gaming

Which one generates the most traffic volume on the Internet?

Answer form: ipoque, Cisco, Sandvine


Early Web, Simple Web

Invented by Sir Tim Berners-Lee, 1989 It is a client/server application for information and other services Fundamental elements of the web

Web server Web client: browser Web protocol: HTTP (Hypertext Transfer Protocol) Web address: URL (Uniform Resource Locator) Web content: HTML (Hypertext Markup Language)

Simple Web Architecture

HTTP - Request URL http://spsu.edu/index.html
The Internet

Web server

HTML Files

HTTP - Response

Web client: browser



A web page is created using HTML, a standard markup language to describe a web document/page using tags (markups)

All content in a web page are wrapped in tags

<body>, <h1>, <p>, <table>, <img>, <a>, etc.


Web browser software (web client) knows how to interpret these tags and display them nicely to users (rendering)

Provides an interface for users It understands HTML, scripts and works with other plug-ins

Web browser products

Market share


Internet Explorer Firefox Chrome WorldWideWeb

http://www.w3.org/History/1994/WWW/Journals/CACM/screensnap2_ 24c.gif


Web Server

Web server

Hosts web sites, files (web pages), applications, etc. Processes request from clients (browsers) and send response back to clients Resources on web servers are located by URLs. Web servers are located by the IP address and domain names.

Major web server products

Apache Internet Information Services (IIS) Market share data

http://news.netcraft.com/ http://www.securityspace.com/s_survey/data/201007/index.html


URL (Uniform Resource Locator)

URL is used to locate a particular resource on a web server Components of a URL

Protocol Host (domain, IP) Port File (resource) path

The default port is 80; :80 is usually omitted.


home/about/ is the directory (path) on the server; index.html is the actual file (web page).

http is the protocol www.spsu.edu is the domain; .net is the top level domain



HTTP (Hypertext Transfer Protocol) is the feature communication protocol for the web

A web server and a browser communicate based on HTTP

HTTP has two types of message

HTTP Request: a message sent to the web server HTTP Response: a message sent by the web server (responded by the server)

See example HTTP request and response messages at http://web-sniffer.net



A domain is a name assigned to a server on the Internet. A domain name is divided into several levels starting from the right, and separated by dots .
SPSU is the 2nd level domain.

Example: WWW is the 3rd level domain.

EDU is the top level domain.

Top-level domain: a highest level domain that are predefined; usually indicates the type of the site

Created in 1980: .com, .net, .org, .edu, .gov, .int, .mil 2 letter country code: .us, .uk, .jp, .ca, .au, .cn,

Top level domains are managed by

ICANN (http://www.icann.org) and IANA (http://www.iana.org)


Domain Name System

Web servers are located by IP addresses Domain Name System (DNS)

A system that provides the conversion between IP addresses and domain names

Check IP and domain name online



Put Them Together

What happens after a URL is entered in the web browser?

1. Looking for the IP of the domain spsu.edu

DNS server(s)

2. Returning the IP of the domain:

3. Sending an HTTP request to

5. Sending an HTTP response back 4. Looking for the file /index.html


Simple Web Applications

These are usually document based web applications

Simple, small and fast

Commonly used for web presence, information publishing, etc.

http://www.atlantapetrescue.org http://facultyweb.ggc.usg.edu/cpark/ http://2008.desrist.org http://www.useit.com/alertbox/


Dynamic Web

Static dynamic

Web pages construction

At design time at run time Static HTML files dynamic HTML: a mixture of HTML, scripts, programming codes, executable programs, etc.


Content source

Single source multiple sources (HTML files, XML files, other files, databases, other websites)

Simple complex

Web navigation/interaction mode

Click and read write/type, choose, move, slide, drag and drop, expand, draw, listen, speak, etc.
Webpage authoring web application development


Dynamic Web Technology: Client Side (DHTML)

Cascading Style Sheet (CSS)

Page style (color, size, position, etc.) and layout Website themes Simple animations

Client Scripting (JavaScript)

Dynamic content: calendar HTML DOM manipulation: dropdown menu Animations: text animation

Browser plug-ins

Flash, Sliverlight, Java Applets, PDF, embedded objects, etc.


Dynamic Web Technology: Server Side

Specialized servers

Web server extensions or application servers

Adding programming capabilities: ASP, ASP.Net, JSP, JSF, Servlet, PHP, ColdFusion, etc. Complementing file systems for content management

Database servers

Dynamic pages/resources

Database populated: news site, portal, product catalog, directory, etc. URL query string: product data Content based on user input: web search, forum post, log in, etc. Mash-up

Server Side Web Applications



Application Server

Client (Browser)

Generated HTML

Other Servers: Email, LDAP, etc.

Web Server


Static HTML

Server Side Technologies

Platform Technology


Servlet, JSP, JSF, etc.

CGI, Perl, PHP, ColdFusion
www.craigslist.org www.wikipedia.org

Example site

atlanta-airport.com newegg.com monster.com

bankofamerica.com ratemyprofessors.com


Dynamic Web Applications

Public websites

E-Commerce: shopping, banking, media, trading, etc. Web search engines Content publishing Web portal E-government, e-Learning

Internal applications

Oracle Enterprise Manager Microsoft SharePoint Services Enterprise Information Portal


Current Web

Web as a platform/infrastructure

Web is becoming a fundamental piece of enterprise information system

Web 2.0

A general and loose concept for recent advancements of the World Wide Web


Web as a Platform

Web becomes a fundamental platform for multi-tier enterprise information systems

Add-on platform

Web technologies are commonly and intensively used, not just for websites, but for all kinds of application and services. Web applications are no longer separate systems, but are integrated with many other applications.

Separated integrated

Enabling technologies

Matured web application servers and frameworks: .Net, JBoss, SharePoint, DotNetNuke, Drupal, Structs, etc. XML family technologies and XML based application protocols Service Oriented Architecture and web services Cloud computing infrastructure Security infrastructure: SSL, PKI

Multi-Tier (N-Tier) Architecture

Presentation Tier Application Tier Application Server Data Source Tier Relational Databases


Windows applications Mobile devices


Data Warehouse

Communication Server



Web 2.0

A general and loose concept for recent advancements (roughly from 2005) of the World Wide Web


Human behavior aspect of Web 2.0: massive user participation, contribution, sharing, and collaboration

User generated content: Wiki, blog, video, news, reviews, etc. Social networking Folksonomy (tagging)

Technical Aspect of Web 2.0

Rich interface, more responsive and interactive; brings desktop experience to the web

AJAX (Asynchronous JavaScript and XML), Flash, Silverlight Content push: Google Finance In-page navigation (MDI, TDI): Yahoo Mail, Zimbra, Google Docs, etc.

Content and service aggregation and integration

XML (family), RSS, JSON Portal Web services: Amazon Web Services Lightweight Web APIs: Google search API Mash-up: housingmaps.com

Web 2.0 Applications


Summary: Web Application Technology Trend

Web client

Browser any other application

Web server

One server handles all multiple distributed and specialized servers

Web content

HTML XML, XHTML, CSS, embedded content (Flash etc.), scripts

Web protocol

HTTP working with other protocols (video streaming, email, etc.)


Physical document virtual entry point (resource identifier)



Key Concepts

Internet, web Web site, web page, web application, web service Web server, browser HTTP, URL, Domain, IP, DNS, Protocol HTML, DHTML, CSS, XML Client side, server side Multi-tier (n-tier) system, application server ASP.Net, Java (JSP) Web 2.0, API, AJAX