Pradeep Shrestha HND Second Semester Web Design Project

Verified

Added on  2022/01/21

|96
|20890
|236
Project
AI Summary
This assignment presents a comprehensive web design project for Kumari Bank Limited, a fictional commercial bank in Nepal. The project encompasses various aspects of web development, including understanding user needs, conducting site analysis, and implementing design concepts. It addresses different user types (expert, novice, regular, and occasional) and emphasizes the importance of accessibility for users with disabilities. The solution covers design considerations, including browser compatibility, connection speed, screen resolution, and operating systems. The project also involves creating various web pages, such as a homepage, capital plan, EMI calculator, bank account section, forms (Demat, KYC), branch and ATM locators, gallery, downloads, contact us, FAQ, sitemap, and privacy policy. Furthermore, the assignment explores user interactivity, graphics usage, and content delivery, ensuring a user-friendly experience. The solution also includes website testing, encompassing unit, integrated, compatibility, and stress testing. The project concludes with discussions on website hosting, performance improvement, and promotion strategies, along with a critical review of the design and functionality.
tabler-icon-diamond-filled.svg

Contribute Materials

Your contribution can guide someone’s learning journey. Share your documents today.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 1
ACKNOWLEDGEMENT
The success and final outcome of this assignment required a lot of guidance and assistance from many
people and I was able to finish my tasks because of kind support and help from my teacher and friends.
So, First and foremost, I offer my sincere gratitude to Rajan Raj Pant sir for providing me support,
information and guidance which made me complete the assignment on time. I respect and acknowledge
ISMT College and also Pearson Edexcel Board for giving a wonderful opportunity to do this
assignment and show me the perfect way to groom myself in the field of IT.
Next, I would like to thank my parents whose kind co-operation, support and encouragement has made
possible to complete these assignments on time. I would like to express my gratitude towards my
friends who helped me in all possible aspects.
Lastly, I would like to extend my sincere thanks to everyone who directly or indirectly helped me in
the accomplishment of assignment. Therefore, I appreciate all helps and supports of everyone.
tabler-icon-diamond-filled.svg

Secure Best Marks with AI Grader

Need help grading? Try our AI Grader for instant feedback on your assignments.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 2
Table of Contents
ACKNOWLEDGEMENT ..................................................................................................................... 1
Scenario.................................................................................................................................................. 5
Task 1 ..................................................................................................................................................... 6
Introduction ........................................................................................................................................ 6
1.1 Users ........................................................................................................................................ 6
1.2 Site analysis accessibility ......................................................................................................... 8
Solutions ...................................................................................................................................... 10
1.3 DESIGN ..................................................................................................................................... 11
1.4 Environment ............................................................................................................................... 13
1.4.1 Browser Compatibility ........................................................................................................ 13
1.4.2 Connection Speed ............................................................................................................... 13
1.4.3 Screen Resolution ............................................................................................................... 14
1.4.4 Operating System ................................................................................................................ 14
Conclusion ........................................................................................................................................ 14
Task 2 ................................................................................................................................................... 15
Introduction ...................................................................................................................................... 15
2.1 Nature of Interactivity ................................................................................................................ 15
2.2 Client Needs ............................................................................................................................... 15
2.2.1 Images ................................................................................................................................. 15
2.2.2 Level of Security ................................................................................................................. 15
2.3 Development Timescale ............................................................................................................. 15
2.4 Website Design: ......................................................................................................................... 16
1. Homepage .......................................................................................................................... 16
2. Capital Plan........................................................................................................................ 17
3. EMI Calculator .................................................................................................................. 17
4. Bank Account .................................................................................................................... 18
5. DMAT-Form ..................................................................................................................... 19
6. Bank Branches ................................................................................................................... 20
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 3
7. ATM Locations.................................................................................................................. 21
8. Gallery ............................................................................................................................... 21
9. Download........................................................................................................................... 22
10. Contact Us ......................................................................................................................... 22
11. FAQ Page .......................................................................................................................... 23
12. Sitemap .............................................................................................................................. 24
13. Private Policy ..................................................................................................................... 24
2.5 User’s Need ................................................................................................................................ 25
2.5.1 Appropriate use of Graphics ............................................................................................... 25
2.5.2 Delivery of the Content ....................................................................................................... 25
2.5.3 Complexity of Site .............................................................................................................. 25
Conclusion ........................................................................................................................................ 25
Task 3 ................................................................................................................................................... 26
Introduction ...................................................................................................................................... 26
3.1 Novice User ................................................................................................................................ 26
3.1.1 Usefulness ........................................................................................................................... 26
3.1.2 User-Interactivity ................................................................................................................ 26
3.1.3 Proper Validation ................................................................................................................ 27
3.1.4 Accessibility ........................................................................................................................ 27
3.2 Disabled User ............................................................................................................................. 27
3.2.1 Usefulness ........................................................................................................................... 27
3.2.2 User-Interactivity ................................................................................................................ 27
3.2.3 Proper Validation ................................................................................................................ 28
3.1.4 Accessibility ........................................................................................................................ 28
Conclusion ........................................................................................................................................ 28
Task 4 ................................................................................................................................................... 36
Introduction ...................................................................................................................................... 36
4.1 Navigation Bar ....................................................................................................................... 36
4.2 News Slider ............................................................................................................................ 38
4.3 Header .................................................................................................................................... 39
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 4
4.4 Image Slider ........................................................................................................................... 40
4.5-Footer ..................................................................................................................................... 41
4.6 Gallery.................................................................................................................................... 43
4.7 Downloads ............................................................................................................................. 44
4.8 Demat Form ........................................................................................................................... 45
4.9 Contact Us .............................................................................................................................. 47
Conclusion ........................................................................................................................................ 49
Task 5 ................................................................................................................................................... 50
Introduction ...................................................................................................................................... 50
Unit Testing ................................................................................................................................. 50
Integrated Testing ........................................................................................................................ 58
Compatibility Testing .................................................................................................................. 61
Stress Testing ............................................................................................................................... 63
Critical Review. ................................................................................................................................ 67
Conclusion. ....................................................................................................................................... 68
Task 6 ................................................................................................................................................... 69
Introduction. ..................................................................................................................................... 69
Conclusion. ....................................................................................................................................... 72
Task 7 ................................................................................................................................................... 73
Introduction ...................................................................................................................................... 73
FAQ Page ..................................................................................................................................... 75
Site Map ....................................................................................................................................... 76
Site Navigation............................................................................................................................. 76
Conclusion ........................................................................................................................................ 81
Task 8 ................................................................................................................................................... 82
Introduction ...................................................................................................................................... 82
Design Layout .............................................................................................................................. 82
Tools Used ................................................................................................................................... 85
Task Breakdown Approach .......................................................................................................... 87
Data and Information Collection Mechanism .............................................................................. 88
tabler-icon-diamond-filled.svg

Secure Best Marks with AI Grader

Need help grading? Try our AI Grader for instant feedback on your assignments.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 5
Product Deployment .................................................................................................................... 89
Maintenance ................................................................................................................................. 91
Conclusion ........................................................................................................................................ 91
References: - ........................................................................................................................................ 95
Scenario
Kumari Bank Limited” is a one of the commercial banks of Nepal with an objective of providing
competitive and modern banking services in the Nepalese financial market. The bank always focus on
building sound technology driven internal system to cater the changing needs of the customers that
enhance high comfort and value. The bank is pioneer in providing some of the latest / lucrative banking
services like E-Banking and SMS Banking services in Nepal.
The IT manager looks for a professional and competitive look for their website. The website must
include the facilities such as E-Banking, ATM locations across the country, branches, image gallery
etc. There should be couple of forms like Demat account opening online form, KYC form along with
customer feedback form. The form should be properly validated against empty fields, data types and
other fields as par necessary. The website should be W3C complaint (XHTML and CSS). You have
been employed as a “Web Developer” Your responsibilities include but not limited to suggest recent
web trends, technologies and tools that should be used to meet the goal and later, promote the website
(SEO, Social Network Implementation). Finally, submit a fully functional interactive, appealing and
tested (W3C XHTML/CSS validated) website. For interactivity and better user experience, JavaScript
(or its libraries like jQuery) can be used wherever needed.
In order to be appointed for the position you need to demonstrate skills required for the position.
Particularly you have to demonstrate that you understand the functions of website hosting and you are
able to manage websites, improve website performance and promote them.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 6
Task 1
Discuss the design concepts that have to be considered when designing the website. [1.1, M1]
Consider: Users, Site Analysis Accessibility, Design and Environment.
Introduction
Web design in simple language can be termed as a dynamic approach. Dynamic approach in
the sense that the real definition of it lies and varies from the designers prospective. Before any
designer start making a fully functional website, a designer must take a design concept in
consideration.
It is not always true that a good website must have too much animations or multimedia. It might just
include the words content just for the information or satisfactory purpose. According to Robert White
(2002) claims that any designer who sees from his perspectives only but not through the perspectives
of the users are obvious to have more and more number of unsatisfied clients. Hence, the concept of
developing any website should be solely depend on the perspective of the client. It should provide full
content that the client wishes to find out rather than increasing more and more complexity by adding
various unnecessary information, Medias, etc.
Before making a good website, we must consider some of the major points. In this task, I’m going to
discuss some of the topics: -
1.1 Users
Users refers to the client who visits or uses the website for various purposes. These purposes generally
depend upon the content the website contains. Therefore, it is important to have convenient and
specific content the user desires while surfing the website. According to Chris Young (2015), argues
that for any webpage to be successful the first and foremost thing that the developer must consider are
the traits, needs, objectives of the website. When the web visitor’s traits are taken in importance then
the pages can be developed accordingly to meet the client’s needs and success of any website can be
gained only by knowing the objectives of the website. For a website to flourish, the designer must take
in account the design concept for any user who is browsing the website. Hence, to sum up the intension
of developing the website must be clear and the information that the client want should be provided in
easier manner. There are generally 4 types of web clients for which we can consider. Some of them
are briefly explained below: -
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 7
1.1.1 Expert User
Expert Users are the professional users. They acquire skills and knowledge from great deal of
practices in particular subjects or fields over years. These web clients have no any difficulty in finding
any content from the websites or using the website. These users have advance skills and know how to
use the webpage properly. They can also find out the problems that are occurring in the website and
can effort in solving it. They are very active and effective users that can physically and mentally make
sure and secure the webpage. They are free for using the content or the applications of the website.
They are always secure while using the website as they can also bypass the problems that occurs in the
website.
1.1.2 Novice User
Novice Users are the new users to any system or website. Novice users are the non-experienced users
to any website. They require simple, basic and easy interface to learn and some extra more help or
effort for advance use. While designing a website, we must consider for the novice users too. We
should remember that not to make the website shadow or add some unnecessary applications or
features. This will make the user more confusing too. The web designer must also add the help file to
reduce the error or problems that in the website by the users.
According to Albert Thompson (2015) defines Novice user as the users that are having the features
of internet at the highest potential at the first stage. This means that the users that are very new to the
website and need and extra help to use the web properly. The rate of use of website by these users are
the same as the other users but the basic difference between them is that they do not know the basic
rules of the web. Hence, these users are specifically targeted for obtaining the desired informations
that they seek and not any further information of the website.
1.1.3 Regular User
Regular Users are those users who visit the website frequently or regularly for some specific purposes.
They can just go into the website and easily get the content they are looking for. These users generally
look out for the mails or the updates that in the web. Some examples of the regular users include
students, clients, staffs and other too.
Regular user generally visit the website, comment it and use the effectiveness or the functionality of
the website. These users are regularly updated with the web contents and website interface. Therefore,
tabler-icon-diamond-filled.svg

