WEBSITE DESIGN & DEVELOPMENT

2018

HIGHER NATIONAL DIPLOMA ( HND )

IN COMPUTING
 WEBSITE DESIGN & DEVELOPMENT

TABLE OF CONTENTS – WEBSITE DESIGN & DEVELOPMENT

ACKNOWLEDGMENT .................................................................................................................. 2

Domain Name System................................................................................................................ 3

The Primary Server..................................................................................................................... 3

The Secondary Server ................................................................................................................ 4

How to setup domain name server ........................................................................................... 4

The Purpose Of Protocol ............................................................................................................ 8

Server Hardware ...................................................................................................................... 10

Operating Systems ................................................................................................................... 11

Web Server Software ............................................................................................................... 12

Front-End ................................................................................................................................. 13

Back-End................................................................................................................................... 14

Template/ Online Website Creation Tools .............................................................................. 17

Custom Built Websites ............................................................................................................. 18

BIBLIOGRAPHY ......................................................................................................................... 20

ACKNOWLEDGMENT

NURUL HAFIZAH BINTI HAJI MAT SANI Page 1

 WEBSITE DESIGN & DEVELOPMENT

I have taken efforts in this Assignment. However, it would not have been possible without
the kind support and help of many individuals.

I would like to express my gratitude and thanks to my lecturer, Mr. Joseph Subin, for the
guidance and constant supervision as well as providing necessary information regarding the
assignment to complete this. My thanks and appreciation also to my classmates, family and
friends in the additional information, with the updates on the developing of this assignment,
I have learned about so many new things on Website and Development.

NURUL HAFIZAH BINTI HAJI MAT SANI Page 2

 WEBSITE DESIGN & DEVELOPMENT

P1: Identify the purpose and types of DNS, including explanations on how
domain names are organized and managed.

The domain name always stands for an alphabet and while IP addresses always stand for
number.

Domain name could be different website that can be seen as https://google.com such as
www.google.com, www.hotmail.com, www.gmail.com, www.gems.gov.bn and lots of
website that can be found in server that we can search. While every computer or laptop,
there is a different user of IP addresses.

There is a different kind of internet protocol with a lots of number that we have to
remembering but different to domain which showing a words that easy to remember.
Therefore domain name system divided into two server which is primary and secondary
server.

1) The Primary Server

The primary name of the master server reads the domain zone data from a file located on
the host account's Web server. The server sends information to the other server.

Zone information is information shared by the server administrator to provide server

working and communication with other servers. When the primary server interacts with the
secondary server, it is a zone transfer so zone information is transferred from one DNS to
another.

Two Domain Name Servers are assigned to each domain to simplify and secure the
administration with more security than a server. The zone data was generated for the main
server. They should not be copied to the secondary server because both servers
automatically share the zone data.

NURUL HAFIZAH BINTI HAJI MAT SANI Page 3

 WEBSITE DESIGN & DEVELOPMENT

2) The Secondary Server

A secondary Domain Name Server, also called a subordinate server or simply called slave,
automatically receives zone data from the primary server after startup. Secondary DNS
servers are called secondary in Microsoft's DNS management software. Each time a
secondary server functions, it searches for information from its main server.

It is important to note that the secondary server does not have to select data from the
primary server, since one secondary server can be set as the primary server.

Secondary DNS servers are important as a priority server because they provide security in
the form of security. They also reduce the load on the main server and always provide a
server to work for data transmission. Due to the diversity of domain server administration,
website security and internet security are guaranteed.

How to setup domain name server?

There is a lot of website that we can use to setup domain name server by using such as
bluehost, hostgator, justhost, GoDaddy and network solution.

By using GoDaddy is the best choice to create a website. Godaddy is the largest and most
commonly used domain name. Currently, over 17 million users in the world control over 72
million domain names.

GoDaddy offers easy access to your domain name without creating a website. When you are
finished, you can enter the domain name for your favorite WordPress hosting company.

NURUL HAFIZAH BINTI HAJI MAT SANI Page 4

 WEBSITE DESIGN & DEVELOPMENT

There is a step to register a domain name by using GoDaddy. First of all, visit GoDaddy's web
site and enter the domain name you want to sign in to the search box.

If you have a domain name, you will see a success message with the domain name listed
above. You can now go ahead and add it to your folder.

Then you can click on the continue cart button to find out.

NURUL HAFIZAH BINTI HAJI MAT SANI Page 5

 WEBSITE DESIGN & DEVELOPMENT

