Page 1



Introduction This Website Designing and Testing Assignment document is to be submitted by student covering detailed understanding of web design concepts, understanding their usage in web design, understanding the business requirement and then designing the website based on the requirement. I will create this report in the same order in which tasks are mentioned in the assignment booklet. All the required tasks will be completed. Internet














organizations/individual to share or communicate information. Websites is one of the mainly used medium to share the information with rest of the world as it is very easy to use and helps users to grow their business by making global presence with the help of websites. Because of the global accessibility of websites, information can be retrieved by the users as and when it is required and as per their convenience. Also websites can be enabled to have two way communication with the users where users can submit their concerns or queries to the organization and website can respond to the user queries in quick and easy manner, which ultimately results in growing business opportunities.

LO 1: Web Design Concepts Web design concepts help web designers to capture the required inputs from users in order to produce an interactive and responsive web site. A good website shall have the company logo and its objectives on the website which helps to build the good image in front of customers/users. A website which is not properly designed, will result in messy content on website and less information availability. If user could not find the information that he is looking on website, he/she will prefer to move away from the website and will search another website where he/she can find the relevant information easily. One of main success factor for a website is that it shall be accessible to all type of users. Major web design concepts that a web designer shall follow in order to produce a good website, are as given below:

User Requirement Before starting design of any website, there shall be a clear understanding of what user requirement is and what all information will be made available on website. Design of website will depend on the user’s requirement as there might be different kind of users who will be accessing the website. Hence website shall be designed in a manner that it fulfills the requirement from all user’s perspective, although we will receive the requirement from the user who wish to get the website developed and rest the other world will access that. Capturing correct user requirement is the major success factor of any website.

Contents Contents of any website decides the success/failure of any website because this is used to show the information to the targeted audiences/users of that website. If the content of the website is not appropriate of not organized in an easily accessible manner, it may lead to user getting confused or frustrated and ultimately moving to some other website which may offer him the same information in a better manner.

Industry type Websites are designed based on the nature of work carried out by an organization. So website design will also be impacted as website is the mirror image of an organization in front of customers/users. It gives them an idea about the services offered by organization, availability of different products etc. As website will play a key role in the success of any organization irrespective of its size, business type, services offered. Information or website pattern for an educational institute will be totally different from the website of an e-commerce platform which will be offering different items to the audience in different manner.

Target audience While creating a website, web designer shall also be aware about the audiences of the website. Web designer shall have clarity about certain characteristics of target audiences like their age group, likes or dislikes, products used by them etc. which will help them in organizing content in such manner that it can be accessed easily. This is very important to know the target audience. If web designer have no idea for whom he has to design, he is creating websites by his own and user may find it difficult to use. There can be different different audiences for a website, hence web designer shall try to find out the common interest areas so that he can design a good website. While the user is providing the requirement to develop a website, in parallel he/she will also specify the audience of that application that may be the top management of that organization, middle management, admins who will manage the application, stock managers who will manage the stock data for that organization, or it will be the end user who will be accessing this website to get the necessary information. User shall have a clear vision of the targeted audiences who will be accessing the application and what all information they may require when visiting the website.

Web site’s purpose Purpose of having a website for an organization is to provide the equal access to it users. Everyone will get the same screen, and the most important factor is the image projected with web site. A website created with using proper web design concepts will definitely help to make a better impression on customer. When it is compared the costs associated with a website development versus the traditional method of advertising, website is very cheaper. Traditional methods of advertisement like ad in paper, magazines etc is quickly outdated and every time you have to plan for new but in case of website, it is very easy to update the website with new content/idea in fraction of time.


Navigation is a very important part of any website. A good web designer should ensure that people can get information in an easy manner what they want mostly. For larger sites web designer may have menu items that contain other menu items also called ‘cascading menus’ or ‘drop down menus’. Menu lay out will depend on how many items are there in menu. Navigation