Paraphrase This Document

Need a fresh take? Get an instant paraphrase of this document with our AI Paraphraser
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 8
these users are also one of the important part of the web users. These users are like our asset as they
give their feedbacks and further suggestions that are to be included or how the layout should be. Hence,
one of the key aspect of becoming an expert user is becoming part of regular user too.
1.1.4 Occasional User
Occasional Users are the users that visits the website once or week or once a month. These users use
the web very rarely just to check out certain events or information that occurs rarely in a week or month
or even once a year. One of the examples of the occasional users may include people who just want to
know the exchange rate of different currencies. Therefore, these users use the website for specific time
period and get disturbed when new content or extra features are added because they are used to the
website for certain interval of time after a long period.
1.2 Site analysis accessibility
Site accessibility refers to the people who can access the website. The designed website should be able
to give access to the people of different age group and also the people having different disabilities. The
developer and the designer team must take in consideration to this also.
There are thousands of people who are having different defects such as disabilities and our website
must also include them too. According to Gim Gordon (2007) argues that web must be accessible to
all the people who are having various disabilities so that these people can also get equal opportunities
as other and they can also participate in the social matters actively. As the disabled people also have
the equal right as the abled people at present and rather to be called differently abled than disabled
people. People who are differently abled are in various society.
Web accessibility comprises all the disabilities that generally affects the access to the web such as
auditory, visual, physical, cognitive, speech, or even neurological disabilities. As the web is the main
source for getting as well as providing the information and also interacting with the society too? Hence,
it is very important that the web accessible in order to provide equal access and equal opportunity to
the people that are differently abled. There are various disabilities let us discuss some of them in brief.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 9
1.2.1 Color Blindness
Color blindness is one of the major problem for the people having disabilities. Therefore, the created
website should be able to understand and readable by the visitors regardless of the text color and the
background. Color combination of the text and background also plays a vital role for the website to be
readable. The color combination should be eye catchy and of good combination in the website. The
combination of color, text and background should match otherwise users may not be able to get the
required information in the appropriate time. Hence, use of high contrast should be avoided as well.
Similarly, to attract the users and viewers the graphics used in the website plays the key role, so it
should also be managed well.
1.2.2 Visual Disability
Visual disability is also one of the web accessibility that is not easily corrected as well as not easily
forgotten too. Some of the users may have low vision whereas some may not have any vision at all.
Users like elderly people, sick people or injured people, etc. generally have low vision. Color
blindness also occurs when the user is unable to see the color in a normal way. Color blindness
happens generally when the users cannot distinguish between certain colors, like in the green and red
color and occasionally in the blue color also.
Web Aim (2013) claims that most of the people use some kind of assistive technology to aid their
vision. Though unaware, most of the people use some tools in order to view the required material. We
can also audio, video information source for complete blind people and those for the color blindness
people we can also keep some images that can help the users.
1.2.3 Audio Disability
Audio disability is the condition of the people where people cannot listen to, they can only feel and
see. Web contents are not always a visual presentation. We see web contents in various forms such as
graphics, video, audio, animation and text. So, not only the visually disabled people but also people
with auditory disabilities must be considered when developing a web content. The solution for the
people having audio disability problem is that we can provide some captions or subtitles and transcripts
to the video or the audio content that are in the website.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 10
1.2.4 Motor Disability
Motor disability may include impair such as motor and speech disabilities. The motor disabilities
include weakness in muscles or lack of movement coordination. Sometimes the users may be unable
to move the mouse or keyboard and some may give out slow response. The speech disabled people are
unable to produce proper speech which may be in terms of clarity or loudness. It may also refer to
people who may not be able to speak at all. The website today is being more interactive than ever
making user involved in the page. The designer must be also aware of the fact that such physical
disabilities must also be taken into consideration while designing the web page. The solution to this
problem is that the entire web function should be able to be done with mouse or keyboard. Also, various
technologies such as head wand, mouse stick, voice recognition software, eye tracking software,
oversized trackball mouse, single switch access, puff switch, sip and adaptive keyboard, etc.
1.2.5 Cognitive and Neurological Disability
The cognitive and neurological disability include learning, memory impairment, seizure disorder and
many more which may be related to malfunctioning of nervous system brain. It is one of the broad
disability in which a person has greater difficulty with using mental tasks than the normal person. This
generally occurs in the person’s psychology or biology which leads to memory problems, attention,
problem-solving, reading, etc. Everyone at some point or another accidentally clicks on the wrong link,
misspells a word, or commits some kind of error on the web.
Solutions
Display error message if the user makes error.
Providing text alternatives to visual and audio content.
Make text content readable and understandable using simple and clear language.
Avoiding use of color to convey essential information.
Using high-contrast foreground/background colors.
Avoiding flashing animation.
Make all functionality available from the keyboard.
Provide ways to help user navigate, find content, and determine where they are.
tabler-icon-diamond-filled.svg

Secure Best Marks with AI Grader

Need help grading? Try our AI Grader for instant feedback on your assignments.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 11
Maximum compatibility and use of assistive technology.
1.3 DESIGN
The design is the part where the website starts to take its body. It is the actual designing phase where
there is planning, making and implementation of the content matter. While designing the website at
first all the requirements should be analyzed as it is essential to meet all the user’s requirements. The
designer should also have knowledge on advantages and disadvantages of website designing, keeping
those things in mind helps them to design website easily and hence output will be as expected. Some
of the essential factors that should be considered while designing website are: -
1. Site Map 2. Visual Design 3. Optimization 4. Programming languages,
5. Website Elements 6. Information gathering 7. Planning
1.3.1 Content Design
Web contents are the information in the web that are in
the form of text, multimedia or graphics. Content design
is the most crucial part when considering a web design.
Simply compelling (n.d) argues that many of the
designers keep in mind that ‘content is king’ and has
always proved right.
1.3.2 Site Map
Site map generally is the visualization of the link
location. Site map helps link different pages of our
web page and ease our navigation. James Deer
(2013) state that site map is often the starting point of
a web design process. It helps us design our pages
further more with relative content and plan for better
webpage.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 12
1.3.3 Visual Design
Visual design is the implementation of the content matter
into the web page. Use of typography, graphics, animation
and media are managed during visual designing and gives
the body to the web page. Dab Apps (n.d) states that web
visual design as a way of presentation that makes user
interact with the page. A good visually designed web page
makes user spend more time in the page and improves
user experience.
1.3.4 Optimization
The website designed must be maintained and optimized. There must be facility to optimize any of the
area in future if necessary. Some of the optimization area are Search engine optimization and mobile
optimization. The search engine optimization is the optimization of website so that the website is
ranked better in the search engine. The website must also be optimized for the mobile use.
1.3.5 Programming Language
There are wide variety of programming language
available to develop an effective website. The
web development language includes HTML,
CSS, JavaScript, PHP, Python, Ruby and many
more. According to the requirement, the
developer must choose the language wisely.
1.3.6 Website Element
Got2Web (n.d) states that web users seek for a pleasing format to view the required information which
also guarantees their return visit. There are various key elements which must be taken in account for
the web page design. Some of the key factors are
Proper use of color scheme
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 13
Consistent theme
Proper use of fonts
Usability
1.4 Environment
The website designed must be tested under various levels so that it can work on various environments.
Understanding web design Environment (2005) argues that the environment affects the way the users
interact with the web content. If the web content that are supposed to be displayed in one manner gets
displayed in another manner, then the content might not be appealing.
After the designing part is completed, the designer has to consider various factors such as
Screen resolution, connection speed, hardware and software requirement, browser compatibility, etc.
as these factors affect the website. Some environments that has to be considered are described below.
1.4.1 Browser Compatibility
Understanding web design Environment (2005) states that one of the major
problem that the web designer face is to make the web page work in various
browsers.
Before the web page is published, the designer and developer have to test the
web page numerous times. They have to test the page in maximum browser
as possible so that the web users can access their site in any of the browsers.
1.4.2 Connection Speed
Though the internet speed is increasing, every people are not accessible to it. Most of the users will
wait for couple of seconds for the web page to load. If the page doesn’t load within the time, they will
simply go for another before even taking a look. So, while designing the page, it should be tested in
numerous connection speed such as in DSL, 3G, Dialup and many more. Understanding Web Design
Environment (2005) states that one of the reason that the page loads more slowly is use of high and
more graphics and media. The page has to be loaded or downloaded in a temporary location before it
can be viewed. Hence, use of these graphics and media takes longer time for the page to load. So, the
tabler-icon-diamond-filled.svg

