100% found this document useful (4 votes)
790 views88 pages

Website Development Tutorial

build a website

Uploaded by

D - west
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
100% found this document useful (4 votes)
790 views88 pages

Website Development Tutorial

build a website

Uploaded by

D - west
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 88

Website Development

About the Tutorial


A website can be defined as a collection of several webpages that are all related to each
other and can be accessed by visiting a homepage, using a browser like Internet Explorer,
Mozilla, Google Chrome or Opera.

In this tutorial, we will explain the concept of website development, from the simplest to
the most advanced. It will help novice users to learn all about websites and how they are
designed and maintained. At the same time, this tutorial has enough material to help even
system administrators to broaden their knowledge about websites.

Audience
This tutorial is meant for all those readers who would like to understand the entire process
of setting up a well-designed website. We strongly believe that this tutorial will help almost
everyone who wants to set up a website, without having to take professional guidance
from a technical person.

Prerequisites
We have designed this tutorial, keeping in mind the requirements of beginners, especially
those who come from a non-technical background. Hence, we don’t assume any existing
knowledge of website development from the readers.

Copyright and Disclaimer


© Copyright 2017 by Tutorials Point (I) Pvt. Ltd.

All the content and graphics published in this e-book are the property of Tutorials Point (I)
Pvt. Ltd. The user of this e-book is prohibited to reuse, retain, copy, distribute or republish
any contents or a part of contents of this e-book in any manner without written consent
of the publisher.

We strive to update the contents of our website and tutorials as timely and as precisely as
possible, however, the contents may contain inaccuracies or errors. Tutorials Point (I) Pvt.
Ltd. provides no guarantee regarding the accuracy, timeliness or completeness of our
website or its contents including this tutorial. If you discover any errors on our website or
in this tutorial, please notify us at [email protected].

i
Website Development

Table of Contents
About the Tutorial .................................................................................................................................... i

Audience .................................................................................................................................................. i

Prerequisites ............................................................................................................................................ i

Copyright and Disclaimer ......................................................................................................................... i

Table of Contents .................................................................................................................................... ii

1. WEBSITE DEVELOPMENT ─ INTRODUCTION ........................................................................ 1

2. WEBSITE DEVELOPMENT ─ REQUIRED SKILLS ...................................................................... 4

3. WEBSITE DEVELOPMENT ─ DOMAIN NAME ........................................................................ 6

4. WEBSITE DEVELOPMENT ─ DOMAIN NAME REGISTRATION ................................................ 8

5. WEBSITE DEVELOPMENT ─ SUBDOMAINS ......................................................................... 15

6. WEBSITE DEVELOPMENT ─ DOMAIN PRIVACY ................................................................... 16

7. CONFIGURE DNS RECORD ON A HOSTING PLATFORM....................................................... 20

8. WEBSITE DEVELOPMENT ─ CMS PLATFORMS .................................................................... 23

Choosing the Right Website .................................................................................................................. 23

CMS Platforms ...................................................................................................................................... 24

9. FLAT & DYNAMIC WEBPAGES ............................................................................................ 27

Dynamic Webpages ............................................................................................................................... 28

10. PUBLISHING & DEVELOPMENT TOOLS............................................................................... 30

11. COMMERCIAL & FREE THEMES ......................................................................................... 36

12. CHOOSING A WEB HOSTING COMPANY & A PLAN ............................................................ 37

Choose a Web Hosting Plan ................................................................................................................... 37

ii
Website Development

13. WEBSITE DEVELOPMENT ─ CPANEL ................................................................................... 40

14. WEBSITE DEVELOPMENT ─ WEBSITE SETUP ...................................................................... 44

15. PUBLIC AUTHORITY CERTIFICATES ..................................................................................... 47

Types of Validations .............................................................................................................................. 48

16. PURCHASING A PUBLIC CERTIFICATE ................................................................................. 51

17. E-COMMERCE PLATFORMS ............................................................................................... 53

18. E-COMMERCE PAYMENT GATEWAY .................................................................................. 56

19. SMALL BUSINESS WEBSITE ................................................................................................ 58

20. BACK UP YOUR WEBSITE ................................................................................................... 60

21. WEBSITE DEVELOPMENT ─ WEBPAGE MIGRATION ........................................................... 62

22. TESTING YOUR WEBSITE .................................................................................................... 63

23. WEBSITE DEVELOPMENT ─ SECURITY ................................................................................ 65

24. SPEED UP YOUR WEBSITE .................................................................................................. 69

25. ADVERTISE YOUR WEBPAGE .............................................................................................. 72

Social Media Advertisement ................................................................................................................. 73

26. WEBSITE DEVELOPMENT ─ ADWORDS .............................................................................. 78

27. WEBSITE DEVELOPMENT ─ SEO ......................................................................................... 83

Making Money from a Website ............................................................................................................. 83

iii
1. Website Development ─ Introduction
Website Development

A website can be defined as a collection of several webpages that are all related to each
other and can be accessed by visiting a homepage, by using a browser like Internet
Explorer, Mozilla, Google Chrome, or Opera. For example, the website address of
Tutorialspoint is: www.tutorialspoint.com.

Each website has its own URL which is a unique global address called domain name.
A URL comprises of:

 The protocol used to access the website, which in this case is http, meaning port
80. It can also be https; port 443.

 The subdomain which by default is www.

 The domain name; domain names are normally chosen to have a meaning. Like
in our case “tutorialspoint”, we can understand that this website offers tutorials.

1
Website Development

 The suffix name which can be .com, .info, .net, .biz, or country specific. For
detailed information, please refer the following Wikipedia link:
https://en.wikipedia.org/wiki/List_of_Internet_top-level_domains.

 The directories or in simple words, a folder in the server that holds this website.

 The webpage that we are looking at, in our example, it is “about_careers.htm”.

Why Do We Need Websites?


Websites primarily act as a bridge between one who wants to share information and those
who want to consume it. If you are running a business, then it is almost imperative for
you to have a website to broadcast your offerings and reach out to potential clients at a
global stage.

The following points explain why it is important to have a website:

 A website is an online brochure where you can advertise your business offers.

 It gives you a platform to reach out to a far-and-wide global customer base.

 If you are a blogger, you have the possibility to influence your readers.

 You can show all your ideas and publish them on a website.

 If you have a business idea, then you don’t have to wait. You can straightaway
open an online shop and sell your products or services online. An added advantage
is that the online shop will be open 24/7 for your clients, throughout the year.

 You can communicate with your customers, giving them an opportunity to express
themselves.
 You can provide valuable customer support by having a trouble-ticket system.

2
Website Development

 If you have an official website with a domain, then you can have your personalized
email. For example, [email protected] (it is much better than
[email protected]).

How to Setup a Website?


A website is composed of several elements and while setting up a website, you would have
to take care of each of them.

 To set up a website and make it live, you should first purchase a hosting plan.
 Select a domain name for this website.
 Point the DNS records to the server or the hosting provider.
 Develop the content that you want to publish on the website.
 Check if you need to purchase a public certificate and install it.
 Publish the webpage on the Internet.

In the subsequent chapters of this tutorial, we will discuss each of these steps in detail.

3
2. Website Development ─ Required Skills
Website Development

The skills required to set up a website can vary from very basic to the most advanced. If
you are going to set up a professional website for a global audience, then you should have
the following set of skills or you would have to hire a group of people to do this job for
you.