The GoDaddy domain name will purchase some additional services that will show you. If you
do not 'select', you can type ‘No Thanks’ and just press the continue button for the next step.

In the next page you will see your domain name and the registration period. You can change
the registration time of up to 10 years, if you wish. However, we do not recommend it.
Before expiration, you can keep renewing your domain name, so you can save money if you
want, then you can choose only 1 year registration period.

You must create a Godaddy account to continue.

NURUL HAFIZAH BINTI HAJI MAT SANI Page 6

 WEBSITE DESIGN & DEVELOPMENT

Once you have created an account, you can enter a billing address and make a payment for
your domain. GoDaddy now registers your domain name and you will receive an email that
links it to your domain management panel.

You should make sure that the automatic renewal is linked to your domain, so Godaddy can
invoice your account and you can rename your domain name. This way you do not lose your
domain while you forget to rename it.

Therefore you also can register domain name in other ways. Domain name registration fees
are almost identical to all registration services. However, its user interface and some domain
management tools are sometimes missing.

If you do not want to use GoDaddy for any reason, we recommend that you try NameCheap.
To use a free domain name with web hosting but do not want to use Bluehost, you can use
the InMotion Hosting or GreenGeeks, and ranked among the best WordPress hosting
providers on our list.

NURUL HAFIZAH BINTI HAJI MAT SANI Page 7

 WEBSITE DESIGN & DEVELOPMENT

P2: Explain the purpose and relationships between Communication Protocols,

Server Hardware, Operating Systems, and Web Server Software with regards
to designing, publishing and accessing a website.

 The Purpose Of Protocol

Protocols are defined as a set of standards, pre-defined rules and regulations in order to
communicate with each other for networking. These protocols determine which computer
should establish a connection, how it should be resolved and how the information should be
transferred to the recipient.

At present, many network protocols are used over computer networks for various purposes.
In all of this, IP (Internet Protocol) is the most widely used network protocol in today's
network scenarios. Most global network scenes are based on IP addressing strategies.

A picture above show that there is a different kind of internet protocol with a lots of
number that we have to remembering but different to domain which showing a words that
easy to remember.

NURUL HAFIZAH BINTI HAJI MAT SANI Page 8

 WEBSITE DESIGN & DEVELOPMENT

Below this are some examples of different protocols:-

HTTP – The HyperText Transfer Protocol (HTTP) is an application layer protocol that is
mainly used on the World Wide Web. HTTP uses a client server model where a web browser
is a customer and communicates with a web server web server. The browser uses HTTP,
which is carried through TCP / IP to communicate with the server and retrieve Web content
for the user.

HTTP is a widely used protocol and has been adopted quickly over the Internet due to its
simplicity. It is anonymously and without protocol.

POP3 – Post Office Protocol 3 (POP3) is a standard e-mail protocol that is used to receive
remote server mail to the local e-mail client. With POP3 you can download e-mail messages
on your local computer and read them, even if you are offline.

IMAP – Internet Message Access Protocol (IMAP) is an email protocol used to access email
on an external web server from a local client. IMAP and POP3 are the two most commonly
used internet mail protocols for email. Both protocols are supported by web servers and all
modern e-mail clients.

The main difference between IMAP and POP3 is that the POP3 protocol assumes that only
one client is connected to the mailbox. Instead, the IMAP protocol allows simultaneous
access from different customers. IMAP is suitable for you if your mailbox is managed by
multiple users.

SMTP – Simple Mail Transfer Protocol (SMTP) is the default protocol for sending email over
the Internet. SMTP uses port TCP 25 or 2525 and sometimes you may have trouble sending
your message if your ISP has closed port 25. To specify a SMTP server for a particular
domain name, the MX record (Mail eXchange) is used.

NURUL HAFIZAH BINTI HAJI MAT SANI Page 9

 WEBSITE DESIGN & DEVELOPMENT

 Server Hardware

Server hardware resources are examples of HP ProLiant BL blade servers and ProLiant DL
rack mount servers. When the enclosure is added, the server blade is automatically
detected by the appliance. If you are adding a rack server, you must manually add the rack
server to the appliance.

The server is also associated with the hardware server type. The type of server hardware
receives the details of the relative physical configuration of the server hardware and defines
the settings that can be used on the server profile assigned to this type.

Server Hardware

NURUL HAFIZAH BINTI HAJI MAT SANI Page 10

 WEBSITE DESIGN & DEVELOPMENT

 Operating Systems

It is an operating system that manages the software and software resources of the
computer and provides general services for computer programs.

The time-consuming tasks defined by operating systems to efficiently use system and
accounting software may also include distribution of processing, storage, printing, and
resource time resources.