Paraphrase This Document

Need a fresh take? Get an instant paraphrase of this document with our AI Paraphraser
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 14
designer must use as low graphics and media as possible, unless required, while designing the web
page.
1.4.3 Screen Resolution
The website view in one monitor may differ from the same website viewed in another monitor.
This is due to the different screen resolution of the monitor. So, no matter how hard a designer focus
on designing the website, if the screen resolution is not considered than the users may view the same
content in different unmanaged format.
Understanding Web Design Environment (2005) has given few solutions to solve the screen
resolution problem by using some of the techniques such as flexible design where values used are
relatives such as percentage rather than the absolute such as pixel. The other techniques used is the
centered positioning where the web document is designed in low resolution and fixed to center so that
whatever the resolution, the document is always adjusted at the center.
1.4.4 Operating System
Numerous operating system exists in the market now days. The
famous one includes the Windows operating system, Mac OSX and
several versions of Linux. This operating system may have
different versions of browsers installed in them. The operating
system has different working mechanism to process the resolution,
color depth, video hardware and many aspects that affects the web
page. Even support for the font must be considered while designing
the web page. There has not been a best practice but the website
must be tested in numerous OS as possible before it could be made available online.
Conclusion
Hence, the design concept for designing a web page is a dynamic process where there is no fixed
approach. There might be different concepts for different designers. But all designers must make the
web site accessible by all the users and different types of people regardless their physical abilities.
Proper designing plan, tools and environment must be considered and implemented after several tests
before it could be published in the World Wide Web.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 15
Task 2
Design an interactive website to meet the given requirements in the scenario. [2.1, M2]
Introduction
After determining the basic concept of the structure and the mock-up of the website. The website which
is to be developed is now then well-structured and an interactive layout is prepared. In this I’m going
to design an interactive website to meet the given requirements in the scenario.
2.1 Nature of Interactivity
Website should be very interactive as far as possible so, that the visitors can be engaged in the website.
It is very important to know the interaction level of the customers and keep them engage in the website
through different ways. According to Graham Jones (2015) claims that the most web visitors are
persuaded and believe in the web site if the web site interactivity is increased.
The website designed for Kumari Bank has used various elements to increase the interactivity. It uses
interactive menu to navigate through various pages. It has images relating information with use of
image sliders. It has forms for new customers and for users who use smart phones mobile setup to make
the users more simplified. It also has maps showing the location of the different branches and the ATM
locations in various locations. It also enables user to get involved in many social networking sites such
as Facebook, Twitter, etc.
2.2 Client Needs
An appropriate design for Kumari Bank has been developed using proper contents, images, contact
page, FAQ pages, DMAT form, etc. The developed website also meets the almost every client’s needs
as mentioned in the Scenario.
2.2.1 Images
Different images and contents have been taken in consideration for the website of Kumari Bank.
2.2.2 Level of Security
Kumari Bank website has been made using various validation methods where they are necessary.
2.3 Development Timescale
Development timescale is one of the important part of the project that reflects the time period over
which the project has been completed. The development timescale can be shown using the Gantt Chart.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 16
The Gantt chart below shows the overall view of the time period taken for the completion of the Kumari
Bank website.
2.4 Website Design:
1. Homepage
tabler-icon-diamond-filled.svg

Secure Best Marks with AI Grader

Need help grading? Try our AI Grader for instant feedback on your assignments.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 17
2. Capital Plan
3. EMI Calculator
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 18
4. Bank Account
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 19
5. DMAT-Form
tabler-icon-diamond-filled.svg

Paraphrase This Document

Need a fresh take? Get an instant paraphrase of this document with our AI Paraphraser
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 20
6. Bank Branches
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 21
7. ATM Locations
8. Gallery
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 22
9. Download
10. Contact Us
tabler-icon-diamond-filled.svg

Secure Best Marks with AI Grader

Need help grading? Try our AI Grader for instant feedback on your assignments.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 23
11. FAQ Page
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 24
12. Sitemap
13. Private Policy
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 25
2.5 User’s Need
There are various types of users and these types of users are also to be considered before designing the
website. Let us discuss some of the needs that are basically considered for the users.
2.5.1 Appropriate use of Graphics
The pictures in the website are the reflecting content for the users as they easily relate the content off
the website. Appropriate use of colors is considered wisely as color scheme helps to bring consistency
throughout the website giving the users feeling of the native in every pages.
2.5.2 Delivery of the Content
The website contents are delivered to the visitors using different techniques such as some animations,
pictures and texts. The text are mostly presented in the plain color so, that the users don’t find difficulty
in reading the text. The pictures in the website relate Kumari Bank and the events with the use of
minimal animation in it.
2.5.3 Complexity of Site
The website should not be very complex for the visitors. Every page can be accessed through the menu.
The pages in the website are linked with each other with the help of menu, content and the sitemap.
The forms that are present in the website as online forms are prepared using proper validation as per
the format of the banking as well as website system.
Conclusion
A good website must have sufficient informations that the clients seek for. There are different types of
website visitors so, the necessary informations that the clients seek should be included in any website.
Therefore, a proper design of Kumari bank website have been prepared as per the user’s need and as
per mentioned in the scenario. The webpages are designed with appropriate tools and techniques in
order to provide the required content to the visitors.
tabler-icon-diamond-filled.svg

Paraphrase This Document

Need a fresh take? Get an instant paraphrase of this document with our AI Paraphraser
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 26
Task 3
Evaluate the website design with at least other two users. [2.2, M3]
Consider: Consider the usefulness, user-interactivity, accessibility and proper validation of the forms
used.
Introduction
Evaluation of the website helps us to find out whether the elements of the website have been properly
implemented or not for the visitors. In this task, I’m going to evaluate the website design with at least
other two users.
3.1 Novice User
Novice users are those users who are new to the web surfing. Most of them find out difficulty in finding
the proper information that they are seeking for from the website. Therefore, these users require proper
guidance to use the website properly. The site for Kumari Bank has been developed with the target to
engage every type of the users and help them find out the required information easily.
3.1.1 Usefulness
The website of Kumari Bank is very much useful for the novice users. These users can get the
information easily as soon as they get into the homepage of the Kumari Bank. The novice users can
get the information related to the Kumari Bank from the website. These users can even get the
information of the services that are provided by Kumari Bank.
3.1.2 User-Interactivity
Most of the users look out for user friendliness website this also include the novice users. Kumari bank
website has user-interactive menu which enables the novice user to get access to different pages. The
website also has proper graphics with image sliders to make the website more interactive. The users
can easily get the information of the bank branches locations in different places and also the ATM
locations that are nearby.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 27
3.1.3 Proper Validation
The forms present in the website for the Kumari Bank has proper validation so that the users can
provide proper information to get access. The novice users might find in difficulty in finding out the
online form or the other forms. The user may not know where to find them but the website of Kumari
bank has interactive menu and sitemap that can easily redirect the users to the required pages. Also,
the users may not know what types of data are to be fed in the field for filling up the online form but
the website of Kumari bank has proper validation which guide the users and help the to provide proper
information in the required fields.
3.1.4 Accessibility
The accessibility for the novice users are kept in mind using attractive graphics and animations with
the proper use of color scheme. There are also proper use of font color and size which easily make the
information noticeable.
3.2 Disabled User
Disabled users are those users having physical disability. The website of Kumari Bank has been
designed keeping in the mind that the website must be accessible for the disabled users too. The website
has been made accessible for the disabled users with ease in accessing any kind of information along
with the guidance for the users.
3.2.1 Usefulness
The information in the site of Kumari bank can be viewed from the homepage and can be useful for
the disabled users to know every information regarding the banking system in the Kumari bank. The
website provides the platform for the disabled users to get the information without navigating to
different pages as every information are on the homepage. This also helps them to give them equal
opportunity to get the information and knowledge so they can also relate them to the daily activities
that they do.
3.2.2 User-Interactivity
The website has simple interactive menu throughout the pages which the disabled users can easily
access to any pages easily. The website is made interactive using graphics, colors and sliders etc. most
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 28
of the users can easily find the website interactive as these graphics are using flash animation for more
options and navigation too. The forms are easily accessible which has increased the level of
interactivity for the users.
3.2.3 Proper Validation
The form validation is very much effective for the use by disabled user. The disabled user need the
form validation as they may not properly view the information. Even the mistakes that occur during
providing information might not be seen by the disabled users. So, form validation helps them
properly provide the information needed by the bank.
3.1.4 Accessibility
The website has used proper color theme bringing consistency in all the pages. It has used
appropriate font size and color which is easily readable by disabled people who have low vision
or have problem in reading. It has not used too much flashing animation and has used less use
of colorful texts.
Conclusion
The website that has been designed for Kumari Bank has been properly structured with proper
validation. The different features of the website for Novice User and Disabled User with the key
features of Usefulness, User interactivity, proper validation and Accessibility have been taken I
account. The evaluation shows that the website has been designed keeping in mind the web
accessibility. This helps to reach out every type of users and help the use with ease.
Hence, in this task I have taken two types of user and evaluated the website for these users how user
friendly is the website.
tabler-icon-diamond-filled.svg