Simple navigation means having less number of sub pages and Complex one is where multiple main pages along with lots of sub pages. So organizing the complex menu/navigation is a little bit tougher. There are no standard guidelines available on creating Navigation/menu on any website. This is the quality of web designer how better he can organize them in order to make website effective.

Read about ER Diagram and Normalization Factor Assignment Compatibility These days peoples are more handy with mobile devices like smartphones or tablets and they are more often using these devices to access websites. Because screen size of these devices is small in comparison to laptop or desktop, sites shall also have a mobile version which can be used on such devices. These websites designed for such devices, shall be capable enough to adjust the contents as per the resolution of devices. If any organization website is not accessible on these devices or having problem in displaying the content properly, the organization may miss a potential customer.

Links All the links provided on any website, shall have all the links working once it is available to end user. Broken link or missing information puts a bad impression on user and user may leave website. It is always advisable to do a sanity check before movig website to the production or making it available on the web for the users.

Accessibility A good website shall remain accessible all the time and it should work in responsive manner so that user can get the information ASAP. Page load time shall not be high and it should get loaded immediately as and when requested.

1.1 Choice of Web Design Concept for ZCBC As explained in above section, these are the common web design concepts which one should follow to build an interactive and user friendly website. To design the website Business Computing and System Development, I have decide to use the below web design concepts:

  

User Requirement: Understanding the user requirement i.e. creating a website for ZCBC with features such as course details, university details, contact details etc. Contents: Choosing the appropriate content for website e.g. detailed information on courses offered by ZCBC, updated contact details, etc. Industry Type

    

Target Audiences Web Site Purpose: Purpose of creating a website for ZCBC is to provide the detailed information about ZCBC and courses offered by ZCBC to the end users who may be accessing this website from different cities of world. Navigation: Navigation of website will be designed in an easy to understand and use manner so that visitors can find the required information easily. Compatibility: Website is designed in such a way that it can be accessed with the help of commonly used browsers. Links: All the links created on website shall be accessible to end users when this website will be made available to users.

I have not considered Industry type for this particular requirement, as it is specific that this is education industry and I have to design website as per the education industry patterns. Also I have not considered the Target Audiences as well because target audiences of this website are prospect students who wish to opt the courses in this organization.

LO 2: ZCBC Website Design Here user requirement is to design and develop a website for newly opened college named, Zodiac College of Business and Computing, situated at the heart of London and offering following courses:

  

EDexecl HND Computing and System Development EDexcel HND Tourism and Hospitality Management British Computer Society Certificate in IT

For this assignment, I have to design ZCBC website which can provide the information of the above mentioned courses and shall be accessible to the prospective students in an easy manner so that they can access it as and when it is required. I have designed website in the same manner as it is stated in the task sheet.

StoryBoard A storyboard is called the blueprint for any web project. It is used to outline the design approach for website and also it defines what all elements shall be there on each page. I have used navigation layout to create show the blueprint of this ZCBC website. Any Navigation layout shall be discussed with customer before implementing the requirement.

Navigation Layout of ZCBC Navigation laout design defines how website will be accessed and what all information shall be displayed where and how. What all information will come under which header is part of the navigation layout. Below is the navigation layout of ZCBC which displays the organization of pages and menus.

Figure: Navigation Layout of ZCBC Categorization of web pages are:

   

Headers Navigation bar of website Main Contents of website Footers

2.2. Evaluation of Competitors (other Higher Institutions in UK) It’s always a good approach to study the competitors before we proceed further, so I have identified the competitor who are providing similar kind of service in London and decided to study their websites, what kind of services are provided, how their websites are designed, how easily required information can be obtained, how the contents are placed, how the provided links are working etc. This evaluation process, helped me to get an idea of website layout, content organization etc. It helped me a lot in designing of ZCBC website. In this case I visited websites of four major higher study schools in London. My criteria of rating these websites are:

   

Web Site Design Content Information Availability Accessibility

