Contents

1. SERVER TECHNOLOGIES AND MANAGEMENT SERVICES ................................................................................................................. 4

P1. DOMAIN NAME SYSTEM ........................................................................................................................................................................................ 6
1. Explain the concept of DNS ....................................................................................................................................................................... 6
2. Purpose of DNS ............................................................................................................................................................................................. 7
3. Types of DNS.................................................................................................................................................................................................. 8
a. DNS recursive resolver............................................................................................................................................................................ 8
b. DNS root nameserver ............................................................................................................................................................................... 9
c. TLD nameserver ...................................................................................................................................................................................... 10
d. An authoritative nameserver ................................................................................................................................................................ 11
4. How domain names are organized and managed .............................................................................................................................. 12
P2. EXPLANATION OF WEB ELEMENT ......................................................................................................................................................................... 12
1. Communication protocols ........................................................................................................................................................................ 12
2. Server hardware .......................................................................................................................................................................................... 17
3. Web server software .................................................................................................................................................................................. 18
4. Explain the relationship between technologies above with regards in design, public and accessing a website ............ 21
P3. WEB TECHNOLOGIES ............................................................................................................................................................................................. 23
1. Explanation of static and dynamic web ................................................................................................................................................ 23
a. Static web .................................................................................................................................................................................................. 23
b. Dynamic web.............................................................................................................................................................................................. 25
c. The difference between a static and dynamic web (Singh, 2020) ..................................................................................................... 26
2. Front-end and Back-end ............................................................................................................................................................................. 27
a. Front-end .................................................................................................................................................................................................... 27
 b. Back-end..................................................................................................................................................................................................... 27
