Web Engineering

Chapter 1
 Course Objectives

The Objectives of this course are:

1. To study the fundamentals of web engineering
2. To study current technologies for developing web applications
3. To apply current technologies in developing web-applications and
web services
What are Web Applications?
Applications accessed with Web browsers over networks such as the
Internet or intranet.
Access typically requires human intervention
What are Web Services?
Software systems designed to support interoperable Machine to
Machine interaction over a network.
Access typically does not require human intervention
 Course Learning Outcomes

After completing this course, the student should

be able to:
Perform analysis modeling and design modeling for web applications.
Identify candidate tools and technologies for developing web applications.
Develop user-interfaces for web applications
Describe and transform data using XML and its related technologies
Develop web applications and web services.

SWE 444: Internet & Web Application 0.3

Development
 Software Proje ct SuccessRate
Data on 280,000 projects completed in 2000 - Standish
Group Data
 Definition of Software Engineering

• Software Engineering is defined as the

application of science and mathematics by
which the capabilities of computer equipment
are made useful to man via computer
programs, procedures, and associated
documentation.
 What is Web Engineering?

“The application of systematic and

quantifiable approaches to cost-effective
analysis, design, implementation, testing,
operation, and maintenance of high-quality
Web applications.” – Kappel et al.
Extends Software Engineering to Web
applications, but with Web-centric
approaches.
 Definition of Web Engineering

• Web Engineering is the application of

systematic and quantifiable approaches
(concepts, methods, techniques, tools) to cost‐
effective requirements analysis, design,
implementation, testing, operation, and
maintenance of high‐quality Web applications.
 A Survey by theCutter Consortium

• The top problem areas of large‐scaleWeb

application projects
– Failure to meet business needs(84%)
– Project schedule delays (79%)
– Budget overrun (63%)
– Lack of functionalities (53%)
– Poor quality of deliverables(52%)
 Chapter 1:Web-Based Systems

• In the early days of the Web, we built systems

using informality, urgency, intuition, andart
– Informality leads to an easy work environment—one in which
you can do your own thing.
– Urgency leads to action and rapid decision making.
– Intuition is an intangible quality that enables you to “feel” your
way through complexsituations.
– Art leads to aesthetic form and function—to something that
pleases those who encounterit.

• Problem is—this approach can and often does

lead to problems
 TheWeb

• An indispensable technology
– In virtually every aspect of modern living

• A transformative technology
– Changes the way we dothings
– Changes the way we acquire and disseminate information

• An evolving technology
• Bottom line—high impact on everyone in the
modern world
 Defining Web Applications

A Web application is a system that utilizes

W3C standards & technologies to deliver
Web-specific resources to clients (typically)
through a browser.
A strict definition that ensures software and UI aspects of the Web are
examined carefully
Technology + interaction.
Web site with no software components?
Web services?
 WebApps

• The term Web application(WebApp)

encompasses:
– everything from a simple Web page that might help a
consumer compute an automobile lease payment to a
comprehensive website that provides complete travel
services for business people andvacationers.
– Included within this category are complete websites,
specialized functionality within websites, andinformation‐
processing applications that reside on the Internet or on
an Intranet or Extranet.
 WebApp Attributes

• Network intensiveness • Content sensitive

• Concurrency • Continuous evolution
• Unpredictable load • Immediacy
• Performance • Security
• Availability • Aesthetics
• Data driven
 WebApp Types

• Informational • Transaction‐oriented
• Download • Service‐oriented
• Customizable • Portals
• Interaction • Database access
• User input • Data warehousing
 The Case for Web Engineering

Application development on the Web remains

largely ad hoc.
Spontaneous, one-time events
Individual experience
Little or no documentation for code/design
Short-term savings lead to long-term
problems in operation, maintenance,
usability, etc.
Because Web apps are so interdependent, the
problem is compounded.
 The Case for Web Engineering (cont.)

Root Causes of poor design

Development as an authoring activity
Development is “easy”
Techniques that should not be used are misapplied.
Techniques that should be used are not.
Particularly alarming given…
Most projects are now Web-based
More “mission-critical” apps moving to the Web
 The Case for Web Engineering (cont.)

Top project pitfalls (Cutter, 2000)

84% - Failure to meet business objectives
79% - Project schedule delays
63% - Budget overrun
53% - Lack of functionality
Web Engineering’s solution:
Clearly defined goals & objectives
Systematic, phased development
Careful planning
Iterative & continuous auditing of the entire process
 Categories of Web
Applications Ubiquitous Semantic
Web

Social Web
Collaborative
Complexity

Workflow
Based
Portal
Transactional
Oriented

Interactive

