MUSA BASHIR

BSCLMR178021
CSC 4225:XML AND WEB TECHNOLOGIES CAT
SECTION A
1. You have been tasked with developing a banking website for a financial institution. The
application will include features such as account management, transaction processing, fraud
detection and online banking functionalities.
a) Using relevant examples discuss 5 factors that you would consider when developing the
website. (5 Marks)
 Security and privacy: Banking websites handle sensitive financial information, so it is
essential to implement robust security measures to protect user data. This includes using
encryption, firewalls, and intrusion detection systems to prevent unauthorized access to
the website and its data.
 Scalability and performance: Banking websites must be able to handle a large number of
users and transactions simultaneously. The website must also be able to respond quickly
to user requests. This can be achieved by using a scalable architecture and performance
optimization techniques.
 Usability and accessibility: Banking websites should be easy to use for all users,
including those with disabilities. This means using clear and concise language, avoiding
unnecessary complexity, and providing alternative text and image descriptions for users
who are visually impaired.
 Compliance: Banking websites must comply with all applicable regulations, such as those
related to financial data security and privacy.
 Customer experience: Banking websites should be designed to provide a positive
customer experience. This means making it easy for users to find the information and
services they need, and resolving any problems they may encounter quickly and
efficiently.
b) Using relevant examples explain 2 challenges that you are likely to encounter in the
development process. (5 Marks)
 Complexity: Banking websites are complex systems that must integrate with a variety of
back-end systems, such as core banking systems and fraud detection systems. This
complexity can make it difficult to develop and maintain the website.
  Security: Banking websites are a prime target for cyberattacks. Developers must be
vigilant in implementing and maintaining security measures to protect the website and its
users' data.
Example:
 Complexity: A banking website might need to integrate with a core banking system to
allow users to check account balances and transaction history. It might also need to
integrate with a fraud detection system to identify and prevent fraudulent transactions.
This complexity can make the website difficult to develop and maintain.
 Security: A banking website might be targeted by hackers who want to steal user data or
disrupt its operations. Developers must implement security measures such as encryption,
firewalls, and intrusion detection systems to protect the website and its users' data.
2. You have been tasked with developing a website for the Thika School of the Blind. Discuss 5
factors that you would consider when developing the website that would allow the students to
interact with it.. (5 Marks)
1. Accessibility: The website should be designed to be accessible to users with visual
impairments. This means using text-to-speech and screen reader support, and providing
alternative text and image descriptions for all images.
2. Navigation: The website should have a simple and intuitive navigation system that is easy
to use with a keyboard.
3. Content: The website's content should be written in a clear and concise style that is easy
to understand. It should also be well-organized and easy to navigate.
4. Design: The website's design should be visually appealing and easy to use. It should also
be consistent with the school's branding.
5. Feedback: The website should provide users with feedback on their interactions. This
could be done through the use of audio cues, or by providing text descriptions of actions
that have been performed.
SECTION B
1. Write a suitable HTML code for the figure shown below;

Answer
<table>
<thead>
<tr>
<th>NAMES</th>
<th>REGISTRATION NUMBER</th>
<th>COURSE UNIT</th>
<th>MARKS</th>
<th>COMMENT</th>
</tr>
</thead>
<tbody>
<tr>
<td>IAN KIOKO</td>
<td>1657</td>
<td>ICT</td>
<td>90</td>
<td>EXCELLENT</td>
</tr>
<tr>
<td>JANE MUSAU</td>
<td>7890</td>
<td>TAX</td>
<td>40</td>
<td>POOR</td>
</tr>
<tr>
<td>FARIDA WANJIRU</td>
<td>2345</td>
 <td>ACCOUNTING</td>