Content Experts
Content experts supply the content that is to be published on the website. They design
the content as per the requirement of the target audience and then, edit and polish the
content before it gets published.

Content experts normally rely on the expertise of the site designer and the webmaster.
Note that the content can be text, data, images, audio or links.

Website Designer
A web designer is a technical person who designs and maintains the Graphical User
Interface (GUI) of the website. For example, where the buttons should be placed, how the
images are to be displayed, etc.

Graphic Designers
Graphic designers develop image files that are to be included in the website. These
professionals have a keen understanding of developing suitable graphics for the web
environment.

Web Developers
Web developers create the program codes to manipulate the supplied content, based on
the site design established by the website designer. A web programmer should use a set
of programing languages to compile specific functions that the webpages should do in the
background. Here is a set of important programing languages that a web programmer
must be good at:

 HTML / XHTML − These are the markup languages which you will use to build
your website. A web programmer must have a good understanding of HTML and
XML.

 PHP – It is a popular programming language to develop webpages. You can collect


more information on PHP on: http://www.tutorialspoint.com/php/

 PERL Script − PERL is another language which is being used to develop interactive
Web Applications. If you are planning to use PERL to develop your website, then
please browse our tutorial – http://www.tutorialspoint.com/perl/ to know more
about PERL.

4
Website Development

 Java or VB Scripts − These scripts are required to perform user-level validations


and to add more interactivity to your Website. So, a web developer is required to
have adequate knowledge of any of these client-side scripts.

 AJAX Technology − AJAX is the latest technology on the Web. Google and Yahoo
are using this technology to give a better browsing experience to their website
visitors.

 ASP or JSP – Web developers are required to be well-versed with ASP or JSP to
develop interactive websites. To get more information, you can go through our
tutorials on ASP and JSP at: http://www.tutorialspoint.com/asp.net/ and
http://www.tutorialspoint.com/jsp/.

 Macromedia Flash − You can use Macromedia Flash to build a Website. It can be
a little time-consuming to learn this technology, but once you learn how to use it,
then you can develop attractive websites using Flash.

Web Researcher
You should research on new tools, trends and issues affecting the web technology. Web
researchers report to the webmaster regarding new techniques that can be integrated in
the website. They optimize appropriate site traffic and evaluate site development tools,
which can be either hardware or software.

Hardware and Software Support Resource


The Support Resource upgrades the hardware and software as and when needed. They
play a crucial role in keeping the system up and running in a flawless manner.

Marketing and Promotion


Marketing professionals mostly use popular Social Media Platforms such as Facebook and
Twitter to promote the content and resources available on the site. They reach out to the
target audience and create awareness among them.

System Administrator
A System Administrator knows how to set up and point the protocols as HTTP, FTP, SMTP
and DNS records. System administrators are those experts who look after every aspect of
website development and its maintenance.

5
3. Website Development ─ Domain Name
Website Development

Domain name is the part of your online address and your visitors will use it to find you
easily. For example, Tutorialspoint domain name is tutorialspoint.com. Your domain
name is unique to you. Once you have registered it, nobody else can register the same
one if you continue to renew it.

Registering a domain name can be easy because you can select whatever name you want,
but what you choose is crucial for your business future or your blogging website. So, in
this section, let us focus on some rules that we must keep in mind before we purchase a
domain name.

Rule 1 – Choose a domain name that can be your brand name, if required. Our domain
name tutorialspoint.com is really branding because there is no generic keyword string
like tutorials-points.com that can be hard to memorize where the ‘–’ is located.

If your brand doesn’t have numbers don’t purchase a domain with numbers because there
is no brand matching from the user perspective. For example, tutorialspoints29.com.

Rule 2 – If you have the financial possibilities, then you can purchase domains with
various extensions such as .com, .net, .info, .biz, etc. In our case, it would be like
tutorialspoint.net, tutorialspoint.info, tutorialspoint.biz. There are domains that are
misspelt, such as a similar case is google.com. If you write gogle.com one ‘o’ is missing,
but still it will redirect you to the official website google.com.

Rule 3 – You must ensure that this domain name is not a trademark or is copyrighted.

Rule 4 – Find a short domain name. The lesser the characters in a domain name, the
easier it is to type, to say, to share and to get shortlisted on social media platforms and
in search results.

6
Website Development

Rule 5 – Extensions are suffixes, such as .com or .net, at the end of the web addresses.
These can have specific use, so ensure to choose an extension that works for your
business. The .com domain extension is by far the most popular, but it can be tough to
get a short and memorable .com domain name because it is around for so long. If your
webpage is serving locally, then you can buy it with the suffix of your country.

Rule 6 – If your domain name is not going by the brand name, then at least you should
use specific keywords which describes your business, for example, tutorialspoint.com. It
helps improve your rank on search engines (which increases traffic) and it also makes
more sense to your customers.

Domain Name Extensions


First domain type is Top Level Domain (TLD). These top level domains include any
extensions which contain only one suffix — for example, .net, .info, .biz and so on.

Second Level Domains (2LDs) are domain names containing one more level after the
.com or .co suffix. For example, .com.au is a second level domain style as it contains an
additional suffix after the .com that shows the website originates in Australia.

A gTLD is a Generic Top-Level Domain and includes addresses like – .marketing,


.estate, .fashion and .photography. This is a booming segment which is very popular
recently and there is a huge range to choose from, whatever your industry!

CcTLDs are Country Code Top-Level Domains which are usually restricted to certain
countries. These are domains like .au, .uk, .ae, .us, etc.

Extension also has a meaning. The meanings of some top-level domains are listed as
follows:

 .com – commercial – This is an open TLD; any person or entity is permitted to


register and it is always the main TLD.

 .org – organization – This is an open TLD; any person or entity is permitted to


register. But, it is originally intended for use by any non-profit organizations. But
as of now, there are no such restrictions and the .org domain name is being used
by numerous organizations.

 .net – network – This is an open TLD; any person or entity is permitted to register.
It was originally intended for use by domains pointing to a distributed network of
computers, or "Umbrella" sites that act as a portal to a set of smaller websites.

 .edu – education – This TLD is limited to specific higher educational institutions


such as, but not limited to, trade schools and universities.

 .mil – military – The .mil TLD is limited to use by the United States military.

 .arpa – Address and routing – It is for Advanced Research Projects Agency


in the early days on the Internet, .arpa is now exclusively used as an Internet
infrastructure TLD.

In the next chapter, we will understand how to register a domain name.

7
4. Website Development ─ Domain Name Registration
Website Development

To register a domain name involves registering the name you want with an organization
called ICANN through a domain name registrar. For example, if you choose a name
like "mydomain.com", you should go to a registrar, pay a registration fee that costs around
10 USD per year for that name. That will give you the right to the domain name for a year.
You should renew it annually for the same amount per annum.

Some webhosts will register your domain name for free, if you purchase a hosting plan
from them, while others will do it for you as well, but you will must foot the registrar fees
and charges.

Some of the biggest registrars where you can register your domain are given below:

 GoDaddy - with the URL https://uk.godaddy.com

 Name – with the URL https://www.name.com/

 iPage – with URL https://www.ipage.com

 BlueHost – with URL https://www.bluehost.com/

 Hostgator – with URL http://www.hostgator.com/

Now, let us see step by step how to register a domain name at GoDaddy.

