WEB ENGINEERING

Engr. Muhammad Umer Haroon

LEC 1a
• Modern Web applications are full-fledged, complex software systems.
Therefore, the development of Web applications requires a
methodologically sound engineering approach.

• Based on Software Engineering, Web Engineering comprises the use

of systematic and quantifiable approaches in order to accomplish the
specification, implementation, operation, and maintenance of high
quality Web applications.
• Originally the Web was designed as a purely informational medium, it
is now increasingly evolving into an application medium (Ginige and
Murugesan 2001a, Murugesan et al. 1999).
•
Web applications today are full-fledged, complex software systems
providing interactive, data intensive, and customizable services
accessible through different devices; they provide a facility for the
realization of user transactions and usually store data in an underlying
database (Kappel et al. 2002).
WHAT A WEB DEVELOPER SHOULD KNOW
Web - Basic Concepts
• What is Internet?

• The Internet is essentially a global network of computing resources.

Internet Based Services:
 Email: A fast, easy, and inexpensive way to communicate with other
Internet users around the world.

 Telnet: Allows a user to log into a remote computer as though it

were a local system.

 FTP: Allows a user to transfer virtually every kind of file that can be
stored on a computer from one Internet-connected computer to
another….
What is WWW?
 This stands for World Wide Web.

 A technical definition of the World Wide Web is :

◦ all the resources and users on the Internet that are using the
Hypertext Transfer Protocol (HTTP).
 A broader definition comes from the organization that Web inventor Tim Berners-Lee helped found,
the World Wide Web Consortium (W3C):

◦ The World Wide Web is the universe of network-

accessible information, an embodiment of human
knowledge.
• In simple terms, The World Wide Web is a way of exchanging
information between computers on the Internet, tying them together
into a vast collection of interactive multimedia resources.
What is HTTP?
• This stands for HyperText Transfer Protocol.

• This is the protocol being used to transfer hypertext documents that

makes the World World Wide possible.

• A standard web address such as http://www.yahoo.com/ is called a

URL and here the prefix http indicates its protocol
What is URL?
 URL stands for Uniform Resource Locator, and is used to specify
addresses on the World Wide Web.

 A URL is the fundamental network identification for any resource

connected to the web (e.g., hypertext pages, images, and sound
files).

 A URL will have the following format:

protocol://hostname/other_information
URI

?
 The protocol specifies how information from the link is transferred.

 The protocol used for web resources is HyperText Transfer Protocol (HTTP).

 The protocol is followed by a colon, two slashes, and then the domain name.
In general circles, a protocol is the set of rules governing a conversation
between people

We have seen that the client and server carry on a machine-to-machine

conversation

A network protocol is the set of rules governing a conversation between a

client and a server

There are many protocols, HTTP is just one

What is Website?
 A Website is a collection of various pages written in HTML with an
address e.g http://www.google.com.pk.

 This is a location on the web where people can search on latest

technologies.

◦ Similar way there are millions of websites available on the web.

 Each page available on the Website is called a web page and first
page of any web site is called home page/landing page for that site.
What is Web Server?
 Every Web site sits on a computer known as a Web server.

 This server is always connected to the internet.

 Every Web server that is connected to the Internet is given a unique address made up
of a series of four numbers between 0 and 256 separated by periods.

◦ for example, 68.178.157.132 or 68.122.35.127.

 When you register a Web address, also known as a domain name, such as
google.com.pk you have to specify the IP address of the Web server that will host the
site.
What is Web Browser?
 Web Browsers are software installed on your PC.

 To access the Web you need a web browsers, such as Google

chrome, Microsoft Internet Explorer or Mozilla Firefox.

 Currently you must be using any sort of Web browser while you are
navigating through any site.

 On the Web, when you navigate through pages of information this is

commonly known as browsing or surfing.
What is SMTP Server?
• This stands for Simple Mail Transfer Protocol Server.

• This takes care of delivering emails from one server to another server.

• When you send an email to an email address, it is delivered to its

recipient by a SMTP Server.
What is ISP?
• This stands for Internet Service Provider.