1st UK College of Business and Computing Web site of the organization: UKCBC website is very well designed and contents are organized in proper manner. All the relevant information for students are organized in such a manner that it can be made available easily and student can search it without putting more effort. There are lots of contents are placed on Home page itself. Site is designed in consistent manner and the contents of Header and Footer are same on all pages which gives this website a consistent look and feel and attracts user. The sub pages are properly organized with relevant contents. There is one useful link provided on Home page itself where prospect students can get the details on the available courses without navigating through all the menu items and searching the relevant courses. All the information which might be useful for existing students or prospect students are very well organized and places. Overall website design is very good and impressive. Home page of website is as given below:

Figure: UKCBC Course description page having the complete details of courses offered. This page is having the relevant pictures and short description about the courses. Pictures used on this page is of similar nature of course offered. Student can apply online for the selected course from the website itself. You can easily identify different courses. Navigation layout is designed properly and providing the complete path of pages on each page which helps users to identify the path and current page where currently user is navigating. There was no delay observed in page loading and page loading time was also quite low i.e site is working at good speed. The one issue that I observed on this website is that Apply Online is not at all working and taking a lot of time to get loaded. Also once page gets loaded, it is showing an error message.

2nd University of Birmingham

Web site of the organization: This website is designed in very simple manner and provides the relevant information easily. Courses are categorized as per levels like Under Graduate courses, Post Graduate Courses etc. Menu bar is designed in such a manner that is assists users to navigate site easily. Current page information is displayed on all the pages so that user can get the information of navigation/menu bar where current page is located. It is helpful for users to go back to the previous menu as and when required. Also this website provides a link on home page itself to search the available courses and it gives an option to search Undergraduate Courses, Postgraduate courses and all courses.

Figure: University of Birmingham The page loading time is low and the pictures chosen to show courses are relevant in nature of the course. Once user searches from the Home page, it is displaying the list of available courses with initials so that if user is aware about the course name, he/she can directly go to that page by clicking on the Initial Letter of that course. Site is having lots of useful information for every one who is looking to go for higher studies. With the help of photo gallery placed on website, users/visitors can have a look of the classes and instruments available in school.

3rd Birkbeck University of London Web site of the organization:

The design of the web site is quite impressive and simple as well. It is providing the required information of different courses under different headers. Information and courses are categorized and information organized in the same manner as well. Course information on this website is organized in such manner that user can get the details easily. Menus created on website are simple in nature and easy to navigate. Sub pages are designed properly and the required information is available in presentable manner.

Figure: Birkbeck University of London This website is providing three different kind of search on home page i.e. Search course based on keyword, browse by subject area and browse by course title which is one of the good feature as it will help to retrieve the course information in an easy and efficient manner. Pictures selected to represent the course are relevant and sub pages provides comprehensive information on the course. User’s current navigation path is displayed on each page which helps user to know the current page which he is navigating and what path he traversed to come on this page. There was no error observed on pages and also pages are getting loaded without any delay. There was no broken links on this site which is one of the criteria to be a good website as I mentioned in LO1 of this task.

Also Read: CCL Website Implementation Assignment

4th Aston University

Web site of the organization: The Website of Aston University is loaded with lots of contents on the home page and on sub pages as well. Menus are categorized in different streams like study, research, business, news and events, international and about us. Under main menu as described above, sub menus are created which leads to the respective web pages with respective information on the course. However there are repetition of menu items was also there which is not looking good. Menus on home page are appearing on top and in middle layer as well.

Figure 4: Point Blank Music School Images and content choosen on sub pages are relevant and providing lots of details on the courses offered. It also offers searching of course by entering the relevant keyword in search box. It allows students to download the prospectus for the related course. The website is providing information on placement facility. University website is also offering mobile app for students on different platform like Windows, iOS, Android etc. As this is providing different stream like study, research etc, it provides an opportunity to the user to identify and choose the best course from the available courses. Searching of course is available by entering the relevant keyword and by navigating the Initials of course as it is providing the available course listing based on Course Initials. Once you are on the desired course, it offers all the information related to the course on that page related to that coursr. There was no delay in page loading and all the pages are loading without any error.