Doc-Centric

Development History
COMPLEXITY UBIQUITOUS
• Location-Aware Service SEMANTIC WEB
• Multi-Platform Delivery
• Knowledge Management
• Customize dService
• Recommender System
• Syndication

COLLABORATIVE SOCIAL WEB

• Chat room • Virtual Shared Workspace
• E-Learning Platform • Collaborative Filtering
• P2P-Service • Weblogs

WORKFLOW-BASED
• E-Government
• B2B Solution
TRANSACTIONAL•Patient Workflow PORTAL-ORIENTED
• Community-Portal
• Online Banking • Online Shopping Mall
• Online Shopping • Business Portal
• Booking System

INTERACTIVE
• Virtual Exhibition
• News Site
• Travel Planning

DOCUMENT-CENTRIC
• Static Homepage
• Web Radio
• Company Web Site

DEVELOPMENT HISTORY
Categories of WebApplications
 Document-Centric Web sites

Precursors to Web applications

Static HTML documents
Manual updates
Pros
Simple, stable, short response times
Cons
High management costs for frequent updates & large collections
More prone to inconsistent/redundant info
Example: static home pages
 Interactive & Transactional

Come with the introduction of CGI and HTML forms

Simple interactivity
Dynamic page creation
Web pages and links to other pages generated dynamically based on
user input
Content updates -> Transactions
Decentralized
Database connectivity
Increased complexity
Examples: news sites, booking systems, online banking
 Workflow-Based Applications

Designed to handle business processes across

departments, organizations & enterprises
Business logic defines the structure
The role of Web services
Interoperability
Loosely-coupled
Standards-based
Examples: B2B & e-Government
High complexity; autonomous entities
 Collaborative & Social Web

Unstructured, cooperative environments

Support shared information workspaces to create, edit and manage
shared information
Interpersonal communication is paramount
Classic example: Wikis
The Social Web
Anonymity traditionally characterized WWW
Moving towards communities of interest
Examples: Blogs, collaborative filtering systems, social bookmarking
(e.g., del.icio.us)
Integration with other forms of web applications (e..g, NetFlix)
 Portal-Oriented

Single points-of-entry to heterogenous

information
Yahoo!, AOL.com, portal.kfupm.edu.sa
Specialized portals
Business portals (e.g., employee intranet)
Marketplace portals (horizontal & vertical)
Community portals (targeted groups)
 Ubiquitous

Customized services delivered anywhere via

multiple devices
HCI is critical
Limitations of devices (screen size, bandwidth?)
Context of use
Still an emerging field; most devices have
single focus:
Personalization
Location-aware
Multi-platform delivery
 Semantic Web

Berners-Lee: Information on the Web should

be readable to machines, as well as humans.
Using metadata and ontologies to facilitate
knowledge management across the WWW.
Content syndication (RSS, Atom) promotes re-
use of knowledge
Is the Semantic Web even possible?
 Characteristics of Web Apps

How do Web applications differ from

traditional applications?
Or, another way, what Software Engineering
methods & techniques can be adapted to
Web Engineering?
3 dimensions of the ISO/IEC 9126-1 standard
Product
Usage
Development
 Characteristics - Product

Product-related characteristics constitute the “building

blocks” of a Web application
Content
Document character & multimedia (# of dimensions?)
Quality demands: current, exact, consistent, reliable
Navigation Structure (Hypertext)
Non-linearity
Potential problems: Disorientation & cognitive overload
User interface (Presentation)
Aesthetics
Self-explanation
 Characteristics - Usage

Much greater diversity compared to traditional non-Web

applications
Users vary in numbers, cultural background, devices, h/w, s/w, location
etc
Social Context (Users)
Spontaneity - scalability
Heterogeneous groups
Technical Context (Network & Devices)
Quality-of-Service
Multi-platform delivery
Natural Context (Place & Time)
Globality
Availability
 Characteristics - Development

The Development Team

Multidisciplinary – print publishing, s/w devt, marketing & computing, art &
technology
Community (including Open Source)
Technical Infrastructure
Lack of control on the client side
Immaturity
Process
Flexibility
Parallelism
Integration
Internal – with existing legacy systems
External – with Web services
Integration issues: correct interaction, guaranteed QoS
 Why WebEngineering?

• As WebApps become larger and more complex,

– Informality remains, but some degree of requirements
gathering and planning arenecessary
– Urgency remains, but it must be tempered by a recognition that
decisions may have broadconsequences
– Intuition remains, but it must be augmented by proven
management and technicalpatterns
– Art remains, but it must be complemented with solid design

• Bottom line:
– we must adapt the old‐school approach to the realities of a Web
2.0 world