Firstly, we should choose our domain name and see if it is free for purchase.

In my case, I wrote “tutorialspoint.com “and clicked “Search Domain”.

8
Website Development

As you can see in the results that are in the following screenshot, this domain is already
taken and it is not free. Then GoDaddy will recommend me other similar names, which we
might be interested in.

We will select another domain name that GoDaddy suggested us, which is
“tutorialspoint.online”.

 Click on the green “Select” button.


 Then click on “Continue to Card” as shown in the screenshot given below.

On the other page, GoDaddy will ask if I want to hide my personal information from the
internet for an extra fee with regards to this domain name, because by default they are
open to public.

9
Website Development

GoDaddy is an accepted Domain name registrar. It is also a Hosting provider which offers
you hosting services for your website. It allows you to purchase and at the same time
gives a suitable plan for your website.

10
Website Development

Click “Continue to Cart”.

In the webpage that opens next, you must choose the number of years for your domain
that it will be required with the possibility to extend this period.

 Also, you have the possibility to buy other similar domains.


 Click “Proceed to Checkout”.

As we are a new customer, we will click on “Continue”.

11
Website Development

In the Billing Section, we should fill genuine data because it should match with the
payment information.

In the account information, we will enter an email id (we will get all the billing related and
other notifications to this email address), username, password and PIN (this email id is
also important for account resetting or other ownership issues, if the account gets hacked).

12
Website Development

Now, we should enter the credit card details or PayPal details. Then click “Continue” as
shown in the following screenshot.

13
Website Development

The following screen will show up once the purchase of the domain is successful.

14
5. Website Development ─ Subdomains
Website Development

Subdomains are extensions of domain name that you can forward to URLs or point to IP
addresses and directories within the hosting account or different servers. Sub domains
function separately from your main domain. We can create areas of a website by using
subdomains.

Example
You can create a subdomain for a blog on site called "Blog" that is accessible through the
URL – blog.tutorialspoint.com in addition to the already existing
www.tutorialspoint.com/blog.

We can add endless subdomains per domain name in theory. We can also add multiple
levels of subdomains. For instance, you can add info.blog.tutorialspoint.com to delve
into an even more specific area of interest on the site. Each subdomain can be up to 25
characters long.

15
6. Website Development ─ Domain Privacy
Website Development

Internet Corporation for Assigned Names and Numbers (ICANN) broadly requires that the
mailing address, phone number and e-mail address of those owning and administrating a
domain name should be made publicly available through the "WHOIS" directories. But this
rule enables spammers, direct marketers, identity thieves or other attackers to use the
directory for personal information. Although ICANN has been exploring changing WHOIS
to enable greater privacy. There is a lack of consensus among major stakeholders as to
what type of change should be made. However, with the offer of private registration from
many registrars, some of the risk has been mitigated.

There are four contact positions in a domain's WHOIS record, which are –

 Owner
 Administrator
 Billing and
 Technical

Some registrars will not shield the owner organization name to protect the ownership of
the domain name.

Let us now have a detailed stepwise understanding of what is being discussed here.

Go to the URL https://whois.icann.org/en and then enter the domain name of which we
want to see the public data.

16
Website Development

The next step is to click on “Lookup” as shown in the following screenshot.

Enter the Captcha that is displayed on the webpage as shown in the following screenshot,
then click on “Lookup”.

The information that this domain name has will be shown as follows. The main section is
“Contact Information” which has some subsections like:

 Registrant Contact
 Admin Contact
 Tech Contact

Each of these sections have:

Name and Surname, Company name, Address, Phone Number and email address.
The following screenshot shows the registrant name which in this case is GoDaddy.com,
LLC

17
Website Development

The following screenshot shows the information of when the domain name was registered
and when it will expire.

While the last screenshot will show the name servers (DNS) of the domain.

18
Website Development

The following screenshot has full information details of the domain name.

19
7. Configure DNS Record on a Hosting Platform
Website Development

DNS records are mainly used to convert domain names into servers’ IP that host this
website. It is important to mention that the records are entered at domain registrars. They
generally provide you with a DNS manager panel. The main purpose is that people and
applications don’t have to remember big numbers to navigate to a domain. For example,
www.tutorialspoint.com has an IP of 93.184.220.42, so it is easier to remember a friendly
name.

Pointing a Domain to an IP is done through a record. For example: www.tutorialspoint.com


A 93.184.220.42

There are other types of DNS records that are used for a webpage, depending on the
functions that we need to publish.

Type of
Explanations
Record

A Record Connects an IP Address to a host name

CNAME Record Allows more than one DNS name for a host

MX Record Ensures email is delivered to the right location

NS Record Contains the name server info

TXT Record Provides additional info about a host or more technical info to servers

SRV Record Finds computers that host specific services

AAAA Record Provides IP addresses that do not fit a standard A Record format

SPF Record Used to help prevent against spam

Let us now see it practically: earlier the domain tutorialspoint.online was purchased at
GoDaddy, which needs to now point to an IP. For doing this, we must follow the steps
given below.

To begin with, you should start with entering the username and password. Then click on
“Manage My Domains”.

20
Website Development

Select the Domain whose DNS should be managed by clicking on . Click on “Manage
DNS “.

21
Website Development

A new window will pop up and you must then select the record that you want to enter. In
this case, we should enter A Record to publish on the website.

The boxes shown in the following screenshot will be opened. In the “Host” box, enter the
subdomain name which will be www and in the “Points to” box enter the IP –
93.184.220.42. In the “TTL” drop box, we need to select 1 Hour, which means in one
hour the record will be spread globally and the webpage will be effective. Once all this is
done, click “Save”.

22
8. Website Development ─ CMS Platforms
Website Development

In this chapter, we will first discuss how to make the right choice for your website and
which Content Management System (CMS) Platform to choose for your website.

Choosing the Right Website


Let us understand this by asking ourselves a few questions and then discuss the concept
in detail.

Question 1 – How much money do we want to spend?

Answer – This is one of the main questions because it is directly related to the budget. If
your budget is low, then you should think of something non-commercial and not too
complicated.

Question 2 – How much time do we have to plan for the maintenance?

Answer – If you are going to publish many offers, having a blog to moderate, etc., then
for sure you will need a dynamic website. You must have extra staff for handling all this,
thus this question correlates with the Question 1. Otherwise you should have a flat website,
which we will explain in the following chapters.

Question 3 – Will the website be used as an e-commerce site for selling products online?

Answer – If this is the case, you should look for a platform which is called e-commerce.
There are many such open source and commercial ones such as Magento, Opencard,
Shopify, etc.

Question 4 – Should the view be adaptable for different screens like mobiles?

Answer – If this is one of the main criteria and if there are not many other changes in
terms of information in the website; then you should go with a flat website having features
like Bootstrap.

Question 5 – Will my website interact with social media or other third party platforms?

Answer – You will need a record for all the events happening on your website and they
will be saved in a database. For keeping all this data and records, you will need a dynamic
website.

Question 6 – What type of web programing language or platform is easier to find?

Answer – Depending on the country, there are several programing languages or platforms
which are more popular than the others. So, you should first find a platform that goes with
the trends of your region.

23
Website Development

