Web Developers Guide Tutorial
Web Developers Guide Tutorial
Audience
This tutorial is aimed at students who are interested in learning website
development. It provides an in-depth coverage starting from basics to Hosting
concepts. In addition, it throws light on emerging concepts like E-commerce.
Prerequisites
It is an elementary tutorial and you can easily understand the concepts explained
here with a basic knowledge of computers.
Table of Contents
About the Tutorial .................................................................................................................................. i
Audience ................................................................................................................................................ i
Prerequisites .......................................................................................................................................... i
Copyright & Disclaimer ........................................................................................................................... i
Table of Contents .................................................................................................................................. ii
1.
2.
ii
3.
4.
5.
6.
7.
8.
9.
iii
10.
11.
12.
13.
14.
15.
16.
iv
What is Internet?
The Internet is essentially a global network of computing resources. You can think
of the Internet as a physical collection of routers and circuits as a set of shared
resources.
Some common definitions given in the past include:
Internet-Based Services
Some of the basic services available to Internet users are:
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?
WWW 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 BernersLee helped found, the World Wide Web Consortium (W3C): The World Wide Web
is the universe of network-accessible information, an embodiment of human
knowledge.
1
What is HTTP?
HTTP stands for Hypertext Transfer Protocol. This is the protocol being used to
transfer hypertext documents that makes the World Wide Web 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
The protocol specifies how information is transferred from a link. The protocol
used for web resources is HyperText Transfer Protocol (HTTP). Other protocols
compatible with most web browsers include FTP, telnet, newsgroups, and Gopher.
The protocol is followed by a colon, two slashes, and then the domain name. The
domain name is the computer on which the resource is located.
Links to particular files or subdirectories may be further specified after the domain
name. The directory names are separated by single forward slashes.
What is Website?
Currently you are on our website http://www.tutorialspoint.com which is a
collection of various pages written in HTML markup language. This is a location on
the web where people can find tutorials on latest technologies. Similarly, 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
website is called home page for that site.
What is ISP?
ISP stands for Internet Service Provider. They are the companies who provide you
service in terms of internet connection to connect to the internet.
You will buy space on a Web Server from any Internet Service Provider. This space
will be used to host your Website.
What is HTML?
HTML stands for Hyper Text Markup Language. This is the language in which we
write web pages for any Website. Even the page you are reading right now is
written in HTML.
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?
W3C 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.
On the simplest level, the Web physically consists of the following components:
Your personal computer - This is the PC at which you sit to see the web.
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.
In Short
We have seen how a Web client - server interaction happens. We can summarize
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
Website (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 Browsers are software installed on your PC. To access the Web, you need a
web browser, such as Netscape Navigator, Microsoft Internet Explorer or Mozilla
Firefox.
Currently you must be using any sort of Web browser while you are navigating
through our site tutorialspoint.com. On the Web, when you navigate through
pages of information, this is commonly known as web browsing or web surfing.
There are four leading web browsers: Explorer, Firefox, Netscape, and Safari, but
there are many others browsers available. You might be interested in
knowing Complete Browser Statistics. Now we will see these browsers in bit more
detail.
While developing a site, we should try to make it compatible to as many browsers
as possible. Especially sites should be compatible to major browsers like Explorer,
Firefox, Chrome, Netscape, Opera, and Safari.
Internet Explorer
Internet Explorer (IE) is a product from software giant Microsoft. This
is the most commonly used browser in the universe. This was
introduced in 1995 along with Windows 95 launch and it has passed
Netscape popularity in 1998.
You can download latest version of this browser from Microsoft
site Download Internet Explorer
Netscape
Netscape is one of the original Web browsers. This is what Microsoft
designed Internet Explorer to compete against. Netscape and IE
comprise the major portion of the browser market. Netscape was
introduced in 1994.
You can download latest copy of this browser from Download
Netscape
Every Website 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 255
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
tutorialspoint.com you have to specify the IP address of the Web server that will
host the site. You can load up with Dedicated Servers that can support your webbased operations.
There are four leading web servers: Apache, IIS, lighttpd and Jagsaw. Now we will
see these servers in bit more detail.
Apart from these Web Servers, there are other Web Servers also available in the
market but they are very expensive. Major ones are Netscape's iPlanet, Bea's Web
Logic and IBM's WebSphere.
lighttpd
The lighttpd, pronounced lighty is also a free web server that is
distributed with the FreeBSD operating system. This open source
web server is fast, secure and consumes much less CPU power.
Lighttpd can also run on Windows, Mac OS X, Linux and Solaris
operating systems.
You can have detailed information about this server at lighttpd
Sun Java System Web Server
This web server from Sun Microsystems is suited for medium and
large websites. Though the server is free it is not open source. It
however, runs on Windows, Linux and Unix platforms. The Sun Java
System web server supports various languages, scripts and
technologies required for Web 2.0 such as JSP, Java Servlets, PHP,
Perl, Python, Ruby on Rails, ASP and Coldfusion etc.
You can have detailed information about this server at Sun Java
System Web Server
Jigsaw Server
Jigsaw (W3C's Server) comes from the World Wide Web
Consortium. It is open source and free and can run on various
platforms like Linux, Unix, Windows, Mac OS X Free BSD etc.
Jigsaw has been written in Java and can run CGI scripts and PHP
programs.
You can have detailed information about this server at Jigsaw
Server
11
If you are constructing a Website, then we hope you are aware of its advantages
as well. Here, in this chapter, we have listed out a few major advantages of
keeping a website.
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 a new product or service, then you can advertise it in a
better way.
Customer Satisfaction
If you have a really good site online, then you can give your customers 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.
13
If you are planning to maintain a Website, then you would require a specific set
of skills. This skillset can be endless because today, there are numerous
technologies available and many are coming everyday. So you have to plan and
affirm on any one of the available technologies and go ahead for your project.
This is not required that you should have knowledge of all the listed skills. If you
want to develop a simple Website, then you would needs just first four skills listed
here. Rest of the skills are required if you want to go for a bigger and more
interactive Website.
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 Website.
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 Website. 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 / XHTML Knowledge: These are the markup languages which you
will use to build your website. So you should have good understanding on
these languages. You can refer our tutorial to learn HTML / XHTML.
14
PHP Script: Now-a-days many sites are being developed using PHP
language. This script helps you to create an interactive Website. You can
refer our tutorial to learn PHP Script.
Flash Knowledge: You can plan to use Macromedia Flash to build your
Website. This is a bit time consuming to learn this technology but once you
learnt then you can develop very beautiful and attractive websites using
Flash.
HTTP Protocol: As you grow you are desired to have more knowledge
about Web. So I would suggest you to go through the web backbone i.e.
HTTP protocol as well. You can refer our tutorial to learn HTTP Protocol.
15
As a basic necessity, you need a good internet connection from a reliable service
provider which provides decent connectivity and speed. Evaluate vendors based
on their services and support before selecting. Here due diligence plays a major
part.
The following tools and infrastructure will help you in developing a Website:
Internet Connection: If you are not connected to the internet and you
received this tutorial printed on a paper then I would say that this is second
and another most important tool would need to connect to the Internet and
to you Web Server where you will host your website. For this purpose you
can buy either a dial up connection or broadband connection of high speed
connectivity based on your requirement and budget.
A Web Server: Apart from basic Internet connectivity you will need one
Web Server to keep all the files related to your Website. So you would need
to buy space on a Web Server. There are millions of ISPs who are in
business of selling web space at competitive prices. We will give more detail
on this in Web Hosting Concepts chapter.
A Text Editor: This is another most important tool which you will need to
develop your Website. If you are using Windows then you can
use notepad as a text editor, or if you are using Linux/Unix then vi editor is
one of my favorite editors. You will need this editor to write your HTML, PHP
or ASP pages or for any other editing purpose. For practice purpose, you
can use our Online HTML Editor.
A Web Browser: You will need this tool to see the result of your HTML file.
So you should have either Internet Explorer or Firefox etc. installed on your
computer.
Web Authoring Tools: If you don't want to use a simple Text Editor to
edit your HTML files then there are many commercial Web Authoring Tools
available. These tools are also called HTML editors. Microsoft's FrontPage
and Macromedia Dreamweaver are both a visual HTML (WYSIWYG) and
HTML source code editor. These editors helps you to develop your HTML
pages vary rapidly.
16
Secure telnet client: If you are connecting to your Web server directly
then you can use a tool called PuTTY. This is what I'm using while
connecting to my web server.
Secure FTP client: If you are connecting to your Web server directly using
FTP client to upload or download your web files then you can use a tool
called PSFTP. FTP stands for File Transfer Protocol. Simply put, after you
design your website, you need to send it to the Web and your FTP program
will do just that for you. This is what I'm using while connecting to my web
server.
17
A domain name is the part of your Internet address that comes after "www". For
example, in www.tutorialspoint.com the domain name is tutorialspoint.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.
.com - Stands for company/commercial, but it can be used for any website.
.net - Stands for network and is usually used for a network of sites.
.us, .in - 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.
18
.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.
Newer domain extensions such as .biz .info and .us etc. have more name choices
available as many of the popular domains have yet to be taken and most of the
them are available at very nominal prices.
This way, you can present your different business sections in a very good
segregated way. It is not a big thing to create a sub-domains. If you already have
registered a domain, then your registrar will provide you a way to create subdomains. You may need to talk to your registrar for more detail.
20
Now you are ready for a website construction. Before proceeding further, you have
to take many factors into consideration. I cannot list out each and everything but
I have described the major factors in this tutorial which will help you to have a
better website:
Finally, make your site useful and interesting for your customers. Your site visitors
are your customers and they should find each and everything they are looking for.
Customer satisfaction should be your prime concern.
Consider what technology you are going to use to develop your website.
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 website by putting minimal effort.
21
Keep your design as simple as possible so that any new developer should
become familiar with your design as soon as possible.
Identify the nature and qualification of your site visitors and give
importance to look and feel accordingly.
Think from the perspective of a site visitor. If you were a visitor, then how
would you like to see this website? If the same site belongs to somebody
else, then would you like to spend some time on such site?
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
Mailing List
22
Your site should meet all the quality requirements defined by W3C. Today
we are using XHTML to develop any website. XHTML is just a cleaner version
of HTML.
You should keep validating your source code using W3C Validator.
Keep your style sheets and JAVA or VB scripts into separate files and then
include them where ever is required.
Try to keep your web pages static instead of generating them dynamically.
Test your developed web page in major browsers like Internet Explorer,
Firefox, Mozilla, Netscape, etc.
Test your all the scripts for all the possible scenarios. Do not host any page
without complete testing.
23
24
Web hosting deals with putting the contents of your website on a Web server.
Hosting your website on your own server could be an option. But this will become
very much expensive unless you are hosting a site like yahoo.com or google.com.
So this tutorials does not cover how to set up your own hosting server.
Buying a server space or renting a complete server from an Internet Service
Provider (ISP) is the most widely used option. This section guides you to choose
a hosting type and makes you aware of other related concepts.
Hosting Platforms
You can go for any of the following two most widely used hosting platforms:
Windows Hosting Servers: If you are a Windows lover then you will find
many hosting servers running different flavors of Windows and you can buy
space from these servers. Normally Windows hosting servers are more expensive
because of lot of software licensing costs are involved with these servers.
Linux Hosting Servers: If you want to go for Linux then opportunities are
unlimited and they will have to pay less then what you will pay for Windows
Hosting Server. There are many ISP who provides Hosting Servers with
different flavors of Unix.
Hosting Types
There are many options available and you can select any hosting type based on
your requirement and budget. Following are most widely used hosting types:
Free Hosting
Yes, this is true there are many service providers who will give you free space on
their web server with a condition that you will allow them to run their
advertisement at your web pages. So if you are OK with this option, then you have
nothing to pay for a space. There are some websites like geocities.com, lycos.com,
myspace.com, etc. that give you space to build your web pages.
Shared Hosting
With shared hosting, your website is hosted on a powerful server along with other
websites. On a shared host, you will have your own user ID and password to login
to the shared host and you will be allowed to work in your work area. You would
25
Dedicated Hosting
This type of hosting is very similar to virtual dedicated hosting, but here, a
complete machine will be allotted for you. They are more expensive than virtual
dedicated hosting and should be considered when you have a very high traffic
requirement.
Collocated Hosting
It is very difficult to set dedicated resources such as high-security against fire and
vandalism, regulated backup power, dedicated Internet connections and more.
Collocation is the option which allows you to put your machine in a service
provider's premises to avail all the available facilities. This is also a very expensive
option and should be opted when you have very high traffic requirement.
Hosting Components
When you buy a Web server space, then you should be clear about the follows.
You should do a price comparison between different service providers based on
the following components:
Disc Space
A small or medium website will require between 10 and 100MB of disk space. If
you plan to keep a lot of audio and video on your website, then you need plan to
buy more space. Before buying server space, you should check the options
available to expand your disc space if you need it in future.
Monthly Traffic
A small or medium website will need between 1GB and 10GB of data transfer on
a monthly basis. If you plan to keep a lot of audio and video on your website, then
26
Processing Speed
If you are buying space on a shared machine, then you cannot guess how much
speed will be given to you. In that case, only way is to see other hosted sites with
the same service provider to know about their hosting quality. But if you are
buying virtual dedicated server or dedicated server, then you should consider how
much RAM is being allocated to you. Your pricing will depend on the given
processing power to you.
Connection Speed
Nowadays, most service providers allow very fast connection speed. So choose a
service provider who is giving better connection speed in terms of bits per second.
You can have a connection speed ranging from 64Kb per second to 2.488Gb per
second.
Email Accounts
Make sure you are going to get sufficient number of e-mail accounts. There are
many other options available which come along with your e-mail account. Like,
will you get IMAP, POP and E-mail Forwarding options available along with your email facilities.
Emailing Support
Apart form having email accounts, it is also very important that your web server
should have a facility to send emails from back-end. In case your site visitors want
to contact to you using a form, then you will be able to use that emailing facility
to send emails to your designated account. In simple terms, you should make sure
that the SMTP Server is setup and working on your Web server.
Latest Technologies
You should make sure that your web server is equipped with all the latest
technologies. It should have the latest version support for PHP, PERL, ASP and
JAVA, etc.
Databases
There are many databases available MySQL, Oracle, SQL Server, etc. You should
choose your server based on your database requirement. If you are buying space
on a shared server, then you need to verify how much space will be allocated for
your database. Many ISPs do not give more than a limited space for databases. If
27
Server Uptime
It is important that you buy a web server from a reliable and reputed ISP. You
should make sure your ISP is giving you 99.99% server uptime. If the is server
down, then there are many service providers who gives you compensation in case
your sites goes down more than a limited number of time.
Control Panel
Just make sure what type of facilities you will get to maintain your hosting account.
Check if your service provider is providing you an easy-to-use Control Panel or
some other similar tool. Using a Control Panel, you should be able to maintain
basic operations related to your website such as logging your service request, your
reboot request, or any other problem.
Customer Support
Before finalizing a deal with your service provider, you should make sure they
provide you the required support. You can get this information using Internet
forums or from your friends. There are many service providers who give you 24x7
support for any technical or non-technical problem.
28
Customer Registrations
Customer Transactions
Product Catalogs
Customer Orders
Order Security
Server Security
Server Maintenance
Server Backup
Server downtime
Inventory Control
Shipment Methods
Payment Methods
Foreign currency
Credit Cards
Taxes issues
You should take this list and discuss it with your service provider as well to
understand how they will support you to handle all these items.
29
Your server's hard drive crashed. Your site is hacked and the hacker deleted all
your files. Your web host disappeared with your money and your data. Even worse,
there was and earth quack and your ISP building is gone down and everything is
lost.
Touch Wood!!! Nobody should face such a situation. But if you are not prepared
for these situations, your hard work might be lost forever. That is why it is of the
utmost importance that you keep regular backups of your data.
Now there are many questions:
Full Backup - Here all files are written to the backup, even if they already
exist in the most current backup.
Conclusion
It is up to you to decide how you want to take your backup. If you are a website
owner, then you must take regular backup without failure. Else, it might lead to
serious consequences.
31
Once your site is up and running, it is important that you track your visitors and
analyze what they are using. You should have a detailed information on the
following:
Visitors Timestamp:
You should be aware of the time when your site
gets the most number of visitors so that you can plan a server down easily.
Secondly, timestamp and IP address will help you identify your site visitors
in case an investigation is required against a site visitor.
How long do they stay? How much time a visitor spends on your site? If
visitors are leaving your site just after browsing 1 or 2 pages, then you should
come up with some innovative ways to retain them for a longer duration.
Statistics Programs
There are many websites that help you to find out all the information discussed in
the previous section. You just need to keep a small piece of code in the
<head>....</head> section of your web pages and you will have not only all the
above mentioned information but also a complete analysis of your site.
You can try Googles Analytics Program to capture your website statistics.
Another good program is Webalizer. This will give you all the basic site
statistics you need.
There is a site from sourceforge which gives you opportunity to collect your
website statistics. So you can try it as well AWStats.
32
Unique Visits The number of unique visitors you had in a given time
period. Example: if there was only a single person who visited your website,
and visited 1,000 separate times in a day, the unique visits would just be
one. The uniqueness is counted based on the IP address of the visitor.
Total Visits The total number of visits including duplicate visits that a
website receives in a given time period. Each time a site visitor reaches
your site, it is counted as one visit.
Hits Hits are very similar to page views and will be counted every time a
visitor clicks any link related to your website.
Direct Access It refers to the people who accessed your website through
their bookmarks or typed in your URL manually in the URL box of the
browser.
Referrer & Referral URL The web address where the visitor followed a
link to reach your website. For example, if someone finds your website in
google search and clicks over the link to reach your site, then google will
be the referrer.
33
You designed a website and developed it and finally hosted it. Now just think how
many site visitors know about this site address and related service.
If you want to make your site a success, then the actual work starts after hosting
your website successfully. It includes the following actions, but gaining popularity
is certainly not limited to these actions.
Search Engine Inclusion: First step, you should go and include your
website in various search engines like google, yahoo, and msn. Never trust
automated software to include your site in search engines. There are many
fraud companies in this business, so stay away from them and don't waste
your money.
Open directory inclusion: This is another way to make your site popular.
There are many open directory projects like dmoz.com and yahoo.com
where you can include your website to get attention from net surfers.
Google AdWords: This is a paid program from google where you can
register and you can pay based on the number of clicks on your website link
or based on the number of page impressions.
Advertising Programs: If you have a big budget, then you can go for
higher resources like TV ads or Newspaper or magazine advertising
programs. They are most effective and expensive as well.
34
Graphic elements play a crucial role on any website. If you have time and talent
to design your web graphics, then it is great. It does not only require time and
talent to have web graphics, but you need to spend a good deal of money as well
to buy good graphics software like Paint Shop Pro or Adobe Photoshop.
However, if you are not blessed with an artist's hand and you don't have money
as well to spend on buying graphics software, then Internet is the heaven and you
should appreciate thousands of graphics designers who have created free web
graphics for you.
We also have listed tons of Free Graphics for you which you can use on your
website. You will find it here Free Web Graphics. A sample page is also given here.
35
We do hope that you found this tutorial useful and informative. Here we have
covered all the basics of Web and Web Hosting.
Now it is time to move forward and we will encourage you to start developing your
website using our HTML Tutorial.
If you are planning to develop an interactive website, then we recommend you go
through our PERL Tutorial or PHP Tutorial. We have complete reference manuals for
these server-side scripting languages.
Search Engine Optimization techniques are very important and you should be wellversed with them before designing and developing your website. You can go
through our SEO Tutorial to gain a complete understanding of SEO techniques.
Comments and suggestions for the improvement of this tutorial are welcome.
Please
send
us
your
feedback
at
[email protected].
Thank you very much for visiting tutorialspoint.com
36