For hardware features such as input, output and memory allocation. The operating system
acts as an interface between computer programs and computer hardware.

The application code is usually executed directly from the hardware and can make the
system call an operating system operation or interrupt a system call. The operating system
is installed on many devices equipped with computers, such as hand phones, video game
consoles, web servers and super computers.

Laptops, tablets, and desktop computers all run on the operating systems you may have
heard about. Some examples are Microsoft Windows (such as Windows 10, Windows 8,
Windows 7, Windows Vista, and Windows XP), Mac OS (formerly OS X), iOS, Chrome OS,
BlackBerry Tablet OS and the sense of open source operations Linux system.

Operating Systems

NURUL HAFIZAH BINTI HAJI MAT SANI Page 11

 WEBSITE DESIGN & DEVELOPMENT

 Web Server Software

Web Server is a program that uses Hypertext Transfer Protocol to deliver files that form web
pages for users in response to their requests that Hypertext Transfer Protocol clients pass
on to their computers. Dedicated computers and tools can be called servers

The process is a symbol of client / server design. All computer visiting websites must have
web server programs. Leading web servers include Apache (most probably an installed web
server), Microsoft Internet Information Server ( IIS ) and nginx ( pronounced as an X engine ).

Web sites are often used to create Internet-based software and web-based software for
managing email, sending applications for File Transfer Protocol ( FTP ), and expanding the
typing of web pages.

Considerations for selecting a Web server include how it operates on the operating system
and other servers, the ability to handle server-side programming, security features, and
specific publishing, search engines and building site tools with it.

Web Server Software

NURUL HAFIZAH BINTI HAJI MAT SANI Page 12

 WEBSITE DESIGN & DEVELOPMENT

P3 – Discuss the capabilities and relationships between front-end and back-

end website technologies and explain how these relate to presentation and
application layers.

Front-end and back-end builders come together to create the systems necessary for an
application or website to function properly. “Front end" stand for the user interface,
therefore "back-end" refers to the server, application, and database that are working in the
background to provide information to the user. user. The user submits the request from the
interface. The latter is checked and communicated to the server, which extracts the
required data from the database and sends it back to the user.

Front End

The front end is made with a combination of technologies such as HTML (Hypertext Markup
Language), HTML5 - the update version of HTML, JavaScript and CSS (Cascading Style
Sheets). Front end developers shape and construct user experience elements on a website
or application, including buttons, menus, pages, links, graphics and more.

The explaination of hypertension markup ( HTML ), cascading style ( CSS ) and Java Script:-

The Hypertension Markup Language ( HTML ) is the core of the website and offers a
comprehensive design and functionality. The latest version was released in autumn 2014
and is named HTML5. The upgraded version offers better audio and video projection.

Cascading style ( CSS ) sheets provide developers with a flexible and the exact way to create
an attractive and interactive website design.

About JavaScript, this speech-based event is useful for creating dynamic elements of static
Hypertension Markup Language pages. Developers can access different parts of the main
Hypertension Markup Language page and respond to server settings.

NURUL HAFIZAH BINTI HAJI MAT SANI Page 13

 WEBSITE DESIGN & DEVELOPMENT

Customers can use sites such as Horn, Ember, Backbone, Foundation, or work to connect
with the latest web site. It is also known as customer development, one of the key
challenges for front-end development is the speed of change in tools, techniques and
technologies used to create user experience for apps and websites. The obvious goal of
creating a clear and easy-to-follow user interface is tough because of various mobile devices
and resolution and size of computer screens.

Back End

Back end, also called the server side, consists of an on-demand server, an application that
distributes it, and a database that organizes information. Another explanation, if you buy a
pair of shoes from a website, you interact with the front. When you select the item you
want, place it in the shopping basket and authorize the purchase, the information is stored
in the database on the server.

Company-level databases are available, such as Oracle, Teradata, Microsoft SQL Server, IBM
DB2, EnterpriseDB and SAP Sybase ASE, and other popular databases including MySQL,
NoSQL and PostGreSQL. After that, when you check your transfer status, the server sends
information related to it, it updates with follow-up data and offers it to you via submission.
It is used to access the application with multiple frames and languages, such as Ruby on
Rails, Java, C ++ / C / C #, Python, and PHP. The back-end executives dealt with issues related
to the change of patterns that emerged and which appeared in the dialogue in the front-
end.

