Download as docx, pdf, or txt
Download as docx, pdf, or txt
You are on page 1of 13

Statement and Confirmation of Own Work

A signed copy of this form must be submitted with every assignment.


If the statement is missing your work may not be marked.

Student Declaration

I confirm the following details:

Candidate Name: VINCENT CHIKAFA

Candidate ID Number: 00186336

Qualification: LEVEL 4 DIPLOMA IN COMPUTING

Unit: DDW

Centre: NACIT LILONGWE CAMPUS

I have read and understood both NCC Education’s Academic Misconduct Policy and the
Referencing and Bibliographies document. To the best of my knowledge my work has
been accurately referenced and all sources cited correctly.

I confirm that this is my own work and that I have not colluded or plagiarised any part of it.

Candidate Signature:

Date: 27 July 2020

Page 1 of 13
521922737.docx
Table of Contents
Acknowledgement................................................................................................................2
Task 3 – Test the Website and Write a Test Report................................................................6
a) Validation HTML and CSS Code.....................................................................................6
TASK 4............................................................................................................................12
Conclusion..........................................................................................................................12

Acknowledgement
Let me acknowledge Mr and Mrs Mfune, my parents Mr and Mrs Chikafa and all family
members for giving me resources, time and prayers of wisdom and good health that
contributed to everything of this work. I also thank the lord almighty God for the greatness
protection and good health.

Introduction
In this report I will explain the documentation of my website I have created. It will tackle
much on the codes I have produced to come with the whole website. Basically the website
is created using language of Hypertext markup language and cascading style sheet.
Website is all about the rambling which focus much on offering travels and walks to the
people in community to visit beautiful and pleasure places. The rambling club have 7
pages which are home page, blog, register, about, Q&A, book online, and current
programme.
Index.html/home page description and screen shot below.

Page 2 of 13
521922737.docx
Now will look at how home page is created. <!DOCTYPE html> is an element which
declares type of language used in creating the website which is html 5. Tag element <html
lang=eng shows the language that has been used in writing contents of the website.
<Head> element is where we embed tittle which will be shown on universal resource
locator.Meta element has been put to make the website to open according to screen of the
device where website has been opened and when resizing it on large screen should be
able to be resized.
In this case link element is used to make html pages to combine with css page so that html
pages must been styled by css element for instance styling nav bar. Body is the tag
element which embed everything in contents including paragraphs.
<h1> tag is the element where title of which will be viewed on the top of each and every
page of the website. <div> tag is used to divide the title with the <form> tag where the
search box is created. <input> tag element holds the position where user can search some
relevant information for the website.<button> this button tag is putted to create the point
where after writing information in the search box can click and direct him or her to the
proper information. To create navigation which will be consistent to pages requires <nav>
tag which declares the list of words that will be viewing on the horizontally on each and
every page which each and every bar when clicked will show more information it contain.

Above is register html page where people can register to take part in the rambling and
walking.
<section> tag has been used to specify the part where form of register is created. <input>
just shows that in the website will be boxes where needs to be filled with some words.

Page 3 of 13
521922737.docx
Much focus will be on the how footer is created. And footer is what will be shown on the
very end point of the website page. <img> tag is used in this to put image which will view
in browser.
<ul> the tag contain list of the contents which imbedded in in it by <li> tag where contents
is contained

On this page there are <label> tag elements which is used to create box to fill in the name
or password.
On this page is where a form to book things of this website through online form which is
created.

Page 4 of 13
521922737.docx
Table form is created here by using <tr> tag element which will view in web browser as
head in the table of current programs
The <th> tag element will view rows on the table of current programs and <td> will view
columns of the current program table page.
Cascading style sheet is created in a separate page which is used to style the whole
website. This makes website to have colors, to style footer, paragraphs, and some of
contents presented in the website.

Body tag is used to style the whole page of website in terms of background color and
background images.
Header tag is used to style the head of the website page which will be consistent on each
and every page and there is min-height which will style of height of head. Header h1 is
used to style the tittle of the website which was already created in html5 document. In the

Page 5 of 13
521922737.docx
header h1 there is float which make it to move to the left hand side. Header search box tag
is used to style search box code in which is in html5 document and there is also float right
which will float to right on top of the right hand side of each and every website page.

Table tag element is taken from html document and put it in css file in order to style the
tables in the current program page. Width tag was used to put size of whole table and
background-color will style the table background to the grey color as it is presented in css.
Table, th, td is used to make all borders of rows and columns solid. Tag of th, td is styled to
padding which will increase the rows and columns. Image is being given 100% to view in
full and fit the maximum of size of website and screen.

Now navigation is being styled with some tag element. Overflow tag is used to make it
clear. And background is used to style nav bar to black and this will be consistent on each
page.
Font-size is used for making the size of words on nav bar.

Page 6 of 13
521922737.docx
Task 3 – Test the Website and Write a Test
Report
a) Validation HTML and CSS Code
The website was validated using the validation service on the (http://validator.w3.org) and
(mobile.css-validator.org) website:

The figure below is showing the errors found in the index page and these errors are to be
corrected.
After testing and validating I find these errors. Index;html

Page 7 of 13
521922737.docx
HTML Code of register page was checked and has been found with errors
These will be fixed later

Blog html page has been tested and errors are found and will also been fixed
Current programmes test has shown the following errors and will be fixed.

Page 8 of 13
521922737.docx
Errors that are found in book online some of them are.

Page 9 of 13
521922737.docx
In the Q&A I have encountered the following challenges.

Page 10 of 13
521922737.docx
Cascading style sheet has also brought its errors. This just shows that in css there is also
require fixing some problems which will be able to make the website being completely
designed and makes it to work professionally.

Now in this case will see how the website is shown although there some errors. The
screen shot will be explained with the way it is viewing.
This how the home page is viewed on the browser.

We are still on the home page but on the second screen shot showing the part of the body
where some CTA button has been created.

Page 11 of 13
521922737.docx
On book online form shows how form has been created and you can still see that
navigation is consistent.

Now it screen shot on how footer was created and how media icons has been created
styled.

TASK 4
The accessibility features that has been used in the website is tab index which directs you
where there is putted the feature for easy scroll down on the webpage.
Advantages of using two different types of multimedia file formats
 It helps you to see that the website is easy to use in different multimedia file formats. That is why
the website will be more easily to use.
 This helps to know where are errors in the website to fix problems if it is failing to be viewed in two
different multimedia file formats

Page 12 of 13
521922737.docx
Disadvantages of using different multimedia file formats
 Sometimes using two different multimedia file formats brought a lot of problems because other
multimedia file formats are not compatible to open the website.
 Multimedia formats has its files which are able to use them but maybe not able to open the
website.

Accessibility of this website it is very quick and easy to use because everything is created
to be used familiar. The website has been designed to support mobile users by using
media quarry so that website should view in every device.

Conclusion
The report has explained on how the website has been created which is all about rambling
and walking. Website has a lot of things that has been included to make relevant to the
aim which has been asked in the question paper.

Page 13 of 13
521922737.docx

You might also like