CMS Platforms
Content Management System (CMS) Platforms are applications which allow to create and
run your website. You will get an Admin Panel, which is an interface where you can create
and update pages, posts and other type of content (images, videos, etc.) and arrange the
content the way you need.
You will also be able to change the design of the site through the admin panel by installing
themes (design templates) and changing them. All the actions are done simply by clicking
on various buttons. You don’t have to write codes or scripts in most cases, so you can
manage your content easily.
The most prominent CMS platforms are WordPress, Joomla and Drupal. They are free
and open source CMS engines. That means their source code is open to the public. You
can use, edit and customize the core files of the engine on your site and if you discover a
great way to improve the platform, you can pitch it to the developers and help in making
their engine even better in their next update.
WordPress is an open source CMS. More than 50 % of the webpages are by that platform.
It is getting more comprehensive, intuitive and popular with each new update release.
WordPress has a committed community, which has tonnes of free extensions and the
easiest-to-use interface.
Managing your content with WordPress is perfectly simple: you create a page, add it to
the menu, post something on it and see your content on the front-end of your site. All that
adds up to a pre-eminent CMS platform. The official webpage is https://wordpress.com/.
The following screenshot shows the dashboard background.

24
Website Development

Joomla has balance between customization possibilities and user-friendliness, yet it is


much more complex than WordPress. If you have never worked with this engine before,
you will need some time to get used to modifying it. Assigning plugins to modules,
positioning modules on different pages, configuring layouts and other necessary
manipulations can be a bit hard on a beginner developer.
On the other hand, Joomla extension developers and community have come up with many
inspired solutions for common web design problems that are hard to resolve within
WordPress. If we take any Joomla slider extension as an example, you can set its location
on the page, the duration for showing each slide, the sliding effect and the type of
pagination.
Its official webpage is https://www.joomla.org/.

Drupal is for huge websites and organizations that can afford full-time administrators.
You can do almost anything with Drupal. I am often fascinated by how many options the
engine contains out of the box. Lots of things which in WordPress or Joomla would require
custom coding have readymade solutions by default in Drupal. It can be enhanced even
more with third-party extensions. But, I will be honest with you - learning to operate it, is
the real challenge. It takes a lot of work and patience to master.

Its official website is https://www.drupal.org/. A view of its dashboard background is


shown in the screenshot below.

25
Website Development

26
9. Flat & Dynamic Webpages
Website Development

A Static or Flat Webpage means a webpage in which all the information and material is
presented in front of the users as it is stored in it. A Static Webpage shows the same
information and data to all users. In internet technology, Hyper Text Markup Language
(HTML) was the first language or channel by which people started to create static web
pages. HTML offers the style of text, paragraphs creation and line breaks. But the most
important function and feature of HTML is link creation option. Static webpages are useful
for their material and content, which rarely need to be revised or updated.
Advantages of Static Websites:

 Quick to develop
 Cheap to develop
 No need to have a big hosting plan

Disadvantages of static websites:

 Requires web development expertise to update site


 Site not that useful for the user
 Content can get stagnant

27
Website Development

The file structure of the static website with one page is as shown below.

Dynamic Webpages
Dynamic Webpages is the latest trend at present because they can produce different
content for different visitors from the same source code file. The website can display
different content based on parameters like –

 What operating system or browser the visitor is using.


 Whether the user is using a computer or a mobile device.
 The source location that referred the visitor.
 If the visitor has done a purchase before from an online shop, etc.

Dynamic webpages can have a variety of purposes. For example, websites run by content
management systems allow a single source code file to load the content in many different
possible pages. We should mention that all these dynamic webpages use databases.
Content creators use a gateway page to submit the material for new pages into the CMS'
database. The dynamic page loads the material for any page in the database, which is
based on the parameters in the URL. This is done when a visitor requests for a webpage.
Dynamic pages let users log into websites to see personalized content.

All Content Management Systems (WordPress, Joomla and Drupal) that we mentioned
before are dynamic websites.

28
Website Development

The following illustration shows a schematic view of a dynamic webpage.

29
10. Publishing & Development Tools
Website Development

As you now know the fundamental necessities for developing a website as a beginner
developer, you will need some tools that you should have for primary usage.

Firstly, you should have a basic package of internet that has a good upload speed,
minimally 1Mbps. Secondly, you should have a computer with any Operating System (it
can be Linux, iOS X or Windows). Then the hardware specifications should be minimum –
1-2 GB RAM, Processor should be at least a Dual-Core one and the hard disk must be
around 80 GB.

The next step is – you should have a text editor that will help you for code writing and
editing. Some of the best text editors for this purpose are as mentioned below.

Text Sublime
Text sublime can be downloaded from https://www.sublimetext.com/. It is good because
the text changes the color of the parameters depending on their functions.

30
Website Development

Notepad ++
Another popular text editor is Notepad ++ that can be downloaded from –
https://notepad-plus-plus.org/.

EditPad
The next one in the list of most popular text editors is EditPad, which is another free tool.
It can be downloaded from – http://www.editpadlite.com/.

Note: You should always use a text editor that you feel more comfortable working on.

31
Website Development

XAMPP & LAMPP


Another tool that you need to have in your computer when you are specially developing a
dynamic webpage is – XAMPP for Windows OS and LAMPP for Linux OS. It has various
products such as

 Web Apache
 MariaDB with phpMyAdmin for DB Management
 PHP and
 Perl Extra.

If you want, you can also create an FTP Server and Mail Server with Mercury.

Another similar tool like XAMPP is WAMPSERVER, which can be downloaded from the
following link – http://www.wampserver.com/en/.

32
Website Development

For developers who want to code ASP should have Visual Studio provided by Microsoft. It
can be downloaded from – https://www.microsoft.com/web/.

If you are a beginner and you are planning to develop a flat (static) website, you should
have Visual HTML text editors called WYSIWYG. One of the most commonly used editor
is Macromedia Dreamweaver. It can be easily downloaded from the following link –
http://www.adobe.com/products/dreamweaver.html.

33
Website Development

The other tool that you need to have is FTP Client, which is used to transfer files to the
Hosting Container. Generally, these FTP Clients are free and can be easily downloaded
from the internet.

 WinSCP can be downloaded from https://winscp.net/eng/docs/guide_install.

 FileZilla can be downloaded from https://filezilla-project.org/download.php.

34
Website Development

35
11. Commercial & Free Themes
Website Development

A theme is a personalized design of a website often including its layout. Changing your
theme, changes the view of how your website looks on the front-end. Usually CMS
platforms have both free and commercial versions. These themes are categorized as per
their functions like

 Business
 IT industry
 Hosting, etc.

Free themes are found in theme providers and they are free of charge, but sometimes the
features are more limited than that of the commercial ones. Let us take the free WordPress
themes as an example. These themes are found on the following link –
https://wordpress.org/themes/, you can find and install them as per your business profile
or needs.

On the contrary, for the commercial themes, you must pay. WordPress commercial themes
are found on the following link – https://wordpress.org/themes/commercial/.

36
12. Choosing a Web Hosting Company & a Plan
Website Development

When choosing a Web hosting company one of the main key indicators is to see their
client’s satisfactory reviews and the price which is also important. As technologies and
hosting industry changes too often and fast for an expert, we should be aware to check
with following criteria’s.

 Server Reliability / Uptime Scores – The most important point to know here is
whether they have a 24×7 operating web host. You need a web host to operate on
a powerful server and have stable network connections. Close to 99.5% and above
is the recommended uptime score; anything below 99% is unacceptable.

 A company that supports Multiple Add-on Domains.

 Price of Hosting Signup and Renewal Cost. Hosting deals and shared hosting