This lately, the Backend As A Services (BaaS) service providers have increased the
characteristics of this, which is especially useful when you can develop a mobile application.
The development of both the back and front end systems is very special, it is very common
for a single development worker. Therefore sometimes custom software development
companies will have skilled developers with both parties, known as full stack developers.

These are very important because they can see a larger image and can offer ways to
improve the process or remove the road bars that slow down the system. For analyze any
database and work framework in the next project, read the article of “What is the Best
Front-End / Back-End Combo for an Enterprise App.”

NURUL HAFIZAH BINTI HAJI MAT SANI Page 14

 WEBSITE DESIGN & DEVELOPMENT

Here are some backend development programming languages:-

Ruby
Ruby is an excellent object-oriented programming language. What Ruby stands out for
languages like PHP, Java, C # and Python is speed and efficiency.

The website you can create with Ruby (and Ruby on Rails) is amazing. For example, make
sure you know Ruby if you want to create websites such as Airbnb, Fiverr, GitHub,
Kickstarter and Zendesk.

RUBY ON RAILS
Rails are a framework for developing web applications written in Ruby. It is designed to
facilitate web application programming by giving assumptions about what each programmer
needs to initiate. Its allow you to write fewer codes while using more languages and other
frames.

JAVA
Java is a programming language that generates software for multiple platforms. When
programmers write Java applications, the compiled code (known as bytecode) runs on most
operating systems (OS), including Windows, Linux, and Mac OS. Java gets a lot of syntax
from the C and C ++ programming languages.

PYTHON
Python is an object-oriented programming language similar to PERL, which has gained
popularity because of its syntax and clear reading. It is said that Python is quite easy to learn
and portable, which means that its instructions can be interpreted in various operating
systems, including UNIX, Mac OS, MS-DOS, OS / 2, and various versions of Microsoft
Windows 98.

Python's special feature is the identification of source statements to help read code more
easily. Python offers types, classes and dynamic data interfaces with multiple system calls
and libraries. It can be expanded using C or C ++.

Python can be used as a Microsoft Active Page Server script (ASP). Bulletin system for
Melbourne (Australia) Cricket Ground is written in Python. Object Publishing Facility, a
popular Web application server, is also written in Python.

NURUL HAFIZAH BINTI HAJI MAT SANI Page 15

 WEBSITE DESIGN & DEVELOPMENT

DJANGO
Django is the most important framework for Python. Django's main advantage is that it has
been developed for speed and structured data.

Especially used for CMS websites, databases and news sites such as Disqus, Guardian,
Washington Post and social networks like Pinterest and Instagram. In other words large
applications / websites.

PHP
PHP is the server-side scripting language. This is used to create static web pages or dynamic
websites or web applications. PHP means Hypertext Preprocessor of personal pre-emptiness.

PHP scripts can only be interpreted to have PHP-server installed. A client computer
accessing PHP scripts that only require a web browser. A PHP file contains PHP tags and
ends with the extension ".php".

PHP is often used as a basis for Content Management System (CMS), such as WordPress and
home pages like Facebook and Wikipedia.

SQL
SQL is used to communicate with the database. According to the American National
Standards Institute (ANSI), it is the default language for relational database management
systems. SQL statements are used to perform tasks, such as updating data in databases or
downloading data from databases.

C++
C ++ is an object-oriented object programming language. Hard to handle. C ++ works almost
in all other programming languages. Most systems can use C ++. C ++ is a strong language
that can be used in the Microsoft’s .Net Framework.

C ++ is typically used in large applications, computer games, game development, video

games, apps, operating systems and databases. Companies like Intel, IBM, Microsoft, Adobe
and Firefox use C ++.

NURUL HAFIZAH BINTI HAJI MAT SANI Page 16

 WEBSITE DESIGN & DEVELOPMENT

P4: Discuss the differences between online website creation tools and custom
built sites with regards to design flexibility, performance, functionality, User
Experience (UX) and User interface (UI).

Templates / Online Website Creation Tools

The most common way to start a website is to install WordPress pages and use templates

that have been purchased from WorldWideThemes.net, Monster Templates or Elegant

Themes. This website offers a variety of website templates that you can buy. Not all themes

/ templates available are 100%.

There are also services like Wix or Squarespace, which also offers themes and allows you to

edit within a website template. This can help you create web pages quickly and easily.

However, there are limitations of options available for more complex features, such as

forms or features of e-commerce.

One thing to keep in mind is that templates and themes typically come with built-in features,

so users can have more customization, but this ultimately weighs web pages with respect to

load speed and SEO performance. Most likely you need to install features, designs and

features that do not necessarily match your brand or business. You can pay a web