Secure Best Marks with AI Grader

Need help grading? Try our AI Grader for instant feedback on your assignments.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 29
In order to achieve a Distinction, the learner must:
For D1: -
To order to achieve D1, your will critical reflection will demonstrate that conclusions have been
arrived at through synthesis of ideas and your ideas have been justified presented in task 1, 2 and 3.
In Task 1, 2 and 3, I have presented different aspects that have to consider while designing
and developing the website. The task also includes the different types of user, site accessibility analysis
and design and environment.
About Concept
A design concept is the idea behind a design. It’s how to plan on solving the design problem that arises.
It’s the underlying logic, thinking, and reasoning for how developer designs a website. The concept
will lead to the choices in color and type.
The basic design concept for the website becomes the framework for all other design decisions for
other pages that are included in the web.
Design concept can be taken as:
Verbal – the verbal parts of design concept might be words used to describe the site. For
example, the design concept might be one of sophisticated elegance. Verbal concepts tend
toward the abstract.
Visual – the visual parts of design concept might be a specific image or color scheme. It might
be an idea to use circles prominently. Visual concepts tend to be a little more concrete. They
should come from the verbal part of your concept.
Generally verbal concepts come before visual concepts as the visual is really about how audience
communicate the verbal, though it likely depends on the individual and how you think best.
Things to do
Developing a design concept is something of an individual process. There’s no one right way to
generate an idea and what works for one won’t necessarily work for another. However, there are parts
to the process that everyone should go through.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 30
Defining the problem – an individual can’t solve a problem without knowing what that problem
is. Before developing a concept for a site s/he need to talk to the client and ask questions about
the client’s brand, their customers, their general market, and their goals for the site.
Research – the client won’t be able to tell everything the developer want to know. The
developer will have to do their own research into client’s industry looking at competing sites
and trying to understand more about their market.
Following are some of the question that researcher or developer should as their client before starting
the job.
What is your client’s brand?
Who are your client’s customers?
What are the requirements for the site?
What is the objective of the site?
What’s the budget for the project?
The answers for each of the above question should give ideas for preparing an attractive and managed
design concept.
The list of questions above is hardly an exhaustive list. Researcher should be asking as many questions
as they can in order to understand as much as possible about the client, the client’s business, their
customers, and what they want from the site.
When researching the client’s industry, you should be asking yourself some questions as well.
What is consistent across sites in the industry?
What part of the market is being underserved?
What are your client’s unique selling points?
What kind of imagery, copy, etc. resonates with the market?
What other interests does the market have in common?
Process
When talking with clients the researcher should always be listening for the words they use to describe
their business and their customers. They won’t always give back the words by directly asking for them,
but there are other ways to get the information from them.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 31
Ask indirect questions – the clients will often reveal things about themselves and their
businesses when talking about other things.
Listen actively – Sometimes the information wanted by the researcher are between the lines
and they have to listen actively for it.
Get to know your clients as people
Speak their language – Stay away from industry jargon and use the words the clients use.
Usually after talking to the client and researching the industry, the researcher is filled with ideas. They
are not sure which concept will work best, but the ideas are there. Once the concept are finalized, the
researcher provides the design concept.
tabler-icon-diamond-filled.svg

Paraphrase This Document

Need a fresh take? Get an instant paraphrase of this document with our AI Paraphraser
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 32
For D2: -
To order to achieve D2, you will provide evidence that you have taken responsibility for managing
and organizing activities while doing Task 1, 2 and 3. The evidence will show how you have planned,
organized and managed the activities.
For the task 1, 2 and 3, I am going to provide the evidence of my task breakdown while I was
doing all tasks and projects. The following chart and description displays about planning, managing
and organizing activities while I was completing my all tasks.
Fig: Timeline and Gantt chart
This assignment has helped to me to know things better, while preparing different task. I gained
different ideas and views on different considerable aspects that can help to build up user friendly and
informative website. I started my assignment on 8th September, 2016 doing Task 1, where I described
the design concept. The task includes the processes and steps of developing and deploying the website,
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 33
different types of web user, web analysis accessibility, design and environment. The task gives all
information on how to design and develop any website. It also have included the web analytic tools
that can help to understand how the website is running.
On 21 st September, 2016, I started designing a website of Kumari Bank Ltd. understanding their
vision and requirement as Task 2. They were focused on providing the best user interactivity
functionality in the website. The website was developed under the consideration of level of security,
contents, complexity and other essential elements for the website.
Then, as Task 3, I evaluated website’s usefulness, user interactivity, accessibility and validation
depending on 2 different types of user. This task was started on 10th September, 2016 which
completed on 4th October website of Kumari Bank Ltd. The task also includes the snapshots of codes
which includes HTML, CSS, JavaScript and jQuery. Then I provided the evidence which can describe
how I managed and applied different methods and techniques while developing the website.
For D2, I have provided evidences that I have taken responsibility for managing and organizing the
activities in doing the task 1, 2 and 3. The provided evidences includes references from different sites
quotations. Each of the information used in the task 1, 2 and 3 have been properly paraphrased. The
presented screenshots have also been properly managed in the task. I have also given the timescale in
the Gantt chart to show how I have managed my time for the development of the website. I have
organized the task as per mentioned in the scenario and the questions that are given. In task 1 I have
followed the assignment sample given by Rajan sir in the class and for the screenshots I have preferred
Nimbus tool in Opera Browser and snipping tool in windows 10.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 34
For D3: -
To order to achieve D3, you will provide evidence which shows that you have applied creative
thinking and have taken self-evaluation while doing Task 1, 2, and 3.
Kumari Bank Limited wanted to build up the site which ought to be interactive and simple to
the clients. Since the system can have both positive and negative impact, the beneficial outcome should
be climbed to make the yield more reliable and pleasing to the client and in a similar time negative,
impact should be discarded and cleared.
As demonstrated by the essential of the Kumari Bank Limited, the site has been made adequately and
now the time has come to evaluate, recommend the redesigns that can be made to the site. The essential
purpose of the Kumari Bank Limited is to draw in the both national and international viewers and
customers. Before beginning and realization of the site headway wander on time on spending
arrangement, reasonable system need should be made remembering the true objective to work in like
manner.
In the wake of expecting every one of the criteria and need set by the Kumari Bank Limited gained
from the circumstance of assignment, all the standard time of the endeavor has been disengaged into
more diminutive errand. The propounded points of interest of site are it give data's, for example, the
history and background of the bank, its mission and visions, facilities provided by the bank, its
members etc. associated with the bank. The website gives the pleasing undertaking which incorporates
pictures and slogans that would mirror the reason for the bank. Photoshop and Dreamweaver is used
as the tools of the system is used to make the arrangement all the more obliging system. The system is
generally fixated on keeping up and upgrading sites besides gives report or printed file to the customer
in the system which is less requesting to check. Beside this system improvement of site with various
display and intuitive pages.
One of the main objective of website is to attract national and international consideration. Regarding
the development of the site of Kumari Bank Limited, diverse outlines and a couple composing review
have been directed to find the learning and sources ultimately the system was made in site. The basic
focal point of working up this site is to make work less complex to manage the delegate clients. On
social occasion of clients contemplated site the feedback page is used to arrange the site of Kumari
Bank Limited. Besides, the demat form and online forms has additionally been created to encourage
the visitors for the banking services.
tabler-icon-diamond-filled.svg

Secure Best Marks with AI Grader

Need help grading? Try our AI Grader for instant feedback on your assignments.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 35
The present site is not trustworthy to the customers and when the site is opened, it exhibits the issues
like data setback and threat, the rundown of pages is difficult to be seen and difficult to be checked the
working status. The main objectives of new site is to improve site security issue. In this way,
remembering the ultimate objective to make site strong it has used diverse modules like CSS, HTML,
jQuery and JavaScript.
I have provided evidences that shows creative thinking and logical thinking methods have been applied
along with the self-evaluation of every task has been done. I have provided the problems that are likely
to occur while developing the website. Not only that I have presented some of the solution that can be
used to solve those problems that I have mentioned while developing the website. This also helps to
keep the track of the measures and areas where the major focuses are done. For self-evaluation part I
have kept myself in the place of different users and evaluated the site. Hence, in this way I have applied
creative thinking and self-evaluation approaches while completing my task 1, 2 and 3.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 36
Task 4
Implement a fully functional interactive website using the design specification. [3.1, M2]
Content: You need to provide your implemented system in an electronic form. (CD or DVD)
Development: Should exhibit the use of HTML, DHTML, XHTML, client side scripting language
like JAVASCRIPT.
Introduction
Implementation of the website refers to the process in which the website is coded to make it fully
functional. In this task, I’m going to implement a fully functional interactive website using the design
specification as given in the scenario of Kumari bank. Also, I’m going to show the use of HTML,
DHTML, XHTML, client side scripting language like JAVASCRIPT.
4.1 Navigation Bar
The navigation of Kumari bank consist of navigation to different pages of Kumari bank and also the
search option too.
Design
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 37
HTML
CSS
tabler-icon-diamond-filled.svg