especially are normally selling very cheap on signup prices, but charge much higher
on renewals.

 What Refund Policy they are offering? – If you choose to cancel your host within
the trial period, what are the implications? Does the company provides a full money
refund? What is the hosting company’s refund policy after the trial session? Are
there any cancellation charges?

 Easy to use Hosting Control Panel. A user-friendly and functional hosting control
panel is very important.

 Account Suspension – What are the limitations? Here’s a money tip that most
hosting review sites will not tell you – Hosting companies will pull the plug and
suspend your account if you are using too much CPU power (yes, unlimited hosting
is limited) or violating the rules.

 Do they offer Backup. Are they free of charge?

 Do they have 24/7/365 Live Chat Support.

Choose a Web Hosting Plan


Before choosing the right hosting plan, you should know what you need, a Windows OS
based hosting or a Linux OS based hosting. This choice depends on the coding language
that your website has. If it is ASP, it should certainly be a Windows based hosting and
should also have an IIS server installed in it. If it has any other programming languages
like PHP, Perl, Ruby, then you should go with Linux based hosting.

After you have decided on the type of hosting (Windows or Linux), you should define the
right hosting plan.

37
Website Development

You should take into consideration the following factors:

 Disk Space
 Bandwidth
 Number of Hosted Domains
 Number of Subdomains
 Parked Domains
 Versions of PHP, MySQL and Perl.

The main plans in general are as follows:

Shared Hosting
It is the most basic plan that every hosting provider offers. Shared hosting is
fundamentally many hosting accounts located on one server. Some of them share the
same IP address (although a dedicated IP address is often available for an additional fee).
This plan will always offer a specific set of features and will always have resource limits.
If you are not certain, then it will be better to start with a limited plan and later upgrade
it after the website grows and gets more traffic.

VPS Hosting
VPS is a Virtual Private Server. This refers to the partitioning of a physical server into
multiple servers where each one acts just like a dedicated server, each has its own
operating system and can be rebooted separately. These operating systems receive a
specific share of the resources of the physical server and they are isolated from each other.
There are two types of VPS hosting:

 Managed – Managed means that the patching is done by the hosting company by
offering a CPanel in it.

 Unmanaged – Unmanaged is a hosting where you should take care of your VPS
in everything and there is no CPanel in it.

Dedicated Hosting
This is the most powerful type of hosting, which meets the requirements and needs of
big businesses. Dedicated server owners can sell hosting services for a profit. They can
choose the server specifications and environment. If you have heavy traffic, a very popular
site, or a large customer database, then consider Dedicated Hosting. A dedicated server
also provides more freedom to send emails and stream media.

38
Website Development

TIPS: The most important thing in hosting is to check prices of different Hosting
Companies and their hosting plans prices with comparison websites for a better
understanding. An example of a comparison website for checking prices of hosting
companies is – http://www.hostmonk.com/.

39
13. Website Development ─ Website
CPanel Development

Control panel is the administration web interface of your webhosting account. It is an


interface that you access to administer all the aspects of your account. You can typically
control all portions of your site within the control panel without using any additional
software like FTP software to upload files, though many people find it faster and easier to
do so.

Some web hosts use customized, proprietary control panels, but most of them use popular
platforms. However, the leader of the industry is cPanel. It is the most spread out control
panel among the hosting providers. The official webpage of cPanel is – http://cpanel.com.

Now let us discuss cPanel in detail and understand the most important aspects of it.

Firstly, to enter the CPanel you should type in the URL which the Hosting Company will
give to you. This in general should be – yourdomain.com/cpanel. You should then enter
your username and password which the hosting company has given you.

The main dashboard will be as shown in the following screenshot, where on the left-hand
side, you will see the General Information, which will show the username, domain name,
home directory and the IP address of the log in. On the left towards the bottom of the
screen are the Statistics like databases used, email and the add-on Domains.

40
Website Development

In the FILES section, the most important folder is of the File Manager, you can upload
or download files of your webpage. The next important is FTP Accounts, where you can
create users that can use programs like FileZilla to upload or download files.

Taking a backup of the FILES section allows you to fully or partially download the
webpage.

41
Website Development

In the DATABASES, the phpMyAdmin is the most important section which allows you to
manage the database of the webpages. It can edit, add, truncate databases and tables.
The MySQL Databases allows you to create and delete the databases or users. The same
thing can be done step by step with the MySQL Database Wizard.

In the DOMAINS section, the Addon Domains folder is an additional domain that the
system stores as a subdomain of your main site. You can use these Addon Domains to
host additional domains on your account. The Site Publisher is used to quickly create a
website from a set of available templates. The Subdomains folder is a subsection of your
website that can exist as a new website without a new domain name.

42
Website Development

In the EMAIL section, the most important folder is Email Accounts in which you can
manage email accounts associated with your domain.

The Metrics section is more for statistics of your website. You can see each one will give
different reports for your website.

In the SECURITY section, the most important folder is IP Blocker, you can block any
host or network that you don’t want to give access to your website. There is also
ModSecurity that is used to secure Apache.

43
14. Website Development ─ Website Setup
Website Development

After understanding most of the important factors of Website Development, it is now time
to set up a webpage. For setting up a webpage, we should adhere to all the steps given
below.

Step 1 – Firstly, we purchased a domain name at GODADDY.

Step 2 – We chose the hosting provider based on the analysis of the hosting plans that
we needed.

Step 3 – We configured the DNS records and the DNS servers of the registrar that in our
case was GODADDY again.

Step 4 – Now that we are done with all the above-mentioned steps, it is time to upload
the files of the webpage through CPanel  File Manager.

44
Website Development

Step 5 – After opening it, upload the files in the folder named public_html as shown in
the following screenshot.

Step 6 – If you have a dynamic website, then you must configure the database too. To
do it, go to MySQL Databases.

Step 7 – Click on Create New Database and then write the database name that your
website will have and then click on Create Database as shown in the screenshot given
below.

45
Website Development

Step 8 – In the Add New User section type the Username and the password and then
click on Create User.

Step 9 – We must add the user that we created for this database to give rights or
permissions to manage it.

46
15. Public Authority Certificates
Website Development

Digital Certificates are a standard of security for establishing an encrypted link


between a server and a client. This is generally between a mail server or a webserver that
protects data in transitions by encrypting them. A Digital Certificate is also a Digital ID or
a passport which is issued by a Third-party authority, which verifies the identity of the
server’s owner.

For example, the following screenshot shows the eBay public certificate.

Components of a digital certificate


All these components can be found in the certificate details:

 Serial Number: Used to uniquely identify the certificate.


 Subject: The person or entity identified.
 Signature Algorithm: The algorithm used to create the signature.
 Signature: The actual signature to verify that it came from the issuer.
 Issuer: The entity that verified the information and issued the certificate.
 Valid-From: The date a certificate is first valid from.
 Valid-To: The expiration date.
 Key-Usage: Purpose of the public key (e.g. encipherment, signature, certificate
signing...).

 Public Key: The public key.

47
Website Development

 Thumbprint Algorithm: The algorithm used to hash the public key certificate.
 Thumbprint The hash itself, used as an abbreviated form of the public key
certificate.