LO3 Testing of Website 3.1 Testing of ZCBC website

It is recommended to do the testing of functionalities of website before making it live and open to public access. I have performed the below test:

       

Working of all pages as per design All links are working Forms appearance as per design Data validations on forms All pictures and text contents Pages are getting loaded in stipulated timeline All external links provided on website are working properly Testing of cross browser compatibility

Below are the screen shot of website which shows that all the functionalities are working and all the pages are getting loaded without any error on screen.

Figure: Home Page

Figure: Courses Description

Figure: Admission Page

Figure: Useful Links

Figure: About the College

3.2 Analysis of Testing Results Below table shows the summary of testing performed on the website and their expected result and actual result i.e. it is the snapshot of the entire test that I performed on website and results of test performed.

Test Name

Expected Result

Actual Result

Working of all pages



Broken links

Not found

Not found


As per design

As per design

Data Validations

In place

In place


As per design

As per design

Response Time

10 Seconds

5 Seconds

External Links




Cross Browser

Cross Browser

3.3 Feedback Evaluation I received feedback from one of my fellow on the look and feel of website.



She suggested me to improve look and feel of website by making consistent look and feel on all the pages of website. She also suggested me to use Templates to reduce the development efforts and maintain the same look and feel on all pages. This was a very good feedback for me and it helped me to improve my website design and also helped me to save the development efforts by using templates. Second feedback I received was on form validations, earlier I have not used validations on the website forms which is leading to garbage data to the system. Once I received the feedback, I have incorporated the necessary user input validations on all the forms in website and now all the validations are working as per design.

3.4 Onscreen Help for users I have designed this website in such a manner that all the links provided on this website are easy to understand and user can easily find out the information on website by clicking on respective links e.g. Contact Us link send the visitor to Contact page where he/she can submit his queries to the organization or they can get the contact details from this page which can be used to contact organization as per their needs.

User can refer FAQs section to get more help on generic topics. Below is the screen shot of FAQ section available on website.

Recommended Read by Our Experts: Android Mobile Application Development Assignment Help

3.5 Support and Maintenance of website To maintain the up time of website, periodic maintenance is required which is a collection of activities which helps to maintain the website available for end user. During the maintenance period, below list of activities are being carried out majorly:

     

Monitoring of website performance Implementation of new changes Fixing of bugs identified Patch updation for underlying database Patch updation for underlying OS Patch updation for underlying webserver

Few of the activities mentioned above requires the website downtime also i.e. during maintenance period website will not be accessible to users. To make website accessible on internet, domain will be required. Also FTP/SFTP can be used to upload website on webserver. To implement the changes due to business needs, we need to make the site nonaccessible to end users and then apply the changes. Once changes are done, all the files will be uploaded to webserver using FTP/SFTP softwares like FTPLite.

Appendices/References        

Joshue O Connor, Pro HTML5 Accessibility, Apress, 2012 Powell, Web Design: The Complete Reference, Tata McGraw-Hill Education, 2002, second edition James Kalbach, Designing Web Navigation, “O’Reilly Media, Inc.”,2007

Read more about computer programming assignment help

Programming Assignments Help is the best assignment help provider in the United Kingdom. Our online assignment writing help UK is especially dedicated for the students studying in all UK colleges and universities. Submit assignment to get the best quality assignment help. Programming Assignment Help UK is committed to plagiarism free assignments. This free Website Designing and Testing Assignment is a complete solution based on case study.

Website designing & testing  

This Website Designing and Testing Assignment document is to be submitted by student covering detailed understanding of web design concepts,...

Read more
Read more
Similar to
Popular now
Just for you