Scribd
Upload
19 views14 pages

UCI 201 Individual Practical Assignment

Uploaded by

Denis Kioko
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
19 views14 pages

UCI 201 Individual Practical Assignment

Uploaded by

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

UCI 201: Internet and WWW

Individual Assignment

PRACTICAL ASSIGNMENT

Develop a web site using HTML code for a business firm selling goods. In the site
developed, it should detailed the following;

 Name of the company and its contacts


 Company profiles
 Areas of services offered
 Personnel profile.

Note: Use colors, graphics, video, text to enhance the appearance of your site.

Submision:

Print list of group members, HTML codes used, the screen shot for various
windows
Group Members:
HTML CODE:

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8" />

<meta name="viewport" content="width=device-width, initial-scale=1.0" />

<title>Whitestar Trade & Supplies</title>

<style>

/* Basic styling */

body {

font-family: Arial, sans-serif;

margin: 0;

padding: 0;

color: #333;

header {

background-color: #164b60;

color: white;

text-align: center;

padding: 20px;

}
nav ul {

list-style: none;

padding: 0;

margin: 0;

background-color: #164b60;

text-align: center;

nav ul li {

display: inline;

padding: 10px 15px;

nav ul li a {

color: white;

text-decoration: none;

font-weight: bold;

section {

padding: 20px;

}
footer {

background-color: #164b60;

color: white;

text-align: center;

padding: 10px;

position: fixed;

bottom: 0;

width: 100%;

.profile-photo,

.video-content {

display: block;

margin: 0 auto;

width: 100%;

height: 480px;

h2 {

color: #164b60;

/* Container layout */
.container {

max-width: 1000px;

margin: auto;

</style>

</head>

<body>

<!-- Header Section -->

<header>

<h1>Whitestar Trade & Supplies</h1>

<p>Your Trusted Partner in Quality Goods</p>

</header>

<!-- Navigation Menu -->

<nav>

<ul>

<li><a href="#home">Home</a></li>

<li><a href="#company-profile">Company Profile</a></li>

<li><a href="#services">Services</a></li>

<li><a href="#team">Our Team</a></li>

<li><a href="#contact">Contact Us</a></li>

</ul>

</nav>
<!-- Home Section -->

<section id="home" class="container">

<h2>Welcome to Whitestar Trade & Supplies</h2>

<p>

At Whitestar Trade & Supplies, we are committed to providing

high-quality products to meet your needs. With a wide range of goods and

a dedicated team, we ensure that our customers receive only the best in

quality and service.

</p>

<img

src="company.jpg"

alt="Company Building"

class="profile-photo"

width="600"

height="300"

/>

</section>

<!-- Company Profile Section -->

<section id="company-profile" class="container">

<h2>Company Profile</h2>

<p>
Whitestar Trade & Supplies was established in 2005 with the aim of

bridging the gap between quality products and accessibility in the

market. Over the years, we have expanded our product range and built a

network that ensures timely and efficient distribution across the

region.

</p>

<p>

Our core values include integrity, quality, and customer satisfaction,

which have been the pillars of our success and growth in the industry.

</p>

</section>

<!-- Services Section -->

<section id="services" class="container">

<h2>Our Services</h2>

<ul>

<li>Product Sourcing and Distribution</li>

<li>Wholesale and Retail Sales</li>

<li>Logistics and Supply Chain Management</li>

<li>After-sales Support and Customer Service</li>

</ul>

<video class="video-content" width="600" height="400" controls>

<source src="companyVid.mp4" type="video/mp4" />


Your browser does not support the video tag.

</video>

</section>

<!-- Personnel Profile Section -->

<section id="team" class="container">

<h2>Our Team</h2>

<p>

Our team consists of experienced professionals who are dedicated to

ensuring that Whitestar Trade & Supplies delivers top-notch service and

products.

</p>

<!-- Individual Team Member Profiles -->

<div>

<h3>John Doe - CEO</h3>

<p>

John has over 20 years of experience in the industry and has been

instrumental in guiding the company to its current position.

</p>

<img

src="2jpg.jpg"

alt="John Doe"
class="profile-photo"

width="150"

height="150"

/>

</div>

<div>

<h3>Jane Smith - Head of Sales</h3>

<p>

Jane leads our sales department with a focus on client satisfaction

and expanding our customer base.

</p>

<img

src="1.jpg"

alt="Jane Smith"

class="profile-photo"

width="150"

height="150"

/>

</div>

</section>

<!-- Contact Section -->


<section id="contact" class="container">

<h2>Contact Us</h2>

<p>

If you have any questions or would like to know more about our products

and services, feel free to reach out to us:

</p>

<p>Address: 123 Business Street, Nairobi, Kenya</p>

<p>Email: [email protected]</p>

<p>Phone: +254-700-123-456</p>

<form action="submit_contact_form.php" method="POST">

<label for="name">Name:</label><br />

<input type="text" id="name" name="name" required /><br />

<label for="email">Email:</label><br />

<input type="email" id="email" name="email" required /><br />

<label for="message">Message:</label><br />

<textarea id="message" name="message" required></textarea><br />

<button type="submit">Submit</button>

</form>

</section>

<!-- Footer -->

<footer>

<p>&copy; 2024 Whitestar Trade & Supplies. All rights reserved.</p>


</footer>

</body>

</html>

Website Link:
SCREENSHOTS:

1. Name of the company and its contacts

2. Company profiles

3. Areas of services offered

4. Personnel profile.

You might also like