Types of Validations
There are three types of validations, which are as follows –

 Domain validation SSL Certificate.


 Organization Validated SSL Certificates.
 Extended Validation SSL Certificates.

Let us now discuss each of them in detail.

48
Website Development

Domain validation SSL certificate


It validates the domain that is registered by a system administrator and he has the
administrator rights (authorization or permission) to approve the certificate request. This
validation is generally done by an email request or by DNS record.

Organization Validated SSL Certificates


It validates the domain ownership and business information like the official name, City,
Country. Validation is done also by email or DNS record entering. The certificate authority
also needs some genuine documents to verify your Identity. The Organization Validated
SSL Certificates display the company information in the certificate details as shown in the
following screenshot.

49
Website Development

Extended Validation SSL Certificates


It validates the domain ownership, organization information and the legal existence of the
organization. It also validates that the organization is aware of the SSL certificate request
and approves it. The validation requires documentation to certify the company identity
plus a set of additional steps and checks. The Extended Validation SSL Certificates are
generally identified with a green address bar in the browser containing the company name
like the one shown in screenshot below.

50
16. Purchasing a Public Certificate
Website Development

To purchase a SSL certificate, you should go to the SSL Certificate Provider (certificate
authority). Each SSL Certificate Provider has different products, prices and levels of
customer satisfaction, which is nearly the same logic like purchasing web hosting. To check
the best offers and products you can try SSLShopper by clicking on the following link.

https://www.sslshopper.com/certificate-authority-reviews.html

It has reviews and experience from other clients that have purchased before a SSL
Certificate.

51
Website Development

The purchasing process then takes place as depicted in the following illustration.

52
17. E-commerce Platforms
Website Development

In this chapter, we will deal with e-commerce. Which are the most popular and secure e-
commerce platforms? What is needed to secure them?

E-commerce is selling and buying goods and services from the internet and paying through
this medium. This transaction happens between clients to business, B2B, client to client.
As in between all this, there are money transactions which we should be cautious when
using, or setting up e-commerce websites.

Some of the top e-commerce platforms which are secure as well are listed below along
with a detailed explanation about them.

Magento
The website link is – https://magento.com. This platform is one of the best and is
developed by eBay. Magento can be easily integrated with the PayPal gateway. It has
two versions– Free Version and Pay Version. The vulnerabilities are patched too fast .It
has a vast variety of plugins and customization. It has SaaS solutions, which means
Elastic scalability, high resilience and availability, PCI compliance, global availability and
automated patching, while still maintaining flexibility in software customization that our
merchants require.

53
Website Development

Shopify
The website link is – https://www.shopify.com, so if you are trying to design the checkout
page to be exactly how you want, Shopify is probably not for you. In fact, none of the
hosted solutions will offer customizable checkout process, so you can jump the Self-Hosted
section right away. Shopify has many apps that you can download and install on your
store, which extend the default features or introduce new functionalities.

Woocommerce
The website link is – https://wordpress.org/plugins/woocommerce/. WooCommerce is a
free e-commerce plugin that allows you to sell anything very practically. Built to integrate
seamlessly with WordPress, WooCommerce is the world’s favorite e-commerce solution.
It gives you both store owners and developers complete control that use WordPress
templates.

With endless flexibility and access to hundreds of free and premium WordPress extensions,
WooCommerce now powers 30% of all online stores, more than any other platform.

54
Website Development

Bigcommerce

The website link is - https://www.bigcommerce.com. It has over 115 e-commerce


templates, unlimited product uploads, mobile view, it is perfectly integrated with amazon
and eBay. It also can be integrated with most of the payment gateways. From security
perspective, it is PCI compliant.

55
18. E-commerce Payment Gateway
Website Development

Payment Gateway is an online payment processing technology which helps businesses to


accept credit cards and electronic checks. In other words, payment gateways are “Man-
in-the-middle” which are located between e-commerce platforms and clients.

A payment gateway allows you to:

 Make and take payments quickly and easily.


 Keep your customer's data (information) and money secure.
 Gain trust of your customers, so they are willing to hand over their money.

To choose the right payment gateway, you should follow the following guidelines:

 You should finalize that payment gateway which is supported in your country, not
all them operate globally.

 You should check what payment gateways are supported better from your e-
commerce platform. For example, PayPal gateway is fully supported by Magento
because the same group have created them.

 Payment gateway should be of 3.0 PCI data security standards.

56
Website Development

 Do you need payment gateway and merchant account or an all-in-one payment


service provider?

 You must see the charges and fees that will be deducted per transaction.

 What payment method do they support? For example, VISA is a payment method,
Master Card is another.

 Do they support your type of business? For example, some of them don’t deal with
businesses that sell adult materials, betting, gambling, firearms selling, narcotics,
etc.

Most Popular Payment Gateway Providers


Following is the list of the most widely used and popular payment getaway providers along
with a brief history about them.

 PAYPAL – You can find all the terms and conditions of their business model on
their URL – https://www.paypal.com/. PayPal is one of the longest established
and probably the best-known service for transferring money online.

 Amazon Payments – The URL of this immensely popular payment getaway


provider is – https://payments.amazon.com/. It was created in 2007, Amazon
Payments provides your customers with the same checkout experience they get
on Amazon.com

 Stripe – The URL of this payment getaway is – http://stripe.com/. No monthly


fees, no extra charges for different cards and different payment methods, also for
different currencies. Stripe also offers a great API (Application Program Interface)
as well.

 Authorize Net – The URL for this popular payment getaway provider is
http://www.authorize.net/. It is among the most powerful and well-known
payment gateways. It is well-supported by e-commerce WordPress plugins.

 2Checkout – The URL for this payment getaway provider is –


https://www.2checkout.com/. 2checkout is one of the most simple and affordable
credit card gateways.

In the next chapter, we will understand how to create a small business website.

57
19. Small Business Website
Website Development

To create a small business website is not a complicated task. The main fear is to figure
out the content of the website, which is one of the main reasons business owners are put
off. Small Business websites are best when they are simple with minimal text and just a
single option on each page – for example, a Submission Form, or a Contact Us button.

Business websites also tend to follow a standard format, using a few essential pages. As
you go through the list, don’t worry about formatting each page yet, just think about the
text, images and the content you will include. The most crucial pages of a small business
website are:

 Home
 About
 Gallery
 Services
 Contact

You can see all these important pages in the following screenshot of a small business
website.

Let us now understand each of these essential pages in detail.

 Home: On the home page, you should include the name of your business, where
you are located and a simplified pitch of a few lines about why customers should
choose your business.

58
Website Development

 About: Provide your company background and list organizational memberships.


Also, include customer testimonials, unless you want to link this out on a separate
page like social media as Facebook.

 Gallery: On the gallery page, you should put professional photos of your job
processes, product, staff, etc. Clients can “feel” the way you work.

 Services: A page with details about the products you sell or services you provide.
On the page where you detail your products or services, spend one to five
sentences describing each category you offer and give prices.

 Contact: In this page, you should put your address, email, phone number, the
hours you are open for business. The links to any social media accounts such as
Twitter and Facebook should appear on this page. Embed a Google map of your
location.

59
20. Back Up Your Website
Website Development

Creating a backup of your website is important because it provides insurance against all
types of setbacks, such as security compromises, inadvertently deleting your site files and
database corruptions.