Paraphrase This Document

Need a fresh take? Get an instant paraphrase of this document with our AI Paraphraser
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 38
4.2 News Slider
The new slider shows the section over where the recent news of the Kumari bank displays. This section
also contains the information of the banking section. The division uses JavaScript so that the scrolling
of the news stops when the mouse is hover over it.
Design
HTML
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 39
CSS JavaScript
4.3 Header
The header section of Kumari bank contains logo of the bank and the search bar.
Design
HTML
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 40
CSS
4.4 Image Slider
It is the section of Kumari bank which has the graphical images in a sliding pattern. For the sliding
images on the website of Kumari bank, I have used Nivoslider.
Design
tabler-icon-diamond-filled.svg

Secure Best Marks with AI Grader

Need help grading? Try our AI Grader for instant feedback on your assignments.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 41
HTML
CSS JavaScript
4.5-Footer
The footer section of Kumari bank contains logo of the bank and the search bar.
Design
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 42
HTML
CSS
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 43
JavaScript
4.6 Gallery
The gallery of Kumari bank contains different images of Kumari bank and its updates.
Design
HTML
tabler-icon-diamond-filled.svg

Paraphrase This Document

Need a fresh take? Get an instant paraphrase of this document with our AI Paraphraser
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 44
CSS
4.7 Downloads
The download page of Kumari bank contains different things that can be easily downloaded when the
download button is clicked. The user can download different forms of the bank such as New Account
form, Android mobile application of Kumari bank, Java mobile application of Kumari bank. Also, the
visitors can download the terms and conditions of the Kumari bank and the privacy policy documents
too.
Design
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 45
HTML
CSS
4.8 Demat Form
The demat form in the website of Kumari bank enables the visitors to register a demat account in the
Kumari bank. The demat form has been designed using JavaScript for validation. This validation will
make sure that the user enters the correct information in the corresponding fields. In other words,
validation gives the correct format for the users while filling up the form.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 46
Design
HTML
tabler-icon-diamond-filled.svg

Secure Best Marks with AI Grader

Need help grading? Try our AI Grader for instant feedback on your assignments.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 47
JavaScript
4.9 Contact Us
The contact page of Kumari bank has location of the Kumari bank, Email address, phone number and
the company number too. The contact page also provides a feedback form for the user regarding the
bank as well the improvements to be made for the website too.
CSS
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 48
Design
HTML
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 49
CSS
Conclusion
The design specification mentioned in the scenario has been properly maintained for the website of
Kumari Bank. The pages for the website are fully functional and interactive as well as properly
structured. The content and structure for Kumari Bank website is sufficient for the web users as the
users can get the necessary informations from the website.
Hence, in this task I have shown the area where the use of HTML, DHTML, XHTML, client side
scripting language like JAVASCRIPT has been done in a fully functional interactive website using the
design specification as per given for the Kumari bank.
tabler-icon-diamond-filled.svg

Paraphrase This Document

Need a fresh take? Get an instant paraphrase of this document with our AI Paraphraser
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 50
Task 5
Critically review and test the website and analyze actual test results against expected results to
identify discrepancies. [4.1, 4.2, M1]
Consider: the following types of testing mechanisms Such as Unit Testing, Integrated Testing,
Compatibility Testing, and Stress Testing Maintain the test log that maintains the following
information. What was tested, test carried, expected output, obtained output?
Introduction
In this task, I’m going to critically review the website of Kumari bank and test the website for any
flaws in the website. In this task, I’m also going to analyze the actual test results over the expected
output.
Unit Testing
According to Microsoft Developer Network (2015) states that unit testing is a part of testing in which
smaller testable part of software are taken to find out if the module works as they are intended to work
or not. The website of Kumari bank can be tested in various units such as the form, links, and others.
SN Test Date What was
tested?
Expected Result Actual Result Comment
1. 20th
November
2016
Navigation
Panel Test
The different
navigation panel
should direct to the
respective pages.
The link which
are clicked must
open up the
respective pages.
The testing was
successful.
When the Gallery link is clicked. Opens up Gallery page.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 51
When the Contact link is clicked. Opens the Contact page.
When the Download link is clicked. Opens up the Download page.
2. 20th
November
2016
Hyperlink
Test
The respective
pages should open
up when the
hyperlinks are
clicked.
Correct pages
should open on
clicking the
Hyperlinks to its
respective pages.
Therefore, the
testing of
Hyperlinks was
successful.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 52
In the below screen capture shows the homepage of the Kumari bank. The red line shows the
hyperlinks included in the hompegae of the Kumari bank.
When the Site Map hyperlink of the Homepage is clicked opens up the Site Map of the Kumari
bank.
tabler-icon-diamond-filled.svg

Secure Best Marks with AI Grader

Need help grading? Try our AI Grader for instant feedback on your assignments.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 53
When the Privacy Policy hyperlink of the Homepage is clicked opens up the Privacy Policy of the
Kumari bank.
When the FAQ hyperlink of the Homepage is clicked opens up the FAQ page of the Kumari bank.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 54
SN Test Date What was
tested?
Expected Result Actual Result Comment
3. 20th
November
2016
Image Slider
Buttons
When the next or
previous button of
the image slider is
clicked should
change the image in
respective manner.
The next image
should display
when the next
button is clicked
and previous
image should
display when the
previous button
is clicked.
The testing was
successful.
The image slider scrolls automatically and even changes when the next button or previous button is
clicked.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 55
SN Test Date What was
tested?
Expected
Result
Actual
Result
Comment
4. 20th November 2016 Testing of
the News
Slider
The news
slider
should
scroll
continuousl
y and stop
when the
mouse is
over on the
news.
The news
slider
scrolled
automaticall
y and
stopped
when the
mouse was
over.
The testing
was
successful.
Stock Market and exchange rate at the top of the every page scrolls automatically and stops when
mouse is over on it.
Recent News of the Kumari bank and changes in the banking system scrolls automatically and stops
when the mouse is over on it.
tabler-icon-diamond-filled.svg

Paraphrase This Document

Need a fresh take? Get an instant paraphrase of this document with our AI Paraphraser
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 56
SN Test Date What was
tested?
Expected
Result
Actual
Result
Comment
5. 20th November 2016 FAQ page
accordition
The FAQ
page has
Frequently
Asked
Questions.
Respective
answers of
the
questions
content
must
display.
The
respective
answers of
the FAQ
questions
displayed
out.
The testing
of
accordition
was
successful.
The Frequently Asked Questions on the FAQ page.
When the first two spry content are clicked.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 57
When every Spry content of FAQ are clicked.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 58
Integrated Testing
Integrated testing includes testing of different aspects of the website such as html, css and JavaScript
etc. According to Margaret Rouse (n.d.) states that integrated testing as a type of testing in which the
units of the programs are combined and tested in a group of different way. The website of Kumari
bank is tested as a whole in many ways. The html, css and JavaScript that are used in different sections
are tested as a whole to check the proper functioning of the website.
SN Test Date What was
tested?
Expected Result Actual
Result
Comment
1. 21st November
2016
HTML
integration.
The website must
load with proper
contents without
broken links and
images.
The website
loaded with
all the
proper
content in it.
The testing was
successful.
tabler-icon-diamond-filled.svg

Secure Best Marks with AI Grader

Need help grading? Try our AI Grader for instant feedback on your assignments.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 59
SN Test Date What was
tested?
Expected
Result
Actual Result Comment
2. 21st November
2016
CSS integration. The website
must be fully
loaded with
proper css
contents.
The website
loaded with all
the proper
content that
are well
formatted
using css.
The testing was
successful.
Header
NivoSlider
Footer
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 60
SN Test Date What was
tested?
Expected
Result
Actual Result Comment
3. 21st November
2016
JavaScript
integration.
The portion such
as the image
slider and gallery
should properly
function.
The image
slider and the
gallery page
are
functioning
properly.
The testing was
successful.
The image slider scrolls automatically and even changes when the next button or previous button is
clicked.
Gallery
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 61
Compatibility Testing
At present, there are many web browsers developed and used by the users. Therefore, the website
created must be supported in all the browsers developed or the users might not get the advantage of
the developed page. Hence, compatibility is very important. This test will determine whether the
developed page can be loaded in different browser or not.
SN Test Date What was
tested?
Expected
Result
Actual Result Comment
1. 21st November
2016
Compatibility
test for
Google
Chrome.
The website
should load
properly in
Google Chrome.
The website
loaded
successfully in
the Google
Chrome.
The
compatibility
testing was
successful.
tabler-icon-diamond-filled.svg

Paraphrase This Document