<td>50</td>
<td>FAIR</td>
</tr>
<tr>
<td>ALICE APIYO</td>
<td>367</td>
<td>FINANCE</td>
<td>70</td>
<td>GOOD</td>
</tr>
<tr>
<td>ROBERT MAINA</td>
<td>7823</td>
<td>SYSTEM DESIGN</td>
<td>90</td>
<td>EXCELLENT</td>
</tr>
<tr>
<td>GRACE KAMIL</td>
<td>7835</td>
<td>HISTORY</td>
<td>34</td>
<td>POOR</td>
</tr>
</tbody>
</table>

2. Write a HTML/CSS code that will generate the output below

<!DOCTYPE html>
<html>
<head>
<style>
body {
font-family: sans-serif;
}

h1 {
text-align: center;
}

table {
border-collapse: collapse;
width: 100%;
}

th, td {
padding: 10px;
border: 1px solid black;
}

.title {
background-color: #ccc;
}
</style>
</head>
<body>
<h1>Student Registration</h1>

<table border="1">
<tr class="title">
<th>Name</th>
<th>Email</th>
<th>Phone</th>
</tr>
<tr>
<td>Alice Apiyo</td>
<td>alice.apiyo@example.com</td>
<td>+254 712 345 678</td>
</tr>
 <tr>
<td>Farida Wanjiru</td>
<td>farida.wanjiru@example.com</td>
<td>+254 701 234 567</td>
</tr>
<tr>
<td>Grace Kamil</td>
<td>grace.kamil@example.com</td>
<td>+254 789 012 345</td>
</tr>
<tr>
<td>Ian Kioko</td>
<td>ian.kioko@example.com</td>
<td>+254 787 654 321</td>
</tr>
<tr>
<td>Jane Musau</td>
<td>jane.musau@example.com</td>
<td>+254 790 123 456</td>
</tr>
<tr>
<td>Robert Maina</td>
<td>robert.maina@example.com</td>
<td>+254 713 567 890</td>
</tr>
</table>
</body>
</html>
 3. Write a HTML/CSS code that will generate the output below. Set the background-color of
3 different elements. The background-colors are: green; purple and light blue.

Answer

<!DOCTYPE html>
<html>
<head>
<style>
.element1 {
background-color: green;
}

.element2 {
background-color: purple;
}

.element3 {
background-color: lightblue;
}
</style>
</head>
<body>
<div class="element1">This is element 1 with a green background</div>
<div class="element2">This is element 2 with a purple background</div>
<div class="element3">This is element 3 with a light blue background</div>
</body>
</html>
4. Write a HTML/CSS code that will generate the output below.

<body>
<div class="container">
<h1>Travel reservation form</h1>
<h3>* denotes mandotory</h3>
<form id="registration_form" method="POST">
<label>Full name*:</label><br>
<input type="text" name="full_name" placeholder="FirstName LastName"
autofocus="autofocus" value=""><br>
<label>Email address*:</label><br>
<input type="text" name="email_addr" value=""><br>
 <label>Select Tour Package* :</label><br>
<select name="package">
<option value="Goa" >Goa</options>
<option value="Nairobi" >Nairobi</options>
<option value="Kisumu" >Kisumu</options>
</select><br>
<label>Arrival date*:</label><br>
<input type="text" name="arv_dt" placeholder="m/d/y" value=""><br>
<label>Number of persons*:</label><br>
<input type="text" name="persons" value=""s><br>
<label>What would you want to avail?*</label> <br>
Boarding<input type="checkbox" name="facilities[]" value="boarding" ><br>
Fooding<input type="checkbox" name="facilities[]" value="fooding" ><br>
Sight seeing<input type="checkbox" name="facilities[]" value="sightseeing" ><br>
<label>Discount Coupon code:</label><br>
<input type="text" name="dis_code" value=""><br>
<label>Terms and conditions*</label><br>
<input type="radio" name="tnc" value="agree" checked>I agree
<input type="radio" name="tnc" value="disagree" >I disagree<br>
<button type="submit" class="btn btn-large btn-primary" name="submit">Complete
reservation</button>
</form>
</div>
</body>