It is suggested backing up your site before you make changes each time and every time.
If something goes wrong, you have a fresh copy that you know is working. It might seem
like a hassle, but the first time you use a backup, you're going to pat yourself on the back
for having so much foresight.

There are two ways to back up your website:

 Manual
 Automatic (through cPanel).

Let us discuss both these ways to backup your website in detail.

Manual Backup
To manually backup your website, you can do it with a File Transfer Protocol (FTP) client
like we discussed previously with either – FileZilla or WinSCP. You connect your local
computer to your hosting account and move files between them. To backup your website,
you should just copy all the files from your hosting account to your local computer.

If you have a database, create a dump file (export/backup) of it used by your account. To
do so, you should access the phpMyAdmin tool (available in your cPanel).

60
Website Development

Automatic Backup
To automatically backup a website we can do it through the CPanel Console, which can
be done by clicking on the Backup Wizard as shown in the screenshot given below.

After clicking on Backup Wizard, the next window that will show up will be like the following
screenshot. It will be explaining what all will be backed up with the tools provided by the
cPanel.

61
21. Website Development ─ Webpage Migration
Website Development

Webpage Migration is a process of moving a webpage from one host to another. This
process is done for various reasons, some of which are:

 You are not satisfied anymore with the support of the Hosting Company
 Prices are cheaper to another hosting
 Your actual hosting plan doesn’t fulfill your needs anymore
 Technology offered is not competitive anymore, etc.

As migration is a process, the following steps are needed to complete it in a minimal


downtime of your webpage.

 We must fully backup our webpage as discussed in the previous chapters.


 Upload the backup file in the new hosting.
 Unzip files in the Public folder.
 Import the database file.
 Configure files with the credentials of the new database.
 Point your new domain name servers with your current registrar and wait for the
new records to be propagated.

62
22. Testing Your Website
Website Development

In this chapter, we will learn how to do some small troubleshooting of a website.

Scenario: The scenario is simple – When trying to open a website there is an error which
is popping up – Page cannot be displayed.

Answer: This issue can be addressed by following the troubleshooting steps given below.

Step 1 – Firstly, you must ensure that you don’t have an internet connection problem.
You can check it by just simply trying to open another website and see if you get the same
result or not.

Step 2 – You have internet in your computer but the website is still not opening.

 You should check with the hosting provider, if your hosting plan has expired or not
(maybe you forgot to pay it).

 You should also check with your domain registrar, if your Domain Name is still valid
and it has not expired too.

Step 3 – After you are done with checking the above-mentioned steps, you should check
your DNS records if they are ok or not. Sometimes Hosting Providers change the DNS
servers and forget to update the records. You can check this by opening CMD, type ping
yourdomainname.com and if you get the following response, please check further.

Ping request could not find host yourdomainname.com. Please check the name and try
again.

If you get the following result, then the DNS records and the server are healthy.

63
Website Development

Step 4 – Check for any database connection errors, if you are having similar errors like
the screenshots shown below.

To check if the database is functioning in the backend, you should have confirmation that
the username, file permissions, passwords and ports of the database did not change.

Step 5 – If you have a the Error 404 Not Found as shown in the following screenshot,
then while opening www.yourdomainname.com, you should check if your directory
structure has not changed and it is pointing on the Public_html folder.

64
23. Website Development ─ Security
Website Development

Securing your webpages is as important as developing it, because any threat which can
compromise the security can harm your business reputation, damage you financially (by
stealing your online deposits), damage your clients that visit your website, etc.

As per security experts, they will suggest to do the website security check based on the
OWASP TOP 10, which is a powerful awareness document for web application security.
The OWASP Top 10 represents a broad consensus about what the most critical web
application security flaws are.

SQL Injections
Injection flaws, such as SQL, OS and LDAP injection occur when untrusted data is sent to
an interpreter as part of a command or a query. The attacker’s hostile data can trick the
interpreter into executing unintended commands or accessing data without proper
authorization.

Solution – To secure your webpage from iSQL, you must validate inputs and filtering
symbols.

Broken Authentication and Session Management


Application functions related to authentication and session management are often not
implemented correctly, which allows attackers to compromise passwords, keys, session
tokens or even to exploit other implementation flaws to assume other users’ identities.

Solution – To secure your site from this flaw, you must make cookies and sessions with
expiration time.

65
Website Development

Cross-Site Scripting (XSS)


XSS flaws occur whenever an application takes untrusted data and sends it to a web
browser without proper validation or escaping. XSS allows attackers to execute scripts in
the victim’s browser, which can then hijack user sessions, deface websites or redirect the
user to malicious sites.

Solution – Protection from this is on the same lines as it is for iSQL.

Insecure Direct Object Reference


A direct object reference occurs when a developer exposes a reference to an internal
implementation object, such as a file, directory or a database key. Without an access
control check or other protection, attackers can manipulate these references to access
unauthorized data.

Solution – You should implement specific protection mechanisms such as passwords to


safeguard such files.

Security Misconfiguration
Good security requires having a secure configuration defined and deployed for the
application, frameworks, application server, web server, database server and the platform.
Secure settings should be defined, implemented and maintained, as the defaults are often
insecure.

Solution – Software should be kept up to date.

Sensitive Data Exposure


Many web applications do not properly protect sensitive data, such as credit cards, tax IDs
and authentication credentials. Attackers may steal or modify such weakly protected data
to conduct credit card fraud, identity theft or other crimes.

Solution – Sensitive data deserves extra protection such as encryption at rest or in


transit, as well as special precautions when exchanged with the browser.

Missing Function Level Access Control


Most web applications verify function level access rights before making that functionality
visible in the UI. However, applications need to perform the same access control checks

66
Website Development

on the server when each function is accessed. If requests are not verified, attackers will
be able to forge requests to access functionality without proper authorization.

Solution – You should check the levels of authentication.

Cross-Site Request Forgery (CSRF)


A CSRF attack forces a logged-on victim’s browser to send a forged HTTP request, including
the victim’s session cookie and any other automatically included authentication
information, to a vulnerable web application. This allows the attacker to force the victim’s
browser to generate requests which the vulnerable application thinks are legitimate
requests from the victim.

Solution – The most commonly used prevention is to attach some unpredictable challenge
based tokens to each request that comes from a website and associate them with the
user’s session.

Using Components with Known Vulnerabilities


Components, such as libraries, frameworks and other software modules almost always run
with full privileges. If a vulnerable component is exploited, such an attack can facilitate
serious data loss or server takeover. Applications using components with known
vulnerabilities may undermine application defenses and enable a range of possible attacks
and impacts.

Solution – Check if that component version has vulnerabilities and try to avoid or change
with another version.

Invalidated Redirects and Forwards


Web applications frequently redirect and forward users to other pages and websites. These
applications use untrusted data to determine the destination pages. Without proper
validation, attackers can redirect victims to phishing or malware sites or use forwards to
access unauthorized pages.

Solution – Always validate a URL.

Secure Used Protocols


This is the case where you have a VPS plan and you manage everything on your own.
When the services are installed they use default ports. This makes the job easier to a
hacker because he knows where to look at.

Some of the main service ports which are used in hosting of websites are given below:

 SSH – port 22
 FTP – port 21
 MySQL – port 3306
 DNS – port 53
 SMTP – port 25

The port changing of those services varies depending on the Operating System and its
different versions. In addition to this, you have to install a firewall. If it is a Linux OS, we