Need a fresh take? Get an instant paraphrase of this document with our AI Paraphraser
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 62
SN Test Date What was
tested?
Expected
Result
Actual Result Comment
2. 21st November
2016
Compatibility
test for Opera
Mini.
The website
should load
properly in
Opera Mini.
The website
loaded
successfully in
the Opera Mini.
The
compatibility
testing was
successful.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 63
SN Test Date What was
tested?
Expected
Result
Actual Result Comment
3. 21st November
2016
Compatibility
test for Baidu
Browser.
The website
should load
properly in
Baidu
Browser.
The website
loaded
successfully in
the Baidu
Browser.
The
compatibility
testing was
successful.
Stress Testing
Stress testing is the ability of the website or a program to maintain a certain level of effectiveness under
unfavorable conditions too. Here, in the website of Kumari bank has been tested giving various inputs
in the forms to determine the form could handle the respective data or not in an effective way.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 64
SN Test Date What was
tested?
Expected
Result
Actual Result Comment
1. 22nd November
2016
Validation of
blank fields.
Error message
should display
when the user
submits the
form with blank
field.
Error message
displayed when
the user
submitted the
form with blank
field.
The stress
testing was
successful.
tabler-icon-diamond-filled.svg

Secure Best Marks with AI Grader

Need help grading? Try our AI Grader for instant feedback on your assignments.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 65
SN Test Date What was
tested?
Expected
Result
Actual Result Comment
2. 22nd November
2016
Validation of
Email.
Error message
should display
when the user
enters unwanted
data format.
Error message
displayed when
the user entered
unwanted data
format.
The stress
testing was
successful.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 66
SN Test Date What was
tested?
Expected Result Actual Result Comment
3. 22nd November
2016
Validation of
Mobile
number.
Error message
should display
when the user
submits the form
with blank
Mobile number.
Error message
displayed when
the user
submitted the
form with blank
Mobile number.
The stress
testing was
successful.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 67
SN Test Date What
was
tested?
Expected Result Actual Result Comment
4. 22nd November
2016
Validation
of
Password.
Error message should
display when the user
submits the form with
empty confirm or
different passwords.
Error message
displayed when the
user submitted the
form with empty
confirm password
field.
The stress
testing was
successful.
Critical Review.
The newly designed website of Kumari Bank Limited is much more attractive than the previously used
website. The previously used website of Kumari Bank did not have well managed contents, color
tabler-icon-diamond-filled.svg

Paraphrase This Document

Need a fresh take? Get an instant paraphrase of this document with our AI Paraphraser
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 68
combinations, images and other necessary features. The newly designed website uses HTML, CSS,
JavaScript, jQuery, HTML5 and CSS3 as well. The use of the server side and client side scripting
languages have made the website much more attractive and well managed. The newly designed website
also has Gallery, EMI Calculator, ATM Locations, and Sitemap as these pages were not available in
the previous website. The Demat form has also proper validation for email, password, and phone
number as well. The newly website can be used for wider scope as it has many attractive features such
as News Slider, Image slider, Currency exchange rates. The website has been developed with keeping
in mind of the web accessibilities and making the website more user friendliness. The ATM location
detecting feature is one of the best feature as the user will be using GPS to pin point the location of
Kumari Bank that are nearby the user’s location.
Still there may be some good feedbacks that can make the website of Kumari Bank much more
attractive. So, in the contact pages I have kept a feedback form from the users we can get suggestions
to correct the flaws and issues that may occur in the future. The color management and combination
for the website is not the best as almost every page have only the similar types of color combinations.
At least there should be little variations in the color combinations. The form fills work properly with
proper validation for each section along with the input values type. The website of Kumari Bank can
also have a page where the users can login to their account to view the amount of money they have.
Not only that the page can also have the features such as the bank balance transfer.
Conclusion.
Therefore, in this task I have tested under different sections such as Unit testing, integrated testing,
compatibility testing and stress testing. These testing have shown that the webpage has no errors on
various levels. Hence, the website and it different pages can display and can handle informations under
various browsers as well as various circumstances.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 69
Task 6
Evaluate independent feedback and make recommendations for improvements. [4.3]
Introduction.
Here, in this task I’m going to evaluate the system based on the feedback given and provide future
recommendation for further improvement.
Independent Feedback
Project Title: Kumari Bank
Feedback Given By: Samrat Pandey Signature:
Date:
Project Description (in brief):
The Kumari bank webpage is developed based on the markup language as HTML with CSS and
JavaScript. The project has used various elements of web design such as images, animation, forms
and many more. The website contains a total of 13 pages as per the requirement of the Kumari Bank.
The page has an attractive look and proper color scheme and has taken web accessibility into
account. It has web interactivity which indulges users into the page. Moreover, it uses a modern
concept of responsive design which response according to the browsers and screen resolution
appropriate for variety of devices.
Important Features
of the Project
The website has used high graphics.
The website forms have proper validation for proper input of
information
The website has proper header and footer for ease of navigation
The website contains a proper FAQ page to help assist users
The website contains feedback form to collect the information from
the users
The website has a map to show the direction of the organization.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 70
The website has consistency in theme with proper font size and
color.
Checklists YES NO Comment
Does the website has broken links?
Is the Website Compatible with different browsers?
Does the system has been implemented in align with the
proper design?
Have been critically tested and reviewed the system or not?
Does the website’s form has proper validation?
Does the system fulfill the requirements of the clients?
Have developed the onscreen help to assists the user?
Limitation of the
Project
The website cannot send the information from the form
The website does not have the facility to search the contents
The social media’s links does not direct to the needed page
Significance of the
Project
The website of Kumari bank has following significances
The sections are clear for the bank.
Every page is developed keeping in the mind of easy user interface.
The loading of data and contents are light and fast.
Feedback Evaluation
Feedback Evaluated By:
Samrat Pandey
Signature:
Date:
tabler-icon-diamond-filled.svg

Secure Best Marks with AI Grader

Need help grading? Try our AI Grader for instant feedback on your assignments.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 71
Evaluation of the System:
The webpage designed for the Kumari bank has used the modern concept of responsive design
whose use is very much reasonable as there are variety of devices that can access the web. The
responsive design helps the page to adjust according to the device used whether it is pc or a mobile
device. The page is accessible to various types of user. The page has used proper color scheme with
a consistency in the theme with proper font size for the disabled people so that they can easily view
the contents. The high-quality images are used in the webpage so that the users have clearer view
of the events in the pictures. Though the webpage is static in nature, user interactivity has been kept
in mind including the FAQ pages and the forms indulging users in the page. The forms have also
been properly validated so as to assist users while filling up the form.
Recommendations for future consideration:
The webpage developed for Kumari bank has further more places for improvement. It can be
enhanced in many places so as to make a fully functional website.
The webpage currently developed is more static in nature. So, in future, there can be use of
programming language such as PHP to make it dynamic and make the form actually work.
The webpage can also be hectic to use when certain information is needed to be searched as
there is no search option in the page. So, a search field can be added in the page so that
searching content can be easy increasing accessibility and interactivity.
There are also many places where the web interactivity can be increased using surveys and
many other web features.
The social media’s link can be fixed if the organization provide their link to their respective
social media’s pages.
The design part can be improved more by the use of CSS in an effective way.
All the pages should be designed as a landing page. This is necessary because majority of the
users will not access the home page and will access a subpage through a search engine.
The designer won’t be able to test the website fully. In order to maintain this a professional
quality assurance officer is needed to be hired.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 72
Conclusion.
The website that has been prepared has been properly evaluated by Mr. Samrat Pandey. The website
has to be evaluated and provide necessary recommendations for betterment. Mr. Pandey has provided
an independent feedback form and necessary recommendations. The recommendations that have been
made are the valuable conclusion of this task. The recommendation that have been given can be
followed to make the website much better.
Therefore, the website has been evaluated according to the feedback given. Also, further
recommendation has been included so that the page can be appealing for further more improvement
for the users too.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 73
Task 7
Create onscreen help to assist the users. [4.4]
Consider: Frequently Asked Questions (FAQs) section that can answer the common questions of the
users of the website, Site map that will give the map for the navigation system of the website.
Introduction
There are various types of users. These users may or may not know how to use the website properly.
The manual guide will help the users to assist them throughout the website. The manual guide will
help to know the pages that are included in the webpage and that are linked to each other so, that the
users can take the full advantage of the website and the pages that are included within the website. In
this task, I’m going to create a user manual in order to assist the users while using the Kumari bank
webpages.
Questionnaires
1. What types of Deposit Services does KBL offer? List of deposit types with brief explanation?
a) Normal saving - for everyone with a host of convenient features and banking channels to transact
b) Card Saving - This deposit is useful to Students away from their hometown, as account balance
can be replenished by their guardians in any of the bank’s point of representation, for their various
personal and educational expenses
c) Super Saving (Saving Plus & Advantage Plus) - These accounts offer a wide range of facilities,
discounts and benefits for customers wanting to make deposits above Rs 100,000/-.
d) Kumari Saving - This account is for customers with a deposit range above Rs 1000, 000/- The
banks offer competitive rate and various services and facilities and allows you can bank at your
convenience, without the stress of waiting in queues.
e) Twinkle Star Saving - This account is a minor account for children below the age of 16. This
scheme encourages children and guardians to develop a habit of saving for tomorrow. The account
will be opened in the name of the child and account operation will be done by the guardian/Parent till
the child reaches the age of 16.
f) Subha Laxmi Saving - This account is for housewives as well as working women. Other than the
competitive interest rates the bank also offers attractive facilities and discounts.
tabler-icon-diamond-filled.svg

Paraphrase This Document

