SESSION 1- INTRODUCTION TO WEB ENGINEERING

Engr. Adnan Zafar

Learning Objectives2

Be able to understand the concepts, principles and methods of Web Engineering

Be familiar with current Web technologies

Be familiar with HTML Basics Able to write a Basic HTML code

Web Engineering

Web engineering actively promotes systematic, disciplined and quantifiable approaches towards successful development of high-quality, ubiquitously usable Web-based systems and applications.

Web engineering is multidisciplinary and encompasses contributions from diverse areas: systems analysis and design, software engineering, hypermedia/hypertext engineering, requirements engineering, human-computer interaction, user interface, information engineering, information indexing and retrieval, testing, modeling and simulation, project management, and graphic design and presentation.

3

4

What is the Internet? a network of networks – an inter-network, or Internet

What are Internet protocols? the rules for transferring information between programs HTTP - hypertext transfer protocol FTP - file transfer protocol SMTP – simple mail transfer protocol

What is the World Wide Web? a set of HTML pages accessible using the HTTP protocol

The Internet/ Protocols/ WWW

The Internet

An internet is network of networks. In simple words it is a set of protocols (rules) for transmitting and exchanging data between networks.

Terminologies: W W W – World Wide Web. HTML – HyperText Markup Language – The Language of

Web Pages on the World Wide Web. HTML is a text formatting language. URL – Uniform Resource Locator. Browser – A software program which is used to show web

pages.

5

How the WWW works6

How does a Web Browser (Firefox) fit in this picture?

- your browser connects, using the HTTP protocol, to a web server- the web server fetches an HTML web page and sends the HTML to your browser- your browser turns the HTML page into a nice-looking page on your screen

Client Server and TCP&IP

A client is a computer that requests something from another computer.

A server is a computer that responds to requests for service from client.

TCP/IP (Transmission Control Protocol/Internet Protocol) is the standard rule set for the Internet communication.

7

The World Wide Web

The World Wide Web, also called the WWW or simply the Web, dates back only to 1989, when it was proposed by Tim Berners-Lee.

The World Wide Web is composed of several different components.

HTML is only one of those components. The other components include:

8

WWW Server

WWW Servers are the information providers. They can run on just about any platform. Netscape, Spry, Open Text, Basis, Explorer and other companies provide commercial servers at reasonable prices.

WWW Browsers

Browsers are the information retrievers. HTTP

It is the Hyper Text Transfer Protocol. It defines how information is transferred between server and browser.

SGML

SGML is the Standard Generalized Markup Language. It is ISO Standard 8879:1986. It provides rules for tagging data.HTML is an application of it.

CGI

The Common Gateway Interface is programming for the Web. URLs

WWW browsers use a Uniform Resource Locator to identify the location of an object. Object can be a file, a picture, a movie or just about anything.URL contain three pieces of information.

Protocol / machine name path name of the object http://www.uit.edu/contactus.htm

9

URL(Uniform Resource Locator) URL contains three pieces of

Information:

PROTOCOL/MACHINE NAME/PATH NAME OF THE OBJECT

http://www.yahoo.com/zubair.html

10

HTML Configuration11

Basics of HTML

HTML is set of instructions. HTML Stands for Hypertext Markup Language. Each instruction for Example <TITLE>, is called element.HTML is a programming language of sorts. The instructions are not compiled by a traditional compiler but rather by a WWW browser.

Some element can have qualities called attributes. All elements are enclosed in <> brackets. Most

elements require start and end tag. The start tag for TITLE looks like <TITLE> and end tag looks like </TITLE>.

12

Contd…

The groups of elements are as follows: The HEAD elements The BODY elements

Within the BODY section, elements are broken into groupings: Character, Image, List, Figure, Table, Math, and Form elements.

13

The <HTML> elements

The <HTML> element encloses the entire HTML document .The start tag <HTML> should be the first thing in HTML file and </HTML> should be the last one. Though it is optional but should be used.

The <HEAD> Elements The <HEAD> element encloses the head section of the document.

The title is always in the Head section. It is also optional.

The <TITLE> Elements This element denotes the title of the documents.

14

Contd…

The <BODY> Element The BODY Elements encloses the body section of the

document. Most elements are found within the <BODY> element.

The <H1> Element The <H1> element is used to denote the first level

headline of an HTML document. There are six levels of headlines.

All headlines must have end tags. The <B> Element The <B> element indicates that all characters between

the starting tag <B> and ending tags </B> are to be bold.

15

Contd…

The <P> Elements The <P> Elements denotes the start of a new

paragraph. The browser adds a blank at the point of tag <P> in order to separate two paragraphs.

The <A> Element The <A> is used to add a hyperlink to the

document. The important attribute is HREF. The HREF attributes gives the location of the document to go to when the link is selected.

<a href="http://www.hotmail.com">This is a link</a>

16