67
Website Development

will recommend IPtables and block all the other unneeded ports. In case your OS is
Windows, you can use its incorporated firewall.

To block brute force logins in your services, you can use Fail2ban, which is a Linux based
software and block all the IP addresses which makes many failed login attempts.

68
24. Speed Up Your Website
Website Development

Speeding up a webpage or a website is as important as finding the right hosting provider


or domain name. Why?

Just read the following statistics and you will change your mind.

One second in page load time yields:

 11% fewer page views.


 16% decrease in customer satisfaction.
 7% loss in conversions.

Amazon found this to be true, reporting increased revenue of 1% for every 100
milliseconds improvement to their site speed based on their group reports.

Based on the results of a study done by Akamai:

 47% of people expect a webpage to load in two seconds or less.


 40% will abandon a web page if it takes more than three seconds to load.
 52% of online shoppers say quick page loads are important for their loyalty to a
website.

How to Test my Website Speed?


Some noted experts of this field suggest to use an online tool which is called as
Webpagetest (https://www.webpagetest.org/). It is an open source project that is
primarily being developed and supported by Google. It does the website speed test from
multiple locations around the globe using real browsers (IE and Chrome) and at real
consumer connection speeds. You can run simple tests or perform advanced testing
including multi-step transactions, video capture, content blocking and much more. Your
results will provide rich diagnostic information including resource loading waterfall charts,
Page Speed optimization checks and suggestions for improvements.

In our example, we will be testing the performance of tutorialspoint.com for a user from
Germany using the Chrome browser.

To run the test, open the URL https://www.webpagetest.org/

Type in the domain name as shown in the following screenshot:

 Test location – It is the country of the user location.


 Browser – It is to simulate users’ browser.
 Click “Start Test”.

69
Website Development

We will get the following results in the main page. It will show all the time needed to open
the webpage with its respective elements.

If we go to the Performance Review section, it will indicate which elements should be


optimized.

70
Website Development

How to Speed up my Website?


The basic tips to speed up your website are as follows:

 Minimize HTTP requests – In simple words; simplify your webpage design.

 Minimize server response time – As per the users’ location, the server response
time changes, this is because of the distance between them. It is recommended
that if most of your visitors are in one specific region, your hosting provider should
be located there too, this makes the traveling distance shorter for the data.

 Enable Compression – Compression reduces the bandwidth of your pages,


thereby reducing the HTTP response. You can do this with a tool called Gzip.

 Enable Browser Cache – When you visit a website, the elements of the page are
stored on cache storage, so next time you visit the site, your browser can load the
page without having to send another HTTP request to the server.

 Optimize Images of your website.

 CSS delivery should be external if possible. The external style sheet is preferable,
because it reduces the size of your code and creates fewer code duplications.

 Reduce redirections which create HTTP requests.

 If your website is a Content Management System platform, then minimize the


usage of plugins as much as possible.

 Remove broken links from your JavaScript, CSS and Image URLs.

In the next chapter, we will learn how to advertise a webpage.

71
25. Advertise Your Webpage
Website Development

Once you have created your website and it is functional, then comes a very important step
of marketing it. This is done to increase site visitors and to spread the word, something
that can help exist on internet. The following illustration is a schematic view of all the steps
that need to be done when advertising a website.

72
Website Development

Social Media Advertisement


A social media advertisement is any kind of paid content on a social media network. These
options run from a one-off promoted Tweet or Facebook post to a full-scale campaign with
major budgets attached. Each social network offers different options, but we will discuss
how to do it on Facebook because it is the biggest social media platform and the ROI of
ads is about 95% on it.

Facebook has around 1.4 billion users and over 900 million visits a day which makes it fit
for large and small businesses. The real advantage of Facebook lies in the amount of
granular data available to target users. This is because you can target your audience with
various criteria such as age, location, sex, etc.

For example, in this tutorial, we have mentioned many times the word Hosting. Now, if
we log in to Facebook, you can see on the left hand side of the webpage an advertisement
regarding hosting as shown in the screenshot below.

73
Website Development

To create a Facebook Advertisement, click on account name. Then click on Create Ads as
shown in the following screenshot.

A new window will open and in this you should select your objective. In our case, I will
select Brand Awareness.

74
Website Development

Write the campaign name, in our case it is – tutorialspoint  then Click Create Ad
Account as shown in the screenshot below.

Select your account country and the currency that you want to pay Facebook as shown in
the following screenshot  then Click Continue.

75
Website Development

To select your audience, you should specify the age range and the location to which this
Advertisement will be shown.

Scroll down and you will have options to select how this advertisement will be shown.
Type text for this advertisement and upload a photo, once done  Click Place Order.

76
Website Development

77
26. Website Development ─ AdWords
Website Development

This is an advertising program from Google, where you can register and can pay them
based on the number of clicks on your website link or based on the number of page
impressions. Webpages from Google and from partner websites are designed to allow
Google to select and display the advertising.

How to Create an AdWords Campaign?


To create an AdWords Campaign, you should follow the steps given below.

Step 1 – To create an AdWords campaign, you must first create an account by clicking on
the following link – https://adwords.google.com/um/signin

78
Website Development

Step 2– After logging in, click on Campaigns, select the type of load and location as
shown in the following screenshot. AdWords is like Facebook Advertisements.

79
Website Development

Step 3 – Click on the Radio button for the target that you want as shown in the picture
below. Also, you have to bid the budget. How much do you want to spend per click?

80
Website Development

Step 4 – Put a group name and then fill the Headlines and Description Fields for the
AdWords that have to be created.

While you are filling in the details, you can see on the left preview pane how the AdWords
are going to look once they are created.

81
Website Development

Step 5 – Select such Keywords that the search engine will show when people do searching.

82
27. Website Development Website
─ SEODevelopment

Search Engine Optimization is the process where you can make your website better in
terms of ranking in search engines. The majority of web traffic is driven by major
commercial search engines, Google, Bing and Yahoo!. Although social media and other
types of traffic can generate visits to your website, search engines are the primary method
of navigation for most of the Internet users. This is a fact whether your site provides
content, services, products, information or just about anything else.

To optimize your webpage ranking, you should know what search engines look at:

 Content: It is determined by the theme that is being given, the text on the page,
the titles and the descriptions that are given.

 Performance: Your webpage should be fast (no delays). We have discussed it in


the previous chapter named – Speed up your website.

 Authority: Your website should have good content to link to or for other
authoritative sites to use your website as a reference or cite the information that
is available.

 User Experience: Your webpage should be safe to navigate, no harmful softwares


uploaded.

 Keyword Stuffing: Do not overuse the keywords on your pages.

 Purchased Links: Do not use too many buying links.

Making Money from a Website


One of the main purposes when creating a website is to make money from it. To achieve
this, there are several methods which we will discuss below:

Google AdSense
AdSense is the reverse of AdWords, allowing publishers (which includes bloggers and other
website owners) to tap into Google’s immense advertising network, so that other
advertisers can run ads on their website. To register in this program, you must click on
the following URL – https://www.google.com/adsense/

83
Website Development

Make Affiliated Marketing


You promote a product to your website visitors and email subscribers. If the product or
service resonates with these people, they will click on your affiliate link and purchase the
product and from this you take commissions.

Make Partnerships
This basically means to find businesses that can have interest to advertise on your website
and make a deal.

84

You might also like