development company to fix it, but like automatically requesting to see your Toyota

because this site may not be written in the same code format. And while developers specify

sites as they wish. After the outgoing update for wordpress or the topic itself, your site will

face some screening problems due to the customization of containers made by the

developer.

NURUL HAFIZAH BINTI HAJI MAT SANI Page 17

 WEBSITE DESIGN & DEVELOPMENT

PROS/CONS OF USING TEMPLATES

1. Many other companies can use the same template, which means your site will not stand
out.

2. Limited to how much you can customize the site. What you see is what you get.

3. Cannot work 100% on all devices

4. Some templates are not built to be search engine friendly. They must be tailored to your
business.

5. Any custom or additional technology may not be installed as a template running on a

structured system.

6. Good template for low budgets. There is a cheaper price charge.

7. Templates have shorter development times.

8. Templates usually do not have good support systems as custom sites.

CUSTOM BUILT WEBSITES

Integrated web pages include teams behind your business. It all starts with a creative
process to understand who your target group is, what you want to accomplish, how you
need a website to work, and how you want to see the Internet.

SEO plays an important role in the success of every website. There are rules that must be
followed when creating websites and all themes cannot comply with these rules. That is why
the specially designed website is superior, developers can optimize the site while creating,
so Google and other search engines can read every page to give users more relevant search
results. , giving a site built naturally to a better position on the system. . This goes beyond
keyword search.

Registered websites tend to take more time from the subject as everything is built and
accessible to some companies. This saves you in the long run because once you redo it again,
it's easier to customize the site to make sure your website does what you want to do.
Custom design allows your site to respond to all devices (such as phones, tablets, laptops,
etc.) and browsers.

NURUL HAFIZAH BINTI HAJI MAT SANI Page 18

 WEBSITE DESIGN & DEVELOPMENT

PROS/CONS OF USING CUSTOM BUILT WEBSITES

1. This website has a completely unique design that will contain the company's brand
name and will be based on your business needs.

2. Customizable sites can be tailored to your business needs.

3. This site has been tested to work on all browsers.

4. This site will be built to be a search engine friendly.

5. Customizable pages are more expensive than templates.

6. The process for creating a custom site requires more than the template site.

7. This website is growing with your business. If you know how to use your website in the
future, a professional web developer will install a technology that works with these
ideas.

8. The company that builds your site can get help if you need it.

NURUL HAFIZAH BINTI HAJI MAT SANI Page 19

 WEBSITE DESIGN & DEVELOPMENT

BIBLIOGRAPHY

All information is available from:-

https://www.afnic.fr/en/your-domain-name/what-is-a-domain-name/

https://www.wpbeginner.com/beginners-guide/how-to-register-a-domain-name-simple-tip-to-

get-it-for-free/

http://www.Sites.google.com

http://www.Pcnames.com

https://web-hosting.thetop10sites.com/top-domain-

https://www.wpbeginner.com/beginners-guide/how-to-register-a-domain-name-simple-tip-to-

get-it-for-free/

http://www.iamwire.com/2017/01/trends-web-development-2017/148126

https://www.techwalla.com/articles/purpose-of-the-ip-protocol

http://h17007.www1.hpe.com/docs/enterprise/servers/oneviewhelp/oneviewRESTAPI/conten

t/s_server-about-fusion.html

https://teletraders.net/what-we-buy/servers/

https://en.wikipedia.org/wiki/Operating_system

NURUL HAFIZAH BINTI HAJI MAT SANI Page 20

 WEBSITE DESIGN & DEVELOPMENT

https://hidayahnurhamid.wordpress.com/2014/11/24/operating-systems/

https://hafizejat.wordpress.com/2014/11/18/operating-system/

https://whatis.techtarget.com/definition/Web-server

https://en.wikipedia.org/wiki/Client%E2%80%93server_model

https://en.wikipedia.org/wiki/Web_performance

https://conceptainc.com/blog/difference-front-end-back-end-development/

https://www.techopedia.com/definition/2336/hypertext-transfer-protocol-http

http://www.swestcom.com/support/q4.htm

https://medium.com/@StudyWebDevelopment/programming-languages-explained-for-

beginners-6a2fdf0afdcb

https://www.techopedia.com/definition/3927/java

https://whatis.techtarget.com/definition/Python

https://www.guru99.com/what-is-php-first-php-program.html

http://www.sqlcourse.com/welcomead?_qstu=%2Fintro.html

https://www.atilus.com/templates-vs-custom-built-websites/

NURUL HAFIZAH BINTI HAJI MAT SANI Page 21