a. Clarify the capabilities and relationship front-end and back-end .................................................................................................. 28
P4. A REVIEW OF DIFFERENCE WEBSITE TECHNOLOGIES SUPPORTED WITH THE TOOLS AND SOFTWARE USED TO DEVERLOP WEBSITE .......... 30
1. Front-end Technologies ............................................................................................................................................................................ 30
2. Back-end Technologies ............................................................................................................................................................................. 30
3. Database ........................................................................................................................................................................................................ 31
4. IDEs................................................................................................................................................................................................................. 32
5. CMS................................................................................................................................................................................................................. 33
6. Website Buiders .......................................................................................................................................................................................... 33
6.1 Examples of online creation tool .................................................................................................................................................... 34
a. Squarespace.com (https://www.squarespace.com) ............................................................................................................................ 34
b. WordPress (https://wordpress.com) ....................................................................................................................................................... 35
6.2 Comparison table ................................................................................................................................................................................ 36
M1. Evaluate the impact of common web development technologies and frameworks with regards to website design, functionality and
management. .............................................................................................................................................................................................................. 37
1. What is Web Technology? List common web technology? ............................................................................................................ 37
2. Web development Framework ................................................................................................................................................................. 38
M2. Review the influence of search engines on website performance and provide evidencebased support for improving a site’s index value
and rank through search engine optimisation. .......................................................................................................................................................... 42
1. Concept of search engine ......................................................................................................................................................................... 42
2. Concept of SEO ........................................................................................................................................................................................... 42
3. Technical solution to improve website index based on SEO .......................................................................................................... 43
M3. Evaluate a range of tools and techniques available to design and develop a custom built website. .............................................................. 44
1. Tools ............................................................................................................................................................................................................... 44
2. Techniques ................................................................................................................................................................................................... 47
D1. Justify the tools and techniques chosen to realize a custom built website. ...................................................................................................... 52
Referance ..................................................................................................................................................................................................................... 55

Figure 1: Web server ...................................................................................................................................................................................................... 5

Figure 2: Web browser................................................................................................................................................................................................... 5
Figure 3: How does web server works? ......................................................................................................................................................................... 6
Figure 4: Purpose of DNS ............................................................................................................................................................................................... 7
Figure 5: DNS recursive resolver .................................................................................................................................................................................... 9
Figure 6: DNS root nameserver.................................................................................................................................................................................... 10
Figure 7: TLD nameserver ............................................................................................................................................................................................ 11
Figure 8: An authoritative nameserver ........................................................................................................................................................................ 12
Figure 9: 4 layer of TCP/IP Model ................................................................................................................................................................................ 13
Figure 10: Layer Model ................................................................................................................................................................................................ 16
Figure 11 Purpose of server software .......................................................................................................................................................................... 19
Figure 12:Apache HTTP Server..................................................................................................................................................................................... 19
Figure 13: Microsoft Internet Information Services (IIS) ............................................................................................................................................. 20
Figure 14: Nginx ........................................................................................................................................................................................................... 20
Figure 15: Lighttpd ....................................................................................................................................................................................................... 21
Figure 16: Sun Java System Web Server ...................................................................................................................................................................... 21
Figure 17: Static web.................................................................................................................................................................................................... 23
Figure 18: Dynamic web............................................................................................................................................................................................... 25
Figure 19: The 7 Layers of OSI ...................................................................................................................................................................................... 30
Figure 20: Database ..................................................................................................................................................................................................... 31
Figure 21: Integrated Development Environment (IDE) .............................................................................................................................................. 32
Figure 22: Content Management System (CMS) ......................................................................................................................................................... 33
 1. SERVER TECHNOLOGIES AND MANAGEMENT SERVICES
1.1 Web server

Web server: is a combination of software and hardware that uses protocols like HTTP to respond to requests from clients
over the World Wide Web. Its primary function is to store, process, and deliver website content to users. In addition to
HTTP, web servers also support other protocols such as SMTP and FTP, which are used for email, file transfer, and
storage.

The hardware component of a web server is connected to the internet, enabling it to exchange data with other connected
devices, while the software controls how users can access hosted files. The client/server model is used in the web server
process, and all computers hosting websites must have web server software installed.

Web servers are essential in web hosting, which involves hosting data for websites and web-based applications, also
known as web applications.
 Figure 1: Web server

1.2 Web browser

A web browser is a software application used to access and view information on the World Wide Web. It allows users to
interact with websites by displaying web pages, running web-based applications, and providing access to multimedia
content, such as images and videos.

Figure 2: Web browser

 1.3 How does web server works?

Clients, typically web browsers, send requests to the web server for specific web pages or resources using URLs. The
web server receives the request, retrieves and processes the requested resource, and sends the response back to the
client. Web servers use various technologies and protocols, such as HTTP, to manage communication with clients and
rely on software components to handle different aspects of the server's operation.

Figure 3: How does web server works?

P1. DOMAIN NAME SYSTEM

1. Explain the concept of DNS

Domain name system (DNS) is a hierarchical naming scheme for resources connected to the Internet or a private
network that is based on a distributed database. Most crucially, it converts human readable domain names into the
numerical identities linked to networking hardware, enabling the location and connection of devices everywhere in the
world. Similar to a network "phone book," DNS translates a domain name (such as "facebook.com") to the actual IP
address of the server, which houses the data the browser is looking for (CDNetworks, 2021) [1].
Websites occasionally have a large number of IP addresses that all point to the same domain name. For instance,
numerous individuals from different parts of the world will query a server on huge websites like Google. Even if the site
name supplied in the browser is the same, the server that a computer from Singapore attempts to contact will likely be
different from the one a separate computer from, say, Toronto will attempt to access. DNS caching is useful in this
situation (CDNetworks, 2021) [1].

2. Purpose of DNS

The Domain Name System (DNS) Server is a server that matches website hostnames (such as example.com) to their
associated Internet Protocol or IP addresses. The DNS server keeps a database of public IP addresses and the domain
names that belong to them. According to the IPv4 or IPV6 protocols, each device connected to the internet has a unique
IP address that aids in identification. The same is true for web servers, which function as hosts for websites (CDNetworks,
2021). DNS servers assist us to avoid memorizing such long numbers as IP addresses (and even more complex
alphanumeric ones in the IPV6 system) by automatically translating the website names we type into the browser address
bar into these numbers, allowing the servers to load the correct web pages (CDNetworks, 2021) [1].

Figure 4: Purpose of DNS

 3. Types of DNS

Recursive resolvers, root nameservers, TLD nameservers, and authoritative nameservers are the four categories into
which all DNS servers fall. These four DNS servers cooperate to send the IP address for a particular domain to the client
in a normal DNS search (where there is no caching at play) (the client is usually a stub resolver - a simple resolver built
into an operating system) (cloudflare) [2]

a. DNS recursive resolver

The initial stop in a DNS query is a recursive resolver, also referred to as a DNS recursor. A DNS nameserver and a client
are connected through the recursive resolver. A recursive resolver will respond to a DNS request from a web client by
using cached information, or it will make three requests: one to a root nameserver, one to a TLD nameserver, and one to
an authoritative nameserver. The recursive resolver subsequently provides a response to the client after getting a reply
from the authoritative nameserver that includes the requested IP address.

The recursive resolver will store data obtained from authoritative nameservers during this operation in its cache. The
resolver can skip the nameserver communication process and just provide the client with the requested record from its
cache when a client requests the IP address of a domain name that was just requested by another client.

There are alternatives to the recursive resolver that the majority of Internet users utilize, such as Cloudflare's 1.1.1.1.
 Figure 5: DNS recursive resolver

b. DNS root nameserver

Every recursive resolver is aware of the 13 DNS root nameservers, and they serve as the starting point for its search for
DNS records. When a recursive resolver asks a root server for help, the root nameserver responds by pointing the
recursive resolver to a TLD nameserver based on the domain's extension (.com, .net, .org, etc.). The Internet Corporation
for Assigned Names and Numbers, a nonprofit, is in charge of managing the root nameservers (ICANN).

It should be noted that even though there are 13 root nameservers, the root nameserver system does not consist of just
those 13 machines. There are 13 different types of root nameservers, but each one is duplicated globally and uses
Anycast routing to deliver quick responses. There are more than 600 distinct servers if you add up all the instances of root
nameservers (cloudflare) [2].
 Figure 6: DNS root nameserver

c. TLD nameserver

A TLD nameserver keeps track of data for all domain names that have the same domain extension, such as.com,.net, or
whatever follows the last dot in a URL. For instance, a.com TLD nameserver stores data for each website whose domain
name ends in.com. A recursive resolver would send a query to a.com TLD nameserver in the case of a user searching for
google.com after obtaining a response from a root nameserver, and that nameserver would answer by pointing to the
authoritative nameserver (see below) for that domain.

The Internet Assigned Numbers Authority (IANA), an arm of ICANN, is in charge of managing TLD nameservers. The TLD
servers are divided into two categories by the IANA:

 Top-level domains (TLDs) with a generic suffix are those that are not country-specific; among of the most well-
known generic TLDs are.com,.org,.net,.edu, and.gov.
 Top-level domains with a country code include any domains that are particular to a state or nation. A few examples
are.uk,.us,.ru, and.jp.
A third category for infrastructure domains exists, but it is almost ever used. This category was developed for the.arpa
domain, which served as a temporary domain during the development of the current DNS and has mostly historical
importance now (cloudflare) [2].

Figure 7: TLD nameserver

d. An authoritative nameserver

A TLD nameserver's response to a recursive resolver will point it in the direction of an authoritative nameserver. The final
stop on the resolver's path to an IP address is typically the authoritative nameserver. When a domain has a CNAME
record (alias), the authoritative nameserver will provide the recursive resolver with an alias domain instead of the IP
address of that server found in the DNS A record. If the domain has a CNAME record, the recursive resolver will then
need to conduct a brand-new DNS lookup in order to obtain a record from an authoritative nameserver (often an A record
containing an IP address). Cloudflare DNS distributes authoritative nameservers, which come with Anycast routing to
make them more reliable (cloudflare) [2].
 Figure 8: An authoritative nameserver

4. How domain names are organized and managed

Subdomains, which are subordinate tiers of the root domain of the Domain Name System, are used to arrange domain
names. Top-level domains (TLDs) are the first-level collection of domain names and include generic top-level domains
(gTLDs) like “.com”, “.net”, and “.org”, as well as country code top-level domains (ccTLDs). In the instances google.fr and
google.com.au, the ccTLDs are indicated to the right of the dot, such as “.fr” or “.au”. Second and third-level domain
names, such as DomainTools or Google, are classified as toplevel domains in the DNS system. End users can often
reserve these domains to run websites, establish publicly accessible Internet resources, and link the Internet to local area
networks. Second-level domains often convey the name of the organization and/or are descriptive of the service offered,
whereas third-level domains typically point to a specific server inside an organization (DomainTools, 2021) [3].

P2. EXPLANATION OF WEB ELEMENT

1. Communication protocols
A set of guidelines called Internet Protocols governs how individuals communicate and exchange information online. To
communicate data, both the transmitter and the recipient must adhere to the same rules. Let's use an illustration from a
language to help us better comprehend it. To communicate, we need to be able to read and understand every language's
syntax and vocabulary. Similar to this, a set of guidelines known as internet protocols limit our ability to move data to
another device or view a website on the internet.

Working of internet protocol: A protocol that separates data into parts called packets is used to operate the internet and
many other data networks. Every big data packet that is delivered between two network devices is divided into smaller
packets by the underlying hardware and software. Each network protocol specifies the rules for how its data packets must
be organized in certain ways, according to the protocols the network supports.

The four levels that make up TCP/functionality IP's each have their own set of protocols:

Figure 9: 4 layer of TCP/IP Model

Transport layer: The seamless transfer of data from one end to the other is the responsibility of the transport layer.
Additionally, it is in charge of the data flow regulation, recovery from errors, and stable connectivity.

Application Layer: The application layer ensures that the data from the sending end is received at the receiving end in a
format that is supported and accepted.

 HTTP & HTTPS: The acronym HTTP stands for Hypertext Transfer Protocol. It manages connections between web
browsers and servers on the World Wide Web. The acronym HTTPS stands for HTTP-Secure. It combines HTTP
and SSL (Secure Socket Layer). When the browser must complete forms, log in, authenticate, and carry out
financial transactions, it is helpful.
 HTTP HEADER: HTTP headers provide additional information about a request or response, such as the type of data being
sent, caching preferences, authentication credentials, and more.
Example: The "User-Agent" header in an HTTP request provides information about the user agent, such as the
web browser or application making the request.

An example of a User-Agent header could be "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36
(KHTML, like Gecko) Chrome/88.0.4324.182 Safari/537.36".

 HTTP BETWEEN CLIENT AND SERVER: When an HTTP client wants to communicate with a server, it first
establishes a TCP connection to the server. Once the connection is established, the client sends an HTTP request
message to the server. The server receives the request message, processes it, and sends an HTTP response
message back to the client. After the response is sent, the server closes the TCP connection. This process is
repeated for every request and response exchanged between the client and server during the HTTP
communication.
 SSH: Secure remote login and other secure network services are made possible by the SSH (Safe Shell) protocol.
It offers a safe means to control servers, network devices, and other computer systems from a distance. SSH is
substantially more secure than Telnet or other conventional remote login protocols because it employs public-key
cryptography to authenticate the user and encrypt the data being sent. Through the SCP (Secure Copy) and SFTP
(Secure File Transfer Protocol) protocols, SSH also permits secure file transfers. It may be utilized with Windows
and is widely used to Unix-based operating systems. System administrators, programmers, and other technically
oriented individuals frequently utilize it to remotely access and control servers and other network gear.
  NTP: is an abbreviation for Network Time Protocol. It is used to synchronize our computer's clocks to a single
standard time source. It is extremely handy in circumstances such as bank transactions. Consider the following
scenario in the absence of NTP.

Internet layer: This Internet Layer moves packets from source to destination by connecting independent networks.

 TCP/IP: These are a set of universal rules that enable interaction between diverse computer types. According to
the IP protocol, each computer connected to the Internet has to have a special serial number, or IP address. Data
transmission across the internet and the creation of IP packets are both governed by TCP. It also guarantees that
the packets contain information about the message's source, destination, and suggested sequence of re-assembly.
It also checks to verify if the message has been properly conveyed to the intended recipient. A connection-oriented
protocol is another name for TCP.
 ICMP: Error messages and operational information on the state of the network are transmitted via the network
protocol known as ICMP (Internet Control Message Protocol). It is used to locate and fix network connectivity
issues and is an essential part of the Internet Protocol (IP) family. Network devices like routers regularly send out
ICMP signals in response to errors or unexpected conditions when a datagram is routed. The following are some
ICMP message illustrations:
o Echo Request and Echo Reply (ping)
o Destination Unreachable
o Time Exceeded
o Redirect
 ARP: Protocol for Address Resolution. Its task is to use a known IP address to identify a host's hardware address.
Reverse ARP, proxy ARP, gratuitous ARP, and inverse ARP are the four subtypes of ARP.

Network access layer: This layer combines the Data Link Layer and Physical Layer of the OSI model.

Physical data transfer is made possible by the protocols present at this layer, which looks for hardware addressing.

Layer Model

Modern communications protocols frequently rely on other protocols in a layered paradigm known as a stack in order to
function. In a stack, each layer depends on the layers below it and supports the ones above it. For instance, the TCP/IP
stack, which has four levels, is used to power the internet.
 Figure 10: Layer Model

Because your IT department or research partner has already built up the other levels through their infrastructure, you will
typically only need to be aware of and make decisions on the top layer.

The Link layer controls connections made directly between two devices, like a phone and a mobile network tower or a
computer and a network switch.

The Internet layer routes traffic moving between source and destination networks.

The Application layer is used commonly by two computer applications that are communicating with each other. For
example, a web browser will use HTTP to access and retrieve data from a web server (

Standardised Communication Protocols for Date

To make your data available, you can utilize standardized communication protocols, such as:

 from a web server via HTTP using a browser

 from a file server via File Transfer Protocol (FTP) using an FTP client application
 through a well-documented Application Programming Interface (API).
On the landing page and in the metadata, a machine-readable form of the link to the data collection or API should be
present. This will make it possible for computers to locate the connection to the real dataset in addition to humans. On
how to incorporate a link, get advice from a metadata specialist such a data librarian, repository manager, or ARDC
specialist (Ard.edu, 2022) [4].

2. Server hardware

Server hardware means the computer hardware that CentralSquare provides, on which the Licensed Software has been
installed by CentralSquare, and that is able to operate in a local area network. This computer hardware is also capable of
running administrative software that manages access to all or some of the network's resources and makes them available
to computers acting as workstations on the network.

Purpose of server hardware: The purpose of server hardware is to provide a dedicated and reliable computing system that
can handle a high volume of requests and data processing tasks. Server hardware is designed to run continuously, often
24/7, with minimal downtime for maintenance or repairs. It includes components such as powerful processors, high-
capacity storage devices, large amounts of RAM, redundant power supplies, and specialized cooling systems to ensure
optimal performance and reliability. The ultimate goal of server hardware is to support the efficient and secure delivery of
data, applications, and services to end-users.

Operating systems

An operating system serves as a communication link (interface) between the user and the computer hardware and is a
software on which application applications are run (Singh, 2022)

The major responsibility of an operating system is to distribute resources and services, including memory, hardware,
processors, and data. An I/O program, a file system, a memory management module, a traffic controller, and a scheduler
are just a few of the programs the operating system has to handle these resources (Singh, 2022).

Purpose of Operating systems:

The primary purpose of an operating system (OS) is to manage and coordinate the activities and sharing of resources of a
computer system. An OS acts as an interface between the computer hardware and the user, providing a platform for
running application software. (uow.edu).
In addition to the tasks you mentioned, an OS also manages the security and access control of the computer system,
provides a user interface for interaction with the computer, and schedules tasks and processes for efficient utilization of
system resources. Overall, the OS plays a crucial role in ensuring the proper functioning and usability of a computer
system.

3. Web server software

A web server is software and hardware that responds to client requests sent over the World Wide Web using the HTTP
(Hypertext Transfer Protocol) and other protocols. A web server's primary responsibility is to show website content by
storing, processing, and sending webpages to users. In addition to HTTP, web servers also support the email, file-
transfer, and storage protocols SMTP (Simple Mail Transfer Protocol) and FTP (File Transfer Protocol).

While web server software manages how a user accesses hosted files, web server hardware connects to the internet and
enables data interchange with other connected devices. The client/server model is exemplified by the web server
operation. Web server software is a must for all computers that host websites.

Web hosting, also known as hosting data for websites and web-based applications, or web applications, uses web servers
(Gillis, 2020).

Purpose of server software: The purpose of server software is to manage and control the resources and functionality of a
server. It allows users to access and use the server's resources, such as files, databases, and applications, over a
network. Server software also provides security, scalability, and reliability features to ensure that the server is available
and responsive to client requests. It can handle multiple users and processes simultaneously, optimizing resource usage
and improving overall performance. Server software is essential for hosting websites, managing email and messaging
systems, and providing network services such as file sharing and remote access.
 Figure 11 Purpose of server software

There are a number of common web servers available, some including:

Apache HTTP Server: Developed by Apache Software Foundation, it is a free and open source web server for Windows,
Mac OS X, Unix, Linux, Solaris and other operating systems; it needs the Apache license.

Figure 12:Apache HTTP Server

Microsoft Internet Information Services (IIS): Developed by Microsoft for Microsoft platforms; it is not open sourced, but
widely used.

Figure 13: Microsoft Internet Information Services (IIS)

Nginx: A popular open source web server for administrators because of its light resource utilization and scalability. It can
handle many concurrent sessions due to its event-driven architecture. Nginx also can be used as a proxy server and load
balancer.

Figure 14: Nginx

Lighttpd: A free web server that comes with the FreeBSD operating system. It is seen as fast and secure, while
consuming less CPU power.
 Figure 15: Lighttpd

Sun Java System Web Server: A free web server from Sun Microsystems that can run on Windows, Linux and Unix. It is
well-equipped to handle medium to large websites.

Figure 16: Sun Java System Web Server

4. Explain the relationship between technologies above with regards in design, public and accessing a
website

There are some concepts that we must understand clearly again (MND Web Docs, 2021):

- Your internet connection: This enables you to transmit and receive data via the internet.
 - TCP/IP: Transmission Control Protocol and Internet Protocol are communication protocols that specify how data
should be sent over the internet.
- DNS: Domain Name Servers function similarly to an address book for websites. When you enter a web URL into
your browser, the browser consults the DNS to determine the website's true address before retrieving the
webpage. The browser must determine which server hosts the webpage to send HTTP messages to the correct
location.
- HTTP: an application protocol that specifies a language for clients and servers to communicate with one another.
- Component files: A website is comprised of several files. These files are classified into two types:
+ Code files: Websites are typically developed with HTML, CSS, and JavaScript, while more technologies will
be included later.
+ Assets: This is a catch-all term for anything else that makes up a website, such as photographs, audio, video,
Word documents, and PDFs. When you enter a site URL into your browser (MND Web Docs, 2021):
 The browser connects to the DNS server to determine the true address of the server where the webpage is hosted.
 The browser sends an HTTP request message to the server, requesting that a copy of the website be sent to the
client. This message, as well as any other data communicated between the client and the server, is transmitted
through TCP/IP across your internet connection.
 If the server authorizes the client's request, it gives the client an email "200 OK" message, which says "Of course,
you may visit that website!" This is it ", and then begins transmitting the website's files to the browser in the form of
a series of little pieces known as data packets.
 The browser assembles the little parts into a whole web page and shows it to you. When browsers submit requests
to servers for HTML files, those HTML files frequently contain elements that refer to external CSS stylesheets and
<script> elements that refer to external Javascript script.

It's critical to understand the sequence in which those files are interpreted by the browser while the website loads (MND
Web Docs, 2021):

The browser parses the HTML file first, which allows it to recognize any <link> to external CSS stylesheets and scripts in
the <script> element.

 As the browser parses the HTML, it sends requests to the server for any CSS files it finds from <link> elements and
any JavaScript files it finds from <script> elements and parses the CSS and JavaScript from those requests.
  The browser builds an in-memory DOM tree from the parsed HTML, a CSSOM structure from the parsed CSS, and
compiles and runs the parsed JavaScript.
 A visual representation of the page is painted on the screen when the browser creates the DOM tree, applies the
styles from the CSSOM tree, and runs the JavaScript. The user sees the page content and may begin to interact
with it.

P3. WEB TECHNOLOGIES

1. Explanation of static and dynamic web
a. Static web

Every user sees the same content on every page of a static website, which has consistent content. A dynamic website, on
the other hand, pulls content as it is needed, allowing it to alter as the user does.

HTML, CSS, and Javascript-made webpages make up a static website (all examples of web development languages). A
static website stores each page as a single HTML file, which is sent directly from the server to the webpage in its entirety.
This material effectively merges with your page's design and cannot be changed until the original HTML file is modified at
the source code level (Tomasis, 2021).

Figure 17: Static web

Advantages (Tomasis, 2021):

Faster page loading speed: A static page's structure prioritizes load time, improving browsing efficiency. This sort of
site's content is pre-written and served directly from the server, making caching simpler and reducing the likelihood of
loading delays or UX problems like broken images.

Static websites typically use less server resources and load faster because they don't have to pass through a client server
or database infrastructure. This skill should not be undervalued because page load speed is a big factor in how Google
evaluates a website's performance (and it appears to be having an increasingly important impact on SEO and ranking
performance, too).

Quick creation: When there is a limited amount of time, a static website can be launched more quickly. Since static
websites are less difficult and don't need to be connected to databases with organized material, they may be created and
published more quickly. If created on a WYSIWYG platform, this is even more true.

How innovative you want to be with each page design ultimately determines how long it takes for a static site to become
live. Dynamic alternatives can still be created quickly; however, static pages are typically easier to create and hence
deploy more quickly.

Potential for enhance security: Static website pages should theoretically be harder to hack. This is because there are
fewer places from which to strike them. We'll clarify:

Static pages don't require external plugins or extensions, which can all be frequent entry points for assaults, nor do they
link to a database. In contrast, dynamic websites are not intrinsically risky, but theoretically, a static website is less
vulnerable to assault.

Depending totally on how you decide to create your site, this may or may not be significant. For instance, a static or
dynamic webpage or website built with a website builder like Wix is safeguarded by a variety of security features. You
won't need to be concerned about security thanks to TLS 1.2, DDoS protection, SQL certifications, and other added layers
of website security.

Disadvantages (Tomasis, 2021).:

Limited scalability: Only with larger, content-heavy designs does one of a static website's biggest drawbacks become
apparent. A static website can be built with hundreds of pages, but it will always take a long time.

A static website requires that each page be constructed as a distinct entity. You would have to make each page of a
website with several pages separately.

Less efficient management: Although static websites can be created more quickly, managing them can take more time.
A static website must be edited page by page, which becomes increasingly difficult—and in some circumstances, nearly
impossible—as websites are loaded with more content or have content that changes quickly.

b. Dynamic web

A dynamic website is created utilizing sophisticated server technologies such as PHP, JavaScript, or ASP to create more
dynamic web pages. By dynamic web pages, we mean pages that are interactive and alter dynamically based on time,
region, and user type. Dynamic websites can be linked to a huge database, allowing them to retrieve information as
needed. This aids in the creation of a more user-driven page that adapts as the user desires. On a dynamic website, the
content and information on the page alter in response to user commands (Admin, 2017).

Figure 18: Dynamic web

Advantages (Admin, 2017):

Easy to update: The most significant benefit of a dynamic website is that it can be simply modified to meet the demands
of the business owner. There is no need for professional expertise to update the dynamic website, and a single
modification in the template file will result in a design change on all pages that use that file.

Interactive: Dynamic websites interact with users and alter based on their actions.

Quick responsiveness: A dynamic website can be quickly modified to become responsive to multiple screen sizes,
something a static website cannot.

Smooth navigation: A dynamic website provides smoother navigation and allows the user to bounce from one page to
the next without difficulty.

Disadvantages include (Admin, 2017):

Higher cost: Dynamic websites may be expensive to design, and the cost of hosting is often significant. However, once
constructed, they would not require any extra funding for upgrades or alterations.

Slow processing: Because dynamic websites must execute a lot of operations using complicated technology, they are
slower to process and load.

c. The difference between a static and dynamic web (Singh, 2020)

No. Static Web Dynamic Web

1 Static web pages' pages don't change unless Pages on dynamic websites have different contents
they are manually updated. based on who is visiting.
2 Static web pages are simple in complexity. Understanding dynamic websites can be challenging.

3 Static websites seldom update their content. A dynamic web page's content changes frequently.
4 A static website page loads quicker than a A dynamic web page takes longer to load.
dynamic website page.
5 Static Web Pages don't use a database. In dynamic webpages, a database is used.
 6 HTML, JavaScript, CSS, and other programming Dynamic web pages are made using languages like
languages are used to generate static web CGI, AJAX, ASP, ASP.NET, and others.
pages.
7 Static web pages do not contain any application The application programs for various services are
software. included in dynamic web sites.
8 Designing static web pages takes less time and Dynamic websites take a significant amount of effort
money. and money to design.
2. Front-end and Back-end
a. Front-end

The front end of a website refers to the area that users interact with directly. The phrase "client side of the application" is
also used to describe it. It covers everything that users see and interact with immediately, such as button colors, text
styles, photos, graphs, and tables. For front-end development, three languages are used: HTML, CSS, and JavaScript.
The front end's two primary goals are performance and responsiveness. The website's developer must make sure that it is
responsive, meaning that it displays properly on all types of devices. Regardless of the size of the screen, no portion of
the website should act strangely (geeksforgeeks).

There are several popular front-end frameworks that web developers commonly use, including:

 React: Developed by Facebook, React is a JavaScript library that enables the creation of reusable UI components
and facilitates the building of single-page applications.
 Angular: Developed by Google, Angular is a TypeScript-based framework for building web applications with a focus
on creating complex applications with a lot of data and business logic.
 Vue.js: A lightweight JavaScript framework that is gaining popularity, Vue.js allows developers to build scalable and
maintainable user interfaces.
 Bootstrap: A popular HTML, CSS, and JavaScript framework for building responsive and mobile-first web pages.
 Materialize: Based on Google's Material Design guidelines, Materialize is a front-end framework that provides
ready-to-use UI components for building responsive web applications.

b. Back-end
The website's server side is known as the backend. It also ensures that everything on the client side of the website
functions properly while storing and organizing data. It is the portion of the website that you are unable to view and use. It
is the part of the program that users do not directly interact with. Users indirectly access the components and features
created by backend designers through a front-end application. The backend also includes tasks like writing APIs, building
libraries, and interacting with system elements devoid of user interfaces or even systems of scientific programming
(geeksforgeeks).

Backend frameworks are software frameworks that facilitate the development of server-side applications. Here are some
commonly used backend frameworks:

 Node.js: A JavaScript runtime built on Chrome's V8 JavaScript engine that allows for server-side programming in
JavaScript.
 Ruby on Rails: A web application framework written in the Ruby programming language that follows the model-
view-controller (MVC) architectural pattern.
 Django: A high-level Python web framework that enables rapid development and clean, pragmatic design.
 Flask: A micro web framework written in Python that is lightweight and easy to use.
 Spring: A Java-based framework that provides comprehensive infrastructure support for developing Java
applications.
 Laravel: A PHP web application framework with an elegant syntax and tools for tasks such as routing,
authentication, and caching.

a. Clarify the capabilities and relationship front-end and back-end

The relationship:

Front-end and Back-end are crucial in web development, with the frontend responsible for the visual parts of the website
that users can see and interact with, while the backend manages everything that happens in the background, enabling a
better frontend web experience. The summary provides a clear distinction between the two, emphasizing that both have
different roles, responsibilities, and working environments, with the frontend focused on the client-side and the backend
focused on the server-side.
How these relate to presentation and application layers:

The presentation layer and application layer are two layers in the OSI model used to transmit data over a network.

The presentation layer is responsible for formatting data in a way that can be understood by the receiving system, while
the application layer interacts directly with the user or application software.

The presentation layer handles data encryption, compression, and decryption, while the application layer provides
network services to the application software.

In terms of presentations and applications, the presentation layer ensures that data is properly formatted and displayed to
the user, while the application layer provides the actual software that the user interacts with.

Overall, both layers work together to provide a seamless user experience and ensure efficient and secure data transfer
over a network.
 Figure 19: The 7 Layers of OSI

P4. A REVIEW OF DIFFERENCE WEBSITE TECHNOLOGIES SUPPORTED WITH THE TOOLS AND SOFTWARE
USED TO DEVERLOP WEBSITE
1. Front-end Technologies

Front-end technologies refer to the collection of tools, frameworks, and programming languages that are used to build the
user interface and user experience of a modern website or web application. These technologies enable developers to
create engaging and responsive websites that are both visually appealing and easy to use.

The front-end of a website is responsible for what the user sees and interacts with on the website. It consists of the code
and design elements that run in the user's browser and include HTML, CSS, and JavaScript. HTML provides the basic
structure and content of a website, while CSS is used to add styling and visual design. JavaScript is used to add
interactivity and dynamic functionality to a website.

In addition to these core technologies, front-end frameworks such as React, Angular, and Vue.js are commonly used to
build more complex and interactive web applications. These frameworks provide a set of pre-built components and
modules that can be easily integrated into a website, reducing the development time and effort required.

2. Back-end Technologies

Back-end technologies are the collection of tools, frameworks, and programming languages that are used to build the
server-side components of a modern website or web application. These technologies are responsible for managing data,
performing complex business logic, and handling the processing that occurs behind the scenes of the website.

Back-end technologies typically include server-side scripting languages such as PHP, Python, and Ruby, as well as
database management systems such as MySQL, MongoDB, and PostgreSQL. Application servers such as Apache,
Nginx, and IIS are also commonly used to host and serve web applications.
In addition to these core technologies, back-end frameworks such as Django, Flask, and Ruby on Rails are commonly
used to streamline the development of more complex and scalable web applications. These frameworks provide pre-built
components and modules that can be easily integrated into a website, reducing the development time and effort required.

3. Database

A database is an organized collection of data that can be easily accessed, managed, and updated. Databases are used to
store, retrieve, and manage information for various applications, including websites, mobile apps, and enterprise systems.

There are several types of databases, including relational databases such as MySQL, PostgreSQL, and Oracle, as well as
non-relational or NoSQL databases such as MongoDB and Cassandra. Relational databases use tables to store data, and
relationships are established between tables using keys. NoSQL databases use a document-oriented approach, where
data is stored in documents, making them more flexible and scalable for certain applications.

Database management systems, such as SQL Server, Oracle Database, and MySQL, are used to manage and
administer databases, and provide features such as backup and recovery, security, and performance optimization.

Figure 20: Database

 4. IDEs

An Integrated Development Environment (IDE) is a software application that provides a comprehensive and integrated set
of tools for developing software. IDEs typically include a code editor, a debugger, and a compiler or interpreter, as well as
other features such as code completion, version control, and project management.

There are several popular IDEs available for web development, including Visual Studio Code, Sublime Text, Atom, and
IntelliJ IDEA. These IDEs provide developers with a streamlined and efficient development experience by allowing them to
write, test, and debug their code in a single environment.

IDEs are essential for modern web development because they provide developers with powerful tools and features that
enable them to write efficient and high-quality code. They allow developers to manage their codebase effectively,
collaborate with team members, and speed up the development process. Overall, IDEs are critical for modern web
development and are an indispensable tool for developers.

Figure 21: Integrated Development Environment (IDE)

 5. CMS

A Content Management System (CMS) is a software application that allows users to create, manage, and publish digital
content, typically for websites. CMS platforms provide an easy-to-use interface that enables users to create and edit
content without requiring extensive knowledge of programming languages.

Some popular CMS platforms for web development include WordPress, Drupal, and Joomla. These platforms provide
developers with a range of pre-built templates and plugins that can be customized to meet the needs of their specific
project. CMS platforms also provide features such as user management, search engine optimization, and security, making
them a popular choice for websites of all sizes.

Figure 22: Content Management System (CMS)

6. Website Buiders

Website builder is an online tool or software application that allows users to create and design websites without requiring
extensive knowledge of coding or web development.
There are generally two types of website builders:

 Online website builders: These are web-based tools that allow users to create and customize their website entirely
within a web browser. Users can select pre-built templates and customize the design and layout of their website
using drag-and-drop tools and other customization options.
 Offline website builders: These are software applications that are downloaded and installed on a computer,
allowing users to create and customize their website locally. Offline website builders typically offer more advanced
customization options and greater control over the design and functionality of the website, but may require more
technical knowledge to use effectively.
6.1 Examples of online creation tool
a. Squarespace.com (https://www.squarespace.com)

Simply put, Squarespace is a website builder created to aid in the creation of amazing websites by website owners and
creative minds. You don't need any prior coding experience to use Squarespace. You may create a stunning website with
integrated eCommerce checkout features, a unique domain name, and even SSL certificate security in just a short
amount of time (Squarespace).

Be a customer: To make sure we do that properly, it's essential to cultivate profound empathy for the needs, struggles,
and dreams of our customers. We aim to offer Squarespace's users the same caliber of resources and assistance that we
would expect for ourselves (Squarespace).

Design is not a luxury: Squarespace is steadfast in their pursuit of outstanding design in all they do because they think
that everyone should have access to beautiful design (Squarespace).

Protect creativity: Though ideas can originate from anyone or anyplace, they are fragile and need room to expand and
mature. As we develop new strategies for our product and business, we work to protect the creative process because we
think it is essential to our success (Squarespace).

Learn fast, act fast: Squarespace thinks that the secret to our success is seeking the quickest path to learning and
having a healthy inclination toward action. Squarespace tries to combine the two as much as they can (Squarespace).
Build the ideal: Squarespace develops products that change the game in an effort to influence the direction of our sector.
Squarespace does this by placing bets on big ideas while simultaneously acknowledging that the pursuit of perfection is a
process that necessitates continuous iteration (Squarespace).

b. WordPress (https://wordpress.com)

The Content Management System (CMS) WordPress, which is open-source and free, enables users to build dynamic
websites and blogs. WordPress is the most widely used blogging platform online, and its back-end content management
system (CMS) and other components allow for website upkeep, modification, and management (Tutorialspoint, 2015).

Features (Tutorialspoint, 2015) [14]:

User Management: This feature enables you to manage user information, including creating or deleting users, changing
passwords, and modifying user information. You can also change a user's position to one of the following: subscriber,
contributor, author, editor, or administrator. The main duty of the user manager is authentication.

Media Management: It is a tool for organizing, managing, and uploading media assets with ease. It allows you to handle
media files and directories on your website.

Theme System: It enables you to modify the look and feel of your website. Included are pictures, style guides, template
files, and unique pages.

Add more functionality with plugins: Depending on the user's demands, a variety of plugins are available that provide
specialized features and functionalities.

Multilingual: The user has the option to translate the full content into a different language.

Importers: It makes it possible to import data as posts. All imported items include custom files, comments, post pages,
and tags.
 6.2 Comparison table

Online creation tools Custom built website

Design For your immediate needs, a template-based site Contrarily, a custom website gives you the flexibility
Flexibility could seem to be a sufficient solution, but what if to add features as you see fit while staying within
your business grows? As traffic grows, adding your budget. The site will be expertly designed by
features you don't need could significantly slow your developer to fully accomplish your current
down how quickly your site loads. Functional objectives while also being easily scalable as you
limitations only become worse when more people expand. The volume of visitor traffic that custom
come to the area (Lischer, 2021). websites can handle without compromising
functioning is not constrained by nature (Lischer,
2021).
Performance The price of the hosting choice affects a The price of the hosting service affects the
website's bandwidth, which governs how quickly website's bandwidth. To improve site performance,
it operates. full control and modification of the backend
No back-end intervention is offered. technology are available.
Functionality Additionally prominent are the functional A custom website is also necessary if you want to
limitations of website templates. First of all, not use it for significant e-commerce. Template-based
every template is meant to be fully responsive websites are unable to accommodate the flexible
(i.e., to work as well on mobile devices as they do backend needed for an e-commerce strategy. The
on a desktop.) Being responsive is no longer an security of website templates can potentially be at
option given that mobile traffic currently makes danger. Because a single malicious piece of code
up more than half of all internet traffic (Lischer, may be used to compromise hundreds of sites at
2021). once, template-based websites are a hacker's
dream. Custom sites' distinctive design makes them
less vulnerable to attacks (Lischer, 2021).
UX Inability to install bespoke or supplementary Flexible when it comes to personalizing and
technologies as templates running on a perfecting the website's technology for collecting
structured system, resulting in a lack of control leads or making sales.
over UX.
 UI Template websites are pre-made web pages or
groups of web pages that are essentially clones
of a website's essential core foundation elements
that may then be slightly altered and filled with
your content (Wallis, 2020).
Custom websites are developed utilizing methods
that produce a user interface that is exclusive to the
website. In addition, designers may use the
experience in response to user inputs (any action
done by the user) to produce a range of outputs.
Above all, custom websites will give your customers
a much more unique experience and your own "built
from the ground up website" (Wallis, 2020).

M1. Evaluate the impact of common web development technologies and frameworks with regards to website
design, functionality and management.
1. What is Web Technology? List common web technology?
a. What is Web Technology?

Web technology describes the numerous methods and tools used in the process of interacting with various internet-
connected devices. To access web pages, utilize a web browser. Programs known as web browsers are those that show
text, data, images, animations, and videos on the Internet. Web browsers' software interfaces can be used to access
World Wide Web resources that are hyperlinked.

The following categories can be used to categorize web technology:

- World Wide Web (WWW): The Hypertext Transfer Protocol (HTTP), Web browsers, and other technologies form
the foundation of the World Wide Web (HTTP).
- Web browser: The web browser is a program that allows you to browse the internet (World Wide Web). It
facilitates communication between the client and server and makes requests to the server for web content and
services.
- Web server: A web server is a program that handles users' network requests and provides them with the files
needed to build web pages. Hypertext Transfer Protocol is used for this interaction (HTTP).
- Web pages: A webpage is a digital document connected to the World Wide Web that can be seen by anybody
using the internet and a web browser.
 - Web Development: is referred to as web development. It covers things like web design, web publishing, web
programming, and database administration. It is the building of a website, an application that runs online.

Some common web technologies:

- HTML (Hypertext Markup Language): HTML is the standard markup language used to create web pages. It defines
the structure and content of a web page.
- CSS (Cascading Style Sheets): CSS is used to style web pages and define the visual appearance of a web page.
- JavaScript: JavaScript is a programming language used to add interactivity and dynamic functionality to web
pages. It can be used to create animations, respond to user input, and manipulate the DOM (Document Object
Model).
- jQuery: jQuery is a JavaScript library that simplifies common web development tasks, such as DOM manipulation
and event handling.
- AJAX (Asynchronous JavaScript and XML): AJAX is a technique used to create dynamic web pages that can
update content without requiring a page reload. It uses JavaScript to communicate with the server and update the
content on the page.
- PHP (Hypertext Preprocessor): PHP is a server-side scripting language used to create dynamic web pages and
web applications. It can be used to interact with databases, generate dynamic content, and handle user input.
- MySQL: MySQL is a popular open-source relational database management system (RDBMS) used to store data
for web applications.
- React: React is a JavaScript library used for building user interfaces. It allows developers to create reusable UI
components and build complex, interactive web applications.
- Node.js: Node.js is a JavaScript runtime used for server-side development. It allows developers to use JavaScript
on both the client and server-side, simplifying development and improving performance.
- Bootstrap: Bootstrap is a popular front-end framework that provides pre-built CSS and JavaScript components for
building responsive web applications. It allows developers to create consistent, mobile-friendly web designs more
quickly and easily.

2. Web development Framework

a. What is a framework?
A web development framework is a collection of assets and instruments used by software engineers to create and
maintain websites, web services, and web applications.

b. Advantages
- Faster development: Frameworks provide pre-built components and conventions, which can help developers write
code more quickly and efficiently. This can result in faster development times and shorter time-to-market for
applications.
- Consistency: Frameworks enforce consistency in coding standards and practices across the development team,
ensuring that code is maintainable and easy to understand. This can improve code quality and reduce bugs.
- Reusability: Frameworks provide pre-built components and modules that can be reused across multiple projects,
saving time and effort for developers.
- Scalability: Frameworks provide a solid foundation for building scalable applications that can handle increased
traffic and user demands. This can improve the performance and reliability of applications.
- Security: Frameworks provide built-in security features, such as input validation and authentication mechanisms,
which can help developers build more secure applications.
- Community Support: Frameworks often have a large and active community of developers who contribute to the
development and maintenance of the framework. This can provide access to a wealth of resources, such as
documentation, tutorials, and forums, which can help developers learn and solve problems more quickly.
c. Disadvantages
- Learning Curve: Frameworks often have a learning curve that can be steep, particularly for developers who are
new to the framework or have limited experience with the underlying technologies. This can lead to a slower start-
up time and longer development cycles.
- Dependency: Frameworks can create a dependency on the framework itself, making it difficult to switch to another
framework or technology stack in the future. This can limit flexibility and scalability.
- Overhead: Frameworks can add extra overhead to an application, which can slow down performance and increase
resource usage. This is particularly true for large or complex applications that rely heavily on the framework.
- Limited Flexibility: Frameworks often come with a predefined structure and set of conventions, which may not
always align with the needs of a particular project or development team. This can limit flexibility and creativity in
application design.
- Bloat: Frameworks can sometimes come with a lot of unnecessary features and functionality that may not be
needed for a particular project. This can add bloat to the application and make it more complex than necessary.
 - Versioning: Frameworks may have frequent updates or changes, which can require developers to constantly
update their applications to keep up with the latest version of the framework. This can result in increased
maintenance costs and longer development cycles.
d. List common web development framework

Ruby on Rails: Ruby on Rails (often abbreviated as "Rails") is a popular open-source web framework written in Ruby. It
emphasizes convention over configuration and is designed to make web application development easier and faster.

Django: Django is a high-level web framework written in Python that emphasizes rapid development and clean, pragmatic
design. It includes built-in features such as an ORM (Object-Relational Mapping), user authentication, and admin
interface.

Laravel: Laravel is a PHP-based web application framework that emphasizes elegant syntax, MVC architecture, and
developer productivity. It provides built-in features such as an ORM, authentication, and routing.

Express.js: Express.js is a Node.js-based web application framework that provides a set of robust features for web and
mobile applications. It emphasizes simplicity, flexibility, and scalability.

Spring: Spring is a Java-based framework that provides comprehensive support for building web applications. It includes
features such as dependency injection, aspect-oriented programming, and ORM.

React: React is a JavaScript library for building user interfaces that is often used as a front-end framework for building
complex, dynamic web applications. It provides reusable UI components and emphasizes declarative programming.

Vue.js: Vue.js is a progressive JavaScript framework for building user interfaces. It emphasizes simplicity and ease of
use, and provides a flexible and scalable architecture for building web applications.

Angular: Angular is a TypeScript-based framework for building web applications. It emphasizes modularity, reusable
components, and dependency injection.

Flask: Flask is a lightweight Python-based web application framework that emphasizes simplicity and minimalism. It is
designed to be easy to use and flexible, and is often used for building small to medium-sized web applications.
ASP.NET: ASP.NET is a framework for building web applications on the Microsoft platform. It includes features such as
an MVC framework, routing, and authentication, and supports multiple programming languages including C# and Visual
Basic.

3. Evaluate the impact of common web development technologies and frameworks with regards to website design,
functionality and management.

Common web development technologies and frameworks have had a significant impact on website design,
functionality, and management. Here are some of the ways in which these technologies and frameworks have impacted
web development:

Improved website design: Web development technologies and frameworks have made it easier for designers to create
visually appealing and interactive websites. For example, CSS has made it possible to separate the presentation of a
website from its content, making it easier to create complex layouts and styles.

Enhanced functionality: Web development technologies and frameworks have also made it possible to add new
functionality to websites, such as dynamic content, e-commerce functionality, and real-time communication. For example,
server-side scripting languages like PHP, Python, and Ruby can be used to generate dynamic content, while JavaScript
and its libraries (such as jQuery) can be used to add interactivity to the client-side of a website.

Improved website management: Web development technologies and frameworks have made it easier to manage the
content and functionality of a website. For example, content management systems (CMSs) such as WordPress, Drupal,
and Joomla provide a user-friendly interface for managing website content, without requiring technical expertise in web
development.

Faster development times: Web development technologies and frameworks have made it possible to develop websites
faster and more efficiently. For example, web development frameworks, such as Ruby on Rails, Django, and Laravel,
provide a pre-built structure for building websites, reducing the time it takes to develop a website from scratch.

Increased accessibility: Web development technologies and frameworks have made it possible to create websites that
are accessible to a wider range of users, including users with disabilities. For example, the use of CSS and JavaScript
can make it possible to create websites that are accessible to screen readers and other assistive technologies.
In conclusion, common web development technologies and frameworks have had a significant impact on website design,
functionality, and management. They have made it possible to create more visually appealing and functional websites,
improve website management, speed up development times, and increase accessibility.

M2. Review the influence of search engines on website performance and provide evidencebased support for
improving a site’s index value and rank through search engine optimisation.
1. Concept of search engine

A search engine is a software program that enables users to search and retrieve information from the internet. The search
engine's primary function is to provide users with relevant results based on their search queries.

Search engines use complex algorithms to analyze and index web pages, allowing them to provide users with a list of
relevant results for their search terms. When a user enters a search query into the search engine, the search engine
quickly scans its index to identify web pages that match the user's query.

Search engines use a variety of techniques to rank search results. These techniques include analyzing the content of web
pages, evaluating the authority and relevance of external links to a web page, and using machine learning algorithms to
understand the intent behind a user's search query.

Some popular search engines include Google, Bing, Yahoo!, and DuckDuckGo. These search engines are used by
millions of people around the world to find information on a wide range of topics.

Search engines have become an essential tool for information discovery, research, and decision-making. They are used
by businesses to attract new customers, by researchers to discover new information, and by individuals to find answers to
their questions.

2. Concept of SEO

Search engine optimization (SEO) is the practice of optimizing a website to improve its visibility and ranking on search
engine results pages (SERPs). The ultimate goal of SEO is to increase the quantity and quality of organic (non-paid)
traffic to a website.
Search engines use complex algorithms to determine the relevance and usefulness of a website for a particular search
query. SEO involves various techniques and strategies to align a website's content, structure, and other factors with these
algorithms to improve its ranking and visibility.

3. Technical solution to improve website index based on SEO

Here are some technical solutions to improve a website's index based on SEO:

- Optimize website structure: Search engines use crawlers to navigate and index web pages. A clear website
structure and URL hierarchy make it easier for these crawlers to understand the relationship between pages and
index them correctly. Implementing a logical hierarchy for pages and creating clean, descriptive URLs can help
improve website indexing.
- Use proper HTML tags: HTML tags provide structure and organization to a web page's content. Using proper
HTML tags, such as H1, H2, and H3, can help signal to search engines the importance of different sections of a
page. Using tags correctly can help improve website indexing and ranking.
- Optimize page titles and meta descriptions: The page title and meta description appear in search engine results
and can influence a user's decision to click on a link. Optimizing page titles and meta descriptions with relevant
keywords and descriptions can help improve click-through rates and website indexing.
- Use schema markup: Schema markup is a code that provides additional context to search engines about the
content on a web page. Adding schema markup to a website can help improve website indexing and provide more
detailed search results for users. For example, adding schema markup for local businesses can provide users with
more detailed information about the business in search results, such as hours of operation and customer reviews.
- Optimize images: Images can significantly impact website indexing and ranking. Optimizing image filenames, alt
tags, and descriptions with relevant keywords can help improve website indexing. It's also important to ensure that
images are compressed and optimized for web use to improve website speed.
- Implement responsive design: Responsive design ensures that a website is optimized for all devices, including
mobile devices. This can help improve website indexing and ranking as search engines favor mobile-friendly
websites. Implementing responsive design can also improve user experience and reduce bounce rates.
 - Improve website speed: Website speed is a crucial factor in website indexing and ranking. Slow website speed can
negatively impact user experience and increase bounce rates. Optimizing website speed through techniques such
as compression, minification, and caching can help improve website indexing.
- Implement HTTPS: HTTPS is a secure protocol that encrypts data transmitted between a website and a user's
browser. Implementing HTTPS can help improve website indexing and ranking, as search engines prioritize secure
websites. HTTPS can also improve user trust and confidence in a website.

M3. Evaluate a range of tools and techniques available to design and develop a custom built website.
1. Tools

The table below will identify the pros and cons of some tools available to design and develop a custom-built
website:

Advantage
- User-friendly interface:
NetBeans has a simple and
intuitive interface that makes it
easy to use for both beginners
and experienced developers.
- Robust code editor: NetBeans
comes with a powerful code
editor that supports syntax
highlighting, auto-completion,
and debugging.
NetBeans - Cross-platform support:
NetBeans is available for
Windows, macOS, and Linux,
making it easy for developers
to use the same IDE across
multiple operating systems.
- Customizable: NetBeans allows
users to customize the
interface and add plugins to
Disadvantage
- Slow performance: NetBeans
can be slow and resource-
intensive, especially when
working with large projects or
complex code.
- Limited support for mobile
development: While NetBeans
supports mobile development,
it has limited support compared
to other IDEs like Android
Studio.
- Limited support for newer
programming languages:
NetBeans has limited support
for newer programming
languages like Kotlin and Swift.
- Plugin compatibility issues:
Some plugins may not be
compatible with the latest
 extend the functionality of the
IDE.
- Support for multiple
programming languages:
NetBeans supports several
programming languages,
including Java, C++, HTML,
and CSS.
- Lightweight and fast: Sublime
Text is known for its fast
performance and is considered
to be one of the fastest text
editors available.
- Highly customizable: Sublime
Text can be customized to suit
a developer's preferences and
workflow. Users can create
their own shortcuts, themes,
and plugins.
Sublime Text - Cross-platform support:
Sublime Text is available for
Windows, macOS, and Linux,
making it easy for developers
to use the same editor across
multiple operating systems.
- Multiple selections and editing:
Sublime Text has a unique
feature that allows users to
select and edit multiple lines of
code simultaneously.
- Powerful search and replace:
Sublime Text has a powerful
search and replace function
that supports regular
version of NetBeans, which can
lead to compatibility issues.
- Steep learning curve for some
features: While NetBeans has a
user-friendly interface, some of
its features, such as the project
configuration and deployment,
can have a steep learning
curve for beginners.
- Proprietary software: Sublime
Text is not open-source, and
users need to purchase a
license to use it after the free
trial period.
- Limited IDE functionality: While
Sublime Text is a powerful text
editor, it lacks some of the
features of a full-fledged
integrated development
environment (IDE).
- Limited debugging support:
Sublime Text has limited
support for debugging, making
it challenging to debug code
without using external tools.
- Limited collaboration features:
Sublime Text has limited
collaboration features, making
it difficult for teams to work
together on the same
codebase.
- Steep learning curve: Sublime
Text has a steep learning curve
compared to some other text
 expressions, making it easy to
find and replace code.
- Cross-platform support: Visual
Studio Code is available for
Windows, macOS, and Linux,
making it easy for developers
to use the same editor across
multiple operating systems.
- Large community and support:
Visual Studio Code has a large
and active community of users
and developers, which means
there are many resources and
extensions available for users
to customize and extend the
editor.
- Highly customizable: Visual
Studio Code can be
Visual studio code customized to suit a
developer's preferences and
workflow. Users can create
their own shortcuts, themes,
and plugins.
- Intuitive user interface: Visual
Studio Code has a simple and
intuitive user interface that is
easy to navigate and use for
both beginners and
experienced developers.
- Built-in debugging and version
control support: Visual Studio
Code has built-in debugging
and version control support,
which makes it easier to debug
and manage code.
editors, which may be
challenging for beginners.
- Resource-intensive: Visual
Studio Code can be resource-
intensive, especially when
working with large projects or
complex code, which can slow
down performance on older or
less powerful computers.
- Steep learning curve: Visual
Studio Code has a steep
learning curve compared to
some other code editors, which
may be challenging for
beginners.
- Limited collaboration features:
Visual Studio Code has limited
collaboration features, making
it difficult for teams to work
together on the same codebase
without using external tools.
- Requires extensions for full
functionality: While Visual
Studio Code is highly
customizable, some users may
find that they need to install
many extensions to get the full
functionality they need for their
development tasks.
- Proprietary software: Visual
Studio Code is not open-
source, and users may have
concerns about the security
and privacy of their code when
using proprietary software.
2. Techniques
Advantage
PHP - Open-source: PHP is an open-
source programming language,
which means that it is freely
available and can be modified
and distributed by anyone.
- Easy to learn: PHP has a
simple and easy-to-learn
syntax, which makes it
accessible for beginners and
experienced developers alike.
- Large community and support:
PHP has a large and active
community of users and
developers, which means there
are many resources and
frameworks available for users
to customize and extend the
language.
- Platform-independent: PHP is
platform-independent, which
means that it can run on
different operating systems and
platforms, including Windows,
macOS, Linux, and Unix.
- Wide range of applications:
PHP can be used for a wide
range of web development
applications, including dynamic
web pages, e-commerce
websites, and content
management systems.
Disadvantage
- Security issues: PHP has had
some security issues in the
past, and developers need to
be careful to avoid
vulnerabilities such as SQL
injection attacks.
- Inconsistent function naming:
PHP has inconsistent function
naming conventions, which can
be confusing for developers
who are new to the language.
- Performance issues: PHP can
be slower than some other
programming languages,
especially when working with
large or complex applications.
- Lack of strong typing: PHP is a
weakly typed language, which
can make it difficult to identify
and fix errors in code.
- Maintenance issues: PHP code
can be difficult to maintain and
update over time, especially if it
has been developed using
older versions of the language
or with poor coding practices.
HTML - Easy to learn: HTML has a
simple and easy-to-learn
syntax, which makes it
accessible for beginners and
experienced developers alike.
- Platform-independent: HTML
can be rendered on any device
with a web browser, including
computers, tablets, and
smartphones, making it a
versatile and widely accessible
technology.
- Flexible: HTML can be used to
create a wide range of web
content, including static web
pages, dynamic web pages,
and interactive web
applications.
- Standardized: HTML is a
standardized language that is
supported by all major web
browsers and web
development tools, making it a
reliable and consistent
technology.
- SEO-friendly: HTML can be
optimized for search engines,
which makes it easier for
websites to rank higher in
search engine results and
attract more visitors.
- Limited functionality: HTML is a
markup language, which
means that it can only define
the structure and content of
web pages, and it cannot be
used to create dynamic or
interactive features without the
use of additional technologies
like CSS and JavaScript.
- Maintenance issues: HTML
code can be difficult to maintain
and update over time,
especially if it has been
developed using outdated or
poor coding practices.
- Accessibility issues: HTML can
be difficult to use for users with
disabilities, especially if web
developers do not use proper
accessibility techniques and
standards.
- Security issues: HTML code
can be vulnerable to security
threats, such as cross-site
scripting attacks, if web
developers do not take proper
security measures.
- Limited control over page
layout: HTML provides limited
control over the layout and
styling of web pages without
the use of additional
technologies like CSS, which
can be challenging for web

CSS - Separation of concerns: CSS
allows web developers to
separate the presentation and
layout of web pages from the
content, which makes it easier
to maintain and update
websites over time.
- Consistent styling: CSS
provides consistent styling
across multiple pages and
websites, which helps to
establish a consistent brand
identity and user experience.
- Accessibility: CSS allows web
developers to create accessible
web content that can be easily
read and used by people with
disabilities, such as visual
impairments.
- Flexibility: CSS provides a wide
range of styling options and
techniques, which allows web
developers to create custom
and complex designs and
layouts.
- Efficient page loading: CSS can
help to reduce the file size of
web pages, which can improve
page loading times and overall
website performance.
Javascrip - Client-side scripting: JavaScript
can be executed on the client-
developers who want to create
custom and complex designs.
- Browser compatibility issues:
CSS can be interpreted
differently by different web
browsers, which can result in
inconsistent website layouts
and styling across different
devices and platforms.
- Learning curve: CSS has a
steep learning curve, and it can
be challenging for beginners to
master the syntax and
concepts.
- Lack of security: CSS does not
provide any security features,
and web developers need to be
careful to avoid vulnerabilities
such as cross-site scripting
attacks.
- Limitations of browser support:
Some advanced CSS features
may not be supported by all
web browsers, which can limit
the functionality and design
options available to web
developers.
- Maintenance issues: CSS code
can be difficult to maintain and
update over time, especially if it
has been developed using
outdated or poor coding
practices.
- Security risks: JavaScript can
be vulnerable to security
 side, which means that it can
be used to create dynamic and
interactive web content without
the need for server-side
processing.
- Versatility: JavaScript is a
versatile language that can be
used for a wide range of web
development tasks, such as
form validation, animation, user
interface design, and web
application development.
- Integration: JavaScript can be
easily integrated with other web
development technologies,
such as HTML and CSS, as
well as with backend
programming languages like
PHP and Java.
- Rich library of frameworks and
plugins: JavaScript has a large
and active community of
developers, which has created
a rich library of frameworks,
plugins, and libraries that can
be used to simplify and
accelerate web development.
- Cross-platform support:
JavaScript can be executed on
multiple platforms, including
web browsers, desktop
applications, and mobile
devices, which makes it a
versatile and widely accessible
technology.
threats such as cross-site
scripting (XSS) attacks, which
can compromise the security of
websites and web applications.
- Browser compatibility issues:
JavaScript can be interpreted
differently by different web
browsers, which can result in
inconsistent website behavior
across different devices and
platforms.
- Limited server-side capabilities:
Although JavaScript can be
executed on the server-side
using technologies like Node.js,
it is not as well-suited for
server-side processing as other
programming languages like
PHP and Python.
- Steep learning curve:
JavaScript has a steep learning
curve, and it can be challenging
for beginners to master the
syntax and concepts.
- Performance issues: JavaScript
code can be slower to execute
than compiled programming
languages like C++ and Java,
which can limit its suitability for
high-performance applications.
 Ajax - Improved user experience:
AJAX allows web pages to
update content dynamically
without requiring a page
refresh, which provides a
smoother and more responsive
user experience.
- Reduced server load: AJAX
can help to reduce server load
and bandwidth usage, since
only the necessary data is sent
to and from the server, which
can improve website
performance.
- Asynchronous processing:
AJAX allows web applications
to execute code
asynchronously, which means
that other tasks can continue
running in the background
while waiting for server
responses, resulting in faster
and more efficient processing.
- Enhanced functionality: AJAX
enables the creation of
interactive and dynamic web
applications with advanced
features such as real-time data
updates and auto-complete
search boxes.
jQuery - Simplifies JavaScript
programming: jQuery simplifies
JavaScript programming by
providing an easy-to-use API
- Increased complexity of code:
AJAX requires more complex
coding techniques than
traditional web development
methods, which can make it
more difficult to develop and
maintain.
- Dependency on JavaScript:
AJAX relies heavily on
JavaScript, which means that
users must have JavaScript
enabled in their browsers in
order for the application to
function properly.
- Difficulty in debugging and
testing: AJAX can be more
difficult to debug and test than
traditional web development
methods, since it involves
multiple technologies and can
have unpredictable behavior.
- Security risks: AJAX can pose
security risks such as cross-site
scripting attacks, which can be
more difficult to detect and
prevent than traditional web
application security risks.
- Dependency on JavaScript:
jQuery requires JavaScript to
be enabled in the user's
browser, which can limit the
accessibility of the website to
 that abstracts away the
complexity of JavaScript code.
- Cross-browser compatibility:
jQuery provides a unified API
for interacting with the
Document Object Model (DOM)
that works across all major
browsers, which helps to
ensure consistent behavior and
functionality.
- Large community and plugin
ecosystem: jQuery has a large
and active community of
developers, which has resulted
in the creation of a vast
ecosystem of plugins and
extensions that can be used to
extend the functionality of
jQuery.
- Enhances web page
interactivity: jQuery allows
developers to easily add
interactivity to web pages with
features such as animations,
form validation, and AJAX.
users who have JavaScript
disabled.
- Performance overhead: jQuery
can add a performance
overhead to web pages due to
the additional JavaScript code
that needs to be downloaded
and executed.
- Large file size: The file size of
jQuery can be large, which can
increase the time it takes for
web pages to load.
- Can lead to code bloat: jQuery
can lead to code bloat if it is
used excessively, which can
make the codebase more
difficult to maintain and update.

D1. Justify the tools and techniques chosen to realize a custom built website.
The choice of tools and techniques for building a custom website is critical as it can impact the development
process, website performance, and user experience. The following is a detailed justification of the tools and techniques
that are typically chosen for custom website development:

Content Management Systems (CMS): CMS like WordPress or Drupal are widely used for custom website development
because they offer an intuitive interface for managing and organizing website content. They provide features such as
templates, themes, and plugins that can be used to customize the appearance and functionality of a website without
requiring extensive technical knowledge.

HTML, CSS, and JavaScript: HTML provides the structure of a website, CSS provides its styling, and JavaScript provides
interactivity and dynamic behavior. These technologies form the foundation of any custom website and are crucial for
creating a website that is accessible, search engine optimized, and performant.

Responsive Design: With the rise of mobile devices, it is important for websites to be optimized for different screen sizes
and devices. Responsive design techniques ensure that a website can adapt to different screens and provide a good user
experience, regardless of the device being used.

Server-side scripting: For websites that require more dynamic functionality, server-side scripting languages such as PHP
or Python can be used to create dynamic pages, process data from users, and interact with databases. This allows for the
creation of more complex and interactive websites that can respond to user input and provide personalized content.

Databases: For websites that require the storage of large amounts of data, databases such as MySQL or MongoDB can
be used to manage and store data efficiently. This ensures that data is organized, retrievable, and secure, making it
easier to manage and update over time.

Version control: Tools such as Git allow for easy collaboration and version control during the development process,
making it easier to track changes, revert to previous versions if necessary, and manage conflicts between multiple
developers.

Testing and Debugging Tools: Tools such as automated testing frameworks, debugging tools, and performance
monitoring tools help to ensure that a website is reliable, secure, and performs well under different conditions.

These are just some of the tools and techniques that are commonly used in custom website development. The specific
tools and techniques used will depend on the requirements and goals of each project. It is important to choose the right
tools and techniques to ensure that a website is developed effectively and efficiently, and meets the needs of its users.
Referance
CDNetworks, 2021.[Online]

Available at: https://www.cdnetworks.com/web-performance-blog/what-is-a-dns-server/

[Accessed 06 February 2023].

Cloudflare. [Online]

Available at: https://www.cloudflare.com/learning/dns/dns-server-types/

[Accessed 06 February 2023].

DomainTools, 2021.[Online]

Available at: https://www.domaintools.com/support/what-is-a-domain-name-and-what-does-it-do#

[Accessed 06 February 2023].

Ard.edu, 2022.[Online]

Available at: https://ardc.edu.au/resource/standardised-communications-protocols/

[Accessed 06 February 2023].

Moore, 2020.[Online]

Available at: https://www.techtarget.com/searchdatacenter/Server-hardware-guide-to-architecture-products-and-

management

[Accessed 06 February 2023].

Singh, 2022. [Online]

Available at: https://www.geeksforgeeks.org/functions-of-operating-system/

[Accessed 06 February 2023].

(Gillis, 2020

Gillis, 2020. [Online]

Available at: https://www.techtarget.com/whatis/definition/Web-server

[Accessed 07 February 2023].

MND Web Docs, 2021. [Online]

Available at:
https://developer.mozilla.org/enUS/docs/Learn/Getting_started_with_the_web/How_the_Web_works?retiredLocale=vi

[Accessed 07 February 2023].

Tomasis, 2021. [Online]

Available at: https://www.wix.com/blog/2021/11/static-vs-dynamic-website/

[Accessed 07 February 2023].

Singh, M. K., 2020. GeeksforGeeks. [Online]

Available at: https://www.geeksforgeeks.org/difference-between-static-and-dynamic-web-pages/

[Accessed 07 February 2023].

(geeksforgeeks) [11].

GeeksforGeeks. [Online]

Available at: https://www.geeksforgeeks.org/frontend-vs-backend/

[Accessed 07 February 2023].

Khillar, S., 2018. DifferenceBetween.net. [Online]

Available at: http://www.differencebetween.net/technology/difference-between-frontend-and-backend/

[Accessed 07 February 2023].

Squarespace

Squarespace. [Online]

Available at: https://www.squarespace.com/about/company

[Accessed 09 February 2023].

Tutorialspoint, 2015. [Online]

Available at: https://www.tutorialspoint.com/wordpress/wordpress_overview.htm

[Accessed 09 February 2023].

Lischer, B., 2021. ignyte. [Online]

Available at: https://www.ignytebrands.com/custom-website-vs-template-website/

[Accessed 09 February 2023].

Wallis, J., 2020. WEBO Digital. [Online]

Available at: https://webo.digital/blog/custom-built-vs-template-websites-which-is-better/

[Accessed 09 February 2023].

uow.edu [Online]

Available at: https://www.uow.edu.au/student/learning-co-op/technology-and-software/operating-systems

[Accessed 09 February 2023].