Need a fresh take? Get an instant paraphrase of this document with our AI Paraphraser
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 74
g) 50+ Saving - This account is for senior citizens above the age of 50. No more waiting in long
queues, a senior citizen can approach the Customer Service Department at any Kumari Bank branch
and get their account serviced.
h) Fixed Deposit - Customers can deposit any amount of money under the Fixed Deposit scheme, with
a wide range of tenure varying from 14 days to above 2 years. Interest offered by the bank is very
competitive depending on the tenure and amount.
2. Am I eligible to open a deposit account with KBL? (Who are eligible to open an account with
KBL?)
a) Nepali Residents
b) Indian Residents holding valid Registration at the Indian Embassy in Nepal
c) Foreign Nationals holding a valid visa, other than a tourist visa.
3. How do I open a deposit account with KBL?
Customers who wish to open a deposit account with KBL may visit any of our branches. Upon request
for account opening, our Customer Service department will provide the necessary forms, which must
be duly filled and signed by the account holder, request for Checkbook and ATM Card must also be
made, as per the requirement.
4. What is the minimum balance I need to maintain?
Minimum balance requirement for Normal Saving could be different in various branches. Customers
will be required to inquire with the branch at the time of opening the account, for other types of saving
deposit the minimum balance requirements are: -
a) Normal Saving –Monthly minimum balance of Rs 1,000/-
b) Card Saving –Monthly minimum balance of Rs 1,000/-
c) Saving Plus- Monthly minimum balance of Rs 100,000/-
d) Advantage Plus -Monthly minimum balance of Rs 500, 000/-
e) Kumari Saving - Monthly minimum balance of Rs 1000, 000/-
f) Twinkle Star Saving- Monthly minimum balance of Rs 5,000/-
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 75
g) Subha Laxmi Saving - Monthly minimum balance of Rs 1,000/-
h) 50+Saving- Monthly minimum balance of Rs 1,000/-
5. How do I close an account?
All requests for account closure must be made in writing, by signing the closure form by the account
holder. In addition to the closure request, any unused cheque and ATM/Debit Cards (if taken) must
also be surrendered to the bank.
FAQ Page
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 76
In the FAQ page shows the frequently asked questions which commonly solves the answers of the
users. This page helps to clearly remove some of the doubts of the users. FAQ also helps the users to
find out the clear motive of the pages of the website, uses and the objective of the organization too.
Site Map
Sitemap is the simple webpage that provides quick link to all the pages that are available. It is also a
graphical representation of the navigation panel of the website.
Site Navigation
Home Page
The homepage of Kumari bank contains image sliders, links to different pages, various offers and the
services. It has a news slider on the top about the stock market and exchange rate too. It has a recent
news panel which shows the current news that are happening or updates in the banking sector. The
tabler-icon-diamond-filled.svg

Secure Best Marks with AI Grader

Need help grading? Try our AI Grader for instant feedback on your assignments.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 77
homepage section has short description of the bank, the exchange rate of different international
currencies, e-Sewa facility as well as mobile banking facility also.
Financials
The financial section of the Kumari bank contains financial information of the Kumari bank such as
Capital plan and simple EMI calculator. These two-page handle over the financial sections of the
Kumari bank.
Capital plan: - The capital plan page contains the informations regarding the capital plan which
includes opening balance, closing balance and stock, etc. of Kumari bank.
Simple EMI calculator: - This page allows the user to calculate the simple interest of the
investment.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 78
Banking
The banking section of the Kumari bank contains the informations related to the banking system,
account types in Kumari bank. The banking tab of Kumari bank consist of different pages such as
Bank Account, Demat Account, Bank Branches and ATM Locations nearby.
Bank Account: - Bank account page of Kumari bank consist of necessary informations of the
types of account like business bank account, personal bank account. This page also contains
checking account, features of the account and necessary documentation that are needed for
opening the required account.
Demat Account: - Demat account page of the Kumari bank helps the users to register online to
Kumari bank.
Bank Branches: - Bank branches page of Kumari bank contains all the necessary informations
regarding the bank branches that are available in different locations of the Kumari bank. This
page provides the branch of Kumari bank situated in different locations through google map.
ATM Locations: - ATM location page of Kumari bank contains the informations of the ATMs
that are located in nearby the locations through google map. This page shows the location of
the ATM along with the directions to reach the ATM booth for the users.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 79
Gallery
The gallery page of Kumari bank contains the images of the bank. These images include the images of
notices, different ceremonies of the bank, front panel or the help desk of the Kumari bank.
tabler-icon-diamond-filled.svg

Paraphrase This Document

Need a fresh take? Get an instant paraphrase of this document with our AI Paraphraser
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 80
Downloads
The download page of Kumari bank facilitates the users to download the form for opening a new
account, android mobile application for the smart phones from the play store and java mobile
application file for non-android phones too. This page also enables the users to download the Terms
and conditions of the bank and the Privacy policy of the bank.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 81
Contact Us
The contact us page of Kumari bank contains the information of Kumari bank that is available in
nearby location through google map. This page also helps to get the messages from the users after
sending messages along with the name and email of the user. This page contains the email address and
phone number of the bank present in nearby location.
Conclusion
Hence, onscreen help to assist the users has been designed in the task with proper manual guide to
assist the users throughout the webpages. I have also included Frequently Asked Questions (FAQs)
section that can answer the common questions of the users of the website, Site map that will give the
map for the navigation system of the website in this task. Sitemap helps the users to see the
diagrammatic form of the website.
Therefore, the above onscreen help for Kumari Bank limited will surely help the new users to
use the website effectively and also get the necessary informations.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 82
Task 8
Create documentation for the support and maintenance of the website. [4.5, M3]
Consider: Designing the layout, your choice of tools, task breakdown approach, data and information
collection mechanism, product deployment and maintenance technique for this project.
Introduction
Documentation of the project is very much necessary for the support and maintenance of the website.
It is also necessary to understand the working mechanism of the website and to maintain it properly.
According to Hui Suen (2015) claims that managing a website without any documentation is similar
to making a furniture without any directions or nails. So, in this task, I am going to present a
documentation for the website built for the Kumari bank.
Design Layout
Proper designing of the layout of website is very important for the users as it becomes appealing to the
users and indulge them in it. At present a website must not have just the information that are necessary
for the users but also keep more and more animations, graphics to attract the users and keep them busy
within it. According to Bravenet (n.d.) states that nowadays the visual design of the website has
become much more important showing clear graphics, navigation and animation.
The proper designing of the website of Kumari bank has been done using following languages such as
HTML, CSS, JavaScript and JQUERY. Therefore, these languages can create an effective and
responsive layout in order to reflect the organization.
HTML
HTML stands for Hyper Text Markup Language. It is the language that is understood by the browser
and forms the content of the website. The html is used to display any of the words, images, animations
and the form elements.
tabler-icon-diamond-filled.svg

Secure Best Marks with AI Grader

Need help grading? Try our AI Grader for instant feedback on your assignments.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 83
CSS
CSS stands for Cascading Style Sheet. CSS is a language that is used to style any markup languages.
HTML only provides content for the website, but CSS provides styling and design to those content.
CSS allows the designer to provide customizations like adding a background image, changing font,
managing layout, etc.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 84
JavaScript
JavaScript is an Object-Oriented Programming language. It is used to add animations and validation
to website. According to Mozilla Developer Network (2015) states that the JavaScript is the procedural
as well as object oriented used to make a dynamic website. JavaScript is a client side scripting language
which is visible to the users. It helps to make the website more interactive and interesting by adding
certain web elements.
The image below shows the JavaScript code used in the validation of the website.
JQUERY
According to Henry He (2012) states that JQUERY is simply a JavaScript library. JQUERY is the
collection of JavaScript code whose instance can be called to do a certain task. They are the
JavaScript’s template which reduces the time-consuming task to write the JavaScript’s code.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 85
The image below shows the JQUERY code to design the layout of the website.
Tools Used
The webpage designing needs some tools so as to code and design the site properly and efficiently.
According to Paul Boad (2013) states that the choice of tools for designing a website is a personal one
that depends upon the types of website that you build and the work type you will do with the website.
The tools used in designing the webpages of Kumari bank are as follows.
Photoshop
Photoshop is an application from Adobe which is used in graphic designing. The tool contains from
the basic to the advance tools. It has many effects and filter which is effective for logo making and
photo editing. The tool here I have used for adjusting the resolution of the images to fit the page and
to create the logo for the Kumari bank.
tabler-icon-diamond-filled.svg

Paraphrase This Document

Need a fresh take? Get an instant paraphrase of this document with our AI Paraphraser
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 86
Sublime Text
The sublime text is a software developed to design web based application. It has support for various
languages including HTML, CSS, JavaScript, PHP, XML and many more. The tool has been used to
code HTML, CSS and JavaScript for the Kumari bank.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 87
Flash
Flash is an animation creating tool provided by Adobe. In my I, have used Adobe Flash Cs3 version.
I used Flash in creating the sliding images for the e-Sewa payment service in the website of Kumari
bank.
Task Breakdown Approach
According to Work Breakdown Structure (n.d.) has defined task breakdown is an approach that
organizes a task into manageable sections. Task breakdown helps to properly manage the time
available in order to complete a task in a certain time period. There are various methods to show the
task breakdown.
Here, I have used a Gantt chart to illustrate the time period for the development of the web page.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 88
Data and Information Collection Mechanism
The web page can function and improve on the basis of the user’s views and ideas. Thus, the website
also needs a mechanism through which it can collect the information and views from the users. Hence,
a form has been created in order to gain the views from the users. The users can give their
recommendation including their names and emails and send the message.
tabler-icon-diamond-filled.svg

Secure Best Marks with AI Grader

Need help grading? Try our AI Grader for instant feedback on your assignments.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 89
Questionnaire
In this method, a set of questions are prepared and provided to the individuals to give the required
answers on the related topic. Similarly, some sets of questions were given the owners of the bank
to fill those with the necessary answers. The answers replied by the owners were very useful while
developing and designing the website and other modules that are integrated on the website.
Interview
This is the method where a researcher and the client communicate and discuss about the subject
personally, directly or on the telephone. While redesigning the website for Kumari Bank Limited, I
had a meeting with the authorities of the bank for the interview. The interview went very well, and
helped me to elaborate my design and methods of developing the website.
Observation
Finally, talking about observation, it is the method where researcher visits the site by himself and
Gathers the required information about the related topic without requiring interaction with the officials.
An observation was made over the current system and work procedure of the bank to determine the
nature and situation of the bank. This also helped to sort other remaining issues and questions regarding
the bank.
Product Deployment
According to Chris Coyier (2013) states that web deployment is the process of moving the webpage
from the local environment to the web servers making it available online. The deployment can be
related to uploading of the web pages in the World Wide Web. It is an important process in the web
development activity where the users are actually involved in the usage of the site. For Web
Deployment, certain steps are required to be carried out. They are explained as follows: -
Domain Registration and Hosting
Domain is the unique address which is given to the website with which the users can access the web
pages. The domain can be registered with many of the domain name providers company such as
GoDaddy.com. They provide the domain names at a reasonable price. With domain name, the step
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 90
also involves buying of a space at the web so that the pages can be uploaded. There are many companies
providing the domain name and cloud space at an affordable price.
The domain name of Kumari
Banks website is
www.kumari-bank.com.np.
This domain was registered
through Mercantile
Communications PVT.
LTD.
FTP Tool
The FTP tool helps the developers upload the web pages to the site. There are various FTP tools such
as FileZilla, WinSCP, SmartFTP and many more. For the Kumari bank website, I have used FileZilla
to upload the website.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 91
The image above shows the FileZilla interface.
In order to upload a website, it is very important that you have noted the domain’s host name, username
and password that you have registered. Simply put the host name, username and password in the field
and click quick connect. Then you can simply navigate to the pages that you have created in the left-
hand side and drag it to the right-hand side which will get uploaded in the www. The domains
hostname (www.kumari-bank.com.np), username, password is required before uploading the website.
Maintenance
Even after the web pages are ready and uploaded, the task is not completed as frequent maintenance
and update is required. The web pages might need change in content or latest news and events might
be needed to be added. Without frequents updates, the website cannot be of use providing the same
information. For this, a professional is needed for bringing any of the changes in time.
Conclusion
A proper documentation of the website is an asset for the developer and the company itself. The
developer gets to earn the money whereas the organization can utilize the website for the betterment
of the organization. The support and maintenance are also major parts that are to be considered while
developing a website.
Hence, in the task, I have created the documentation for the support and maintenance of the website
of Kumari bank which includes designing the layout, choice of tools, task breakdown approach, data
and information collection mechanism, product deployment and maintenance technique for this
project.
tabler-icon-diamond-filled.svg

Paraphrase This Document

Need a fresh take? Get an instant paraphrase of this document with our AI Paraphraser
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 92
In order to achieve a Distinction, the learner must:
In order to achieve D1, your will critical reflection will demonstrate that conclusions have been
arrived at through synthesis of ideas and your ideas have been justified presented in task 4 and 5.
For D1:
For D1 in task 4, I have implemented a fully functional, interactive website using the design
specifications that have been provided in the scenario. In task 4 I have exhibited the use of HTML,
CSS, JQUERY, client side scripting language like JAVASCRIPT. I have provided the screenshot of
HTML, CSS, and JAVASCRIPT that have been used in necessary places along with the codes. The
website of Kumari bank has been developed using some of the data, content pictures of the Kumari
bank itself from the website while the remaining parts such as color combination, managing different
pages, buttons etc. have been done using my own ideas and they have been justified in every task as
per the scenario given.
In task 5, I have critically reviewed and tested the website. I have also analyzed the actual result over
expected result to identify discrepancies. I have included different types of testing such as Unit testing,
integrated testing, Compatibility testing and Stress testing. In a tabular form, I have presented what
was tested, test carried out date, expected output and the obtained output also. Hence, I have made
effective judgement while reviewing and analyzing the test results.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 93
In order to achieve D2, you will provide evidence that you have taken responsibility for managing
and organizing activities while doing task 4 to 8. The evidence will show how you have planned,
organized and managed the activities.
For D2:
For D2, in task 4 I have implanted a fully functional website using the design specification mentioned
in the scenario. I have managed and organized the task as best to my knowledge. I have also taken
citation from different sites along with their references to provide the evidence. In task 5 I have
critically reviewed and tested the website using different testing mechanisms of testing. For evidences,
I have analyzed actual test result over the expected results to identify the discrepancies. In task 6 I have
evaluated an independent feedback and made some recommendations for further improvement. In task
7 I have created onscreen help to assist different types of users. I have also taken Frequently Asked
Questions (FAQs) section that can answer the common questions of the users of the website, Site map
that will give the map for the navigation system of the website. Finally, in task 8 I have created
documentation for the support and maintenance of the website. In this task, I have considered designing
the layout, your choice of tools, task breakdown approach, data and information collection mechanism,
product deployment and maintenance technique for this project. Hence, in this way I have taken full
responsibility for managing and organizing the activities in a proper planned and managed way.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 94
To order to achieve D3, you will provide evidence which shows that you have applied creative
thinking and have taken self-evaluation while doing Task 6 and 7.
For D3:
For D3, I have provided evidences which shows that the creative thinking and self-evaluation have
been applied while doing task 6 and task 7. In task 6 I have evaluated independent feedback form
another user and also mentioned some of the useful recommendations for further betterment. The
feedbacks that have been provided by another user have been taken in account. These
recommendations are very important for the future improvement and also to update the site in better
way. In task 7 I have created onscreen help to assist the users. I have also considered Frequently Asked
Questions (FAQs) section that can answer the common questions of the users of the website, Site map
that will give the map for the navigation system of the website. I have made every section by putting
myself as a user in the website and in the onscreen help section to make the user to have some ideas
while using the website through the help section. Hence, in this way I have provided evidences which
shows that the creative thinking and self-evaluation have been applied while doing task 6 and task 7.
tabler-icon-diamond-filled.svg

Secure Best Marks with AI Grader

Need help grading? Try our AI Grader for instant feedback on your assignments.
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 95
References: -
Thomas Young (2015). Website User Types. Intuitive Websites. Available from
http://intuitivewebsites.com/articles/website-user-types/
Thomas Young (2015). Capturing Attention of The Novice Users. Intuitive Websites. Available from
http://intuitivewebsites.com/articles/capturing-attention-of-the-noviceweb-user/
World Wide Web Consortium (February 2005). Introduction to Web Accessibility.
Available from https://www.w3.org/WAI/intro/accessibility.php
Web Aim (Aug 28, 2013). Visual Disabilities. Available from http://webaim.org/articles/visual/
Web Aim (Aug 28, 2013). Auditory Disabilities. Available from http://webaim.org/articles/auditory/
World Wide Web Consortium (n.d.). How people with disabilities use web. Available from
http://www.w3.org/WAI/EO/Drafts/WAI-access-profiles
Understanding the web design Environment (anon, 2005). Available from
http://academic.uprm.edu/roliven/chapter_one.pdf
World Wide Web Consortium (11 Dec, 2008). Web content accessibility guide. Available from
http://www.w3.org/TR/WCAG20/
Simply Compelling (n.d). In Web Design, Content is King. Available from
http://www.simplycompelling.com/content-is-king/
Dap Apps (n.d). Concept and Visual Design. Available from http://www.dabapps.com/what-we-
do/design/concept-visual-design/
James Deer (Aug 6, 2013). How to Architect a better Site-Map. Tuts Plus. Available from
http://webdesign.tutsplus.com/articles/how-to-architect-a-better-site-map--webdesign14180
Got2Web (n.d). 5 essential elements of a Good Website. Available from
http://www.got2web.com/five-elements.html
Graham Jones (June 17, 2015). How important is web interactivity? B2C. Available from
http://www.business2community.com/online-marketing/how-important-is-websiteinteractivity-
01248595#zuJI4MYlLLgDqRUP.97
Bravenet (n.d). Web Design Concept. Available from
http://resources.bravenet.com/articles/design/layout/web_design_concepts/
Document Page
Web -Site Designing Concept 2016
Pradeep Shrestha (HND / Second Semester) 96
Mozilla Developer Network (Oct 30, 2015). About JavaScript. Available from
https://developer.mozilla.org/en-US/docs/Web/JavaScript/About_JavaScript
Henry He (july 22, 2012). How JQERY works. Code Project. Available from
http://www.codeproject.com/Articles/426013/How-jQuery-works
Chris Coyier (July 25, 2013). Website Deployment. CSS tricks. Available from https://css-
tricks.com/deployment/
Microsoft Developer Network (2015). Unit Testing. Available from https://msdn.microsoft.com/en-
us/library/aa292197(v=vs.71).aspx
Margaret Rouse (n.d.). Integrated Testing. Tech Target. Available from
http://searchsoftwarequality.techtarget.com/definition/integration-testing
chevron_up_icon
1 out of 96
circle_padding
hide_on_mobile
zoom_out_icon
logo.png

Your All-in-One AI-Powered Toolkit for Academic Success.

Available 24*7 on WhatsApp / Email

[object Object]