• They are the companies who provide you service in terms of internet
connection to connect to the internet.
What is HTML?
 This stands for HyperText Markup Language.

 This is the language in which we write web pages for any Website.

 This is a subset of Standard Generalized Mark-Up Language (SGML)

for electronic publishing, the specific standard used for the World
Wide Web.
What is Hyperlink?
• A hyperlink or simply a link is a selectable element in an electronic
document that serves as an access point to other electronic
resources.

• Typically, you click the hyperlink to access the linked resource.

• Familiar hyperlinks include buttons, icons, image maps, and clickable

text links.
What is DNS ?
 DNS stands for Domain Name System.

 When someone types in your domain name, www.example.com,

your browser will ask the Domain Name System to find the IP that
hosts your site.

 When you register your domain name, your IP address should be put
in a DNS along with your domain name.

 Without doing it your domain name will not be functioning properly.

What is W3C?
 This stands for World Wide Web Consortium (‫ )جماعت‬which is an international
consortium of companies involved with the Internet and the Web.

 The W3C was founded in 1994 by Tim Berners-Lee, the original architect of the
World Wide Web.

 The organization's purpose is to develop open standards so that the Web

evolves in a single direction rather than being splintered among competing
factions.

 The W3C is the chief standards body for HTTP and HTML.
Web - How it works ?
 On the simplest level, the Web physically consists of following components:

◦ Your personal computer - This is the PC at which you sit to see the web.

◦ A Web browser - A software installed on your PC which helps you to browse the Web.

◦ An internet connection - This is provided by an ISP and connects you to the internet to reach
to any Web site.

◦ A Web server - This is the computer on which a web site is hosted.

◦ Routers & Switches - They are the combination of software and hardware who take your
request and pass to appropriate Web server.
• The Web is known as a client-server system.

• Your computer is the client and the remote computers that store
electronic files are the servers.
Here's how web works:
 When you enter something like http://www.google.com, the request
goes to one of many special computers on the Internet known as
Domain Name Servers (DNS).

 All these requests are routed through various routers and switches.

 The domain name servers keep tables of machine names and their IP
addresses, so when you type in http://www.google.com, it gets
translated into a number, which identifies the computers that serve
the Google Web site to you.
 When you want to view any page on the Web, you must initiate the
activity by requesting a page using your browser.

 The browser asks a domain name server to translate the domain

name you requested into an IP address.

 The browser then sends a request to that server for the page you
want, using a standard called Hypertext Transfer Protocol or HTTP
 The server should constantly be connected to the Internet, ready to serve
pages to visitors.

 When it receives a request, it looks for the requested document and

returns it to the Web browser.

 When a request is made, the server usually logs the client's IP address, the
document requested, and the date and time it was requested.

 This information varies from server to server.

 An average Web page actually requires the Web browser to request more
than one file from the Web server and not just the HTML page, but also
any images, style sheets, and other resources used in the web page.

 Each of these files including the main page needs a URL to identify each
item.

 Then each item is sent by the Web server to the Web browser and Web
browser collects all this information and displays them in the form of Web
page.
In short:
 We have seen how a Web client - server interaction happens. We can summaries these steps as
follows:

◦ A user enters a URL into a browser (for example, http://www.google.com). This request is passed to a
domain name server.

◦ The domain name server returns an IP address for the server that hosts the Web site (for example,
68.178.157.132).

◦ The browser requests the page from the Web server using the IP address specified by the domain name
server.

◦ The Web server returns the page to the IP address specified by the browser requesting the page. The
page may also contain links to other files on the same server, such as images, which the browser will
also request.

◦ The browser collects all the information and displays to your computer in the form of Web page.
 Web - Site Advantages
 Business is open 24x7 :

◦ This means that once you put your business onsite then your business is open 7 days a week and
365 days a year. Even if you are in different locations of the world then you will be able to server
your customers on 24x7 Hours basis.

 Increased Customer Base:

◦ Because anyone in the world can see your web site so you will gain customers from other states
and countries while you are putting in the same amount of effort and money.

 Tremendous Cost Saving :

◦ This is one of the biggest advantages of having a business online. You do not need to keep a big
man power and lot of resources to maintain a business on site. There are many other cost saving
opportunities while keeping business online. Think of how many cards you mail out to let
customers know about your sale. All of that can be eliminated by putting the sale information on
your web site and inviting your customers to visit it.
 Advertising Opportunities:

◦ Apart from saving your advertising cost you have additional opportunities to run
advertisements from other companies and start making money. If you ever advertised in a
local newspaper, you know the costs. You are being charged per line, per inch, and per color.
On the Web, there is no limit to how much you can put. So whenever there is new product or
service then you can advertise it in better way.

 Creates a Brand Image:

◦ Internet is a great medium through which you can create any image of yourself you want. It is
all in your hands: design a professional web site, add helpful content, and your company will
immediately take a step up in the image it represents. No matter how small your business is,
with the right tools and a great desire you can make it look like a corporation on the Web.
 Customer Satisfaction:

◦ If you have a really good site online then you can give your customer a lot of satisfaction in
terms of customer care. You can keep online help, FAQ, and other important information
which is useful for your customers. You can create online forums for open discussion and you
can conduct customer survey to take customer feedback etc.

 Showcase your work:

◦ Whether you are a real estate agent, construction business owner or a beauty salon specialist
- you can put your work on display when you have a web site. Anytime a potential client wants
to see your past work and projects, simply refer him or her to your site. No need to scan and
mail pictures, or bring your client to a finished building project.
Web - Skills Required
• This is not required that you should have knowledge of all the listed
skills.

• If you want to develop a simple Web site then you would needs just
few skills listed here.

• Rest of the skills are required if you want to go for a bigger and more
interactive Web site.
 Computer Operations

 Remote Access: Most of the times your Web Server will be accessed from
remote site only.

◦ You should be well aware how to connect a computer from remote site.

◦ So at least you should have basic knowledge of telnet utility to connect to a remote
machine.

◦ There are many service providers who will provide you control panel to manage your
Web site.
 File Uploading & Downloading: As I told you most of the times your Web Server will be
on remote site.

◦ So you would need to upload and download all the files related to your Web site.

◦ So at least you should have basic knowledge of FTP utility to connect to a remote machine and
download or upload your files.

◦ Almost service providers give you facility to upload your files on your Web server.

 HTML Knowledge: These are the markup languages which you will use to build your
web site.

◦ So you should have good understanding on these languages.

 CSS Knowledge: Cascading Style Sheet knowledge is required to
achieve many results which are not possible through HTML or
XHTML.

 PHP Script: Now a days many sites are being developed using PHP
language.

◦ This script helps you to create an interactive Web site.

Web Hosting
Development of the website
 Web Development/Designing Environments

l Paid
l Dreamweaver CS6
l Microsoft .Net Studio
l Donation Based
l Eclipse (neon)
l Free
l Notepad++ (Preferable)
l Vim
Web - Domain Names
 A domain name is the part of your Internet address that comes after
"www".

◦ For example, in www.google.com the domain name is google.com.

 A domain name becomes your Business Address so care should be

taken to select a domain name.

◦ Your domain name should be easy to remember and easy to type.

How to get a domain name ?
 When you plan to put a site online, this is one of the important steps to
buy a domain name.

 This is always not necessary that whatever domain name you are looking
that is available so in that case you will have to opt for any other good
domain name.

 When you buy a domain name it is registered and when domain names
are registered they are added to a large domain name register, and
information about your site
 - including your Internet IP address is stored on a DNS server and your
contact information etc is registered with your registrar.
Domain Extension Types:
 There are many different types of domain extensions you can choose for your domain
name.

 This depends on your business nature.

 If you are going to register a domain name for educational site purpose then you can go
for .edu extension.

 But there is no hard and fast rule to go for any extension.

 Most commonly used is .com

 .com - Stands for company/commercial, but it can be used for any web site.

 .net - Stands for network and is usually used for a network of sites.

 .org - Stands for organization and is supposed to be for non-profit bodies.

 .us, .pk - They are based on your country names so that you can go for country specific domain extensions.

 .biz - A newer extension on the Internet and can be used to indicate that this site is purely related to business.

 .info - Stands for information. This domain name extension can be very useful, and as a new comer it's doing well.

 .tv - Stands for Television and are more appropriate for TV channel sites.
Choosing Domain Name
 This is very important step to name your web site.

 As I have told you that your domain name will be your business address so
very much care should be taken while choosing a domain name.

 Many people think it is important to have keywords in a domain.

 Keywords in the domain name are usually important, but it usually can be
done while keeping the domain name short, memorable, and free of
hyphens.
 Using keywords in your domain name give you a strong competitive advantage
over your competitors.

 Having your keywords in your domain name can increase click through rates on
search engine listings and paid ads as well as make it easier to Using your
keywords in getting keyword rich descriptive inbound links.

 Avoid buying long, and confusing domain names.

 In the past the domain name itself was a significant ranking factor but
now search engines have advanced it is not very significant factor
anymore.

 Keep two to three words in your domain name it will be more memorable.

 Some of the most memorable web sites do a great job of branding by

creating their own word.

 Few examples are eBay, Yahoo!, Wikipedia, Google...

 What are Sub Domains
 You can divide your domain into many sub domains based on your requirement.

 If you are doing multiple business using the same domain then its worth to use sub domain
for every business.

 Following are examples of sub domains

 You must have seen http://www.google.com as a main domain but google has created many
subdomains based on their business.

 Few of them are as follows:

◦ http://adwords.google.com - This sub domain is being used for Google Adwords.

◦ http://groups.google.com - This sub domain is being used for Google Groups.
◦ http://images.google.com - This sub domain is being used for Google Images.
 Web - Site Construction, What to put on your web site ?
 This totally depends on your business and nature of your web site.

 Here is a list of pages that you might want to create for your web site.

◦ Attractive Home Page : Always required for every web site.

◦ List of Product and Services along with complete detail.

◦ Complete Pricing Information.

◦ About your company and nature of business including your achievements.

◦ About your staff and if possible their experience.

◦ Your complete contact information.

◦ Frequently Asked Questions.

◦ Success Stories and Feedback from Customers.

How to design your web site ?
 You should not simply start developing your web site otherwise you will end up with a bogus web
site.

 First you should put a complete plan and your design on a paper or in an electronic document.

 Here are few points which can help you to design a better web site:

◦ Consider what technology you are going to use to develop your web site.
 Adopt one which gives you better flexibility and rapid development opportunities and then design it accordingly.

◦ Design a generic framework so that in future you can enhance and modify your web site by putting minimal
effort.

◦ Design a site to keep required performance in your mind.

 If you are designing database driven web site then lot of effort has to put to design good database schemas.
◦ Keep your design as simple as possible so that any new developer should become familiar with your
design as soon as possible.

◦ Identify repeatable components of your web site and then keep them separate and try to use them
wherever possible.

◦ Identify the nature and qualification of your site visitors and give importance to look and feel
accordingly.

◦ Think in a way, if you are a site visitor then what and how would you like to see this web site? If same
site belongs to somebody else then would you like to spend some time on such site ?

◦ Once again....your presentation should be unique and attractive otherwise there are lot of web sites
available on the Internet and it will be difficult for your to retain a site visitor for more than a minute.
How to make web site interactive ?
 Many statistics show that if you are able to retain your site visitors
for a long time then they do bigger shopping and come again and
again.

 So make sure you have done something for your site visitors to do on
your web site.

 Though offering a lot of quality information can also serve as a great

visitor magnet and will generate more repeat visits.
 Here is a list of interactive tools you can add to your web site completely FREE and
without any programming skills:

◦ Poll

◦ Forum

◦ Guest book

◦ Chat room

◦ Greeting cards

◦ Tell-a-friend about this site

◦ Feedback form

◦ Live customer service

◦ Daily joke or daily cartoon

◦ Daily news headlines

◦ Site Search Engine

◦ Frequently Asked Questions