LO5: Evaluation

We were asked to create a multi page website about Bee population and what people can do to help the Bees and their depleting populations.

The client requirements specified that the website was to be about Bees, there lessening populations and how to help them. Other than that I had free will over what it was to contain. From this I decided to make this website targeted for children (aged between 5-8) to both educate them and to gain their interest in the subject of wildlife and the world around them. Whilst doing this I wanted to make the website attractive to children (the target audience)

 I ensured the website was child friendly by using a simple/ easy to follow plan to ensure easy navigation around the site. It was also child friendly because it has a cartoon look for the beehive, which fits with the brief because the website is for children and shows a strong connections with bees.  It also follows the client requirements because it has pages that talk about types of bees and gives two ways to raise awareness of bees such as making  Pom-Pom Bees and it shows children how to help bees in ways such as planting flowers in the garden.  All the pages in my site have a similar house style. This is because they all have the same colour scheme (Blue, Green, Yellow and White) and they all have a Beehive shaped navigation bar. As well as this, the website does have a small bee as a marker on the Nav bar and the text boxes are in the shape of cells in a beehive. It uses the small bee to show what page you are hovering over by 'flying' next to that section. In each page I have included relevant text. The HiiveIT Logo (which is a bee with trailing flight marks following it) is at the top right of the website so that it is visible to the viewer.

I used HTML5 to create the website and used Photoshop to create my assets (the Beehive nav bar, The mini Bee marker, The HiiveIT Logo, the background of the website and the Text 'cells'.)   I also used Adobe Audition to create my colouring pages because it worked better than if I were to do this in Photoshop.

I can't really compare my site to that of a professional site. This is because most websites that are about bees and helping the bees is aimed more towards adults and not towards children in my Target audience. Although these sites do have activities for children to get involved in bees and helping them I feel that my site makes it easier for them (children) to understand what they are doing and my site has colouring pages to make the site more fun for both children and adults alike.

My website does work. This is shown by my test plan and from testing I was able to see that everything worked in my website. I know this by testing the navigation between each page and in most combinations that people would be looking at them through. I also tested the colouring pages and each of the colours to test that they worked. And I am glad to say that It all worked.

I gained feedback from both adults and children (within the target audience and just older than my target audience). I did this to get a more well rounded feedback for my website and have more to work on in terms of Improvement in the future.

The main improvements I were given were:

• Make the text larger- Some of the younger children couldn't read the writing.
• Make some of the Language less complex- The younger children needed help understanding everything in the text.
• Make sure the images show up on the page- Sometimes the pictures input on the page didn't show up.
• Add more images- To make the website more interesting (said by some of the older children)
• Make more colouring pages- For more options of colouring said everyone in the test.

 Strengths in my website is the cartoonish and childish appearance. I think that this is a strength because it is attractive to the target audience (as they are quite young) and the fact that it both looks good and it works.

A weakness in my website is the language being more mature than that of my target audience in places. This is because I am not used to writing for a young audience to understand when it comes to describing animals and habitats.

If I were to do this website again I would improve this by adding more images in the site on each page and making sure it shows on each of the web browser. Another improvement for my website is to make the language used in my website more simple. In order to put these Improvements in place I would have to go out taking photographs of my chosen subject and I would practice writing for younger children to properly grasp what they understand. 

LO4 User Testing to complete

Navigation:

I have Tested the navigation of my website by going through the navigation bar and making sure that the text is easy to read, easy to understand and the navigation bar leads the user to the correct page on the website.





Internal and External Hyperlinks:
The internal hyperlinks in my website work by being clicked I do not have any external Hyperlinks so I was unable to test this. I tested this by clicking on the internal hyperlinks and making sure that they led to the intended area on the site. This was a success.

I quickly tested both the hyperlinks and the navigation in the website and then got  young people to test them as seen below.




Page load times:
Each page of my website loads in approx. 3 seconds on Mozilla Firefox web browser. I have tested this by
measuring the amount of time it took for the website to initially load and the time it takes to change from one
page to the next.


Performance on different Web Browsers
 The web browser I used for this test was Mozilla Firefox. On Internet Explorer web browser my website works well, this is because the website looks right (in comparison to my visualisation diagram) and the website loads quickly and moves pages quickly.  Similarly, my website seems to work just as well on  Mozilla Firefox and Google Chrome web browsers. I tested this by loading my website on the different browsers and measured the amount of time it took to load, compared the functions of the website on each browser and checked to see if the website looked the same on each browser.



Consistency of House Style:
The house style of my website is Very consistent. This is because they were all made with the same background to make it easier for children (my target audience) to navigate the website. I have tested this by looking thorough my website and making sure that each page looked similar. I have also compared the appearance of my website on different web browsers.
 
Gaining Feedback:
 I got feedback for my website from both adults, peers and children that fit into my target audience . I did this to get a well rounded opinion on my website from multiple age groups:

The main improvements for my site were to add more images to the informational pages, Create a larger variety of colouring pages (this gained a very good response from my audience) and to make the text slightly larger.
 

Whilst Talking to the test subjects, after the Initial testing I asked them If all the pages looked the same. All of my test subjects said Yes, all of the site pages Looked the same, with the exception of the colouring pages but it still fits with the style of the website.

LO3: Posted Website

The house style of my website is very consistent throughout its appearance. This is because I used the same background image and shapes to show the content of each page. I did this to make it easier for children (my target audience) to use and navigate through the site. Also it gives the site a consistent look/ feel. The overall house style of my website is childish, cartoony and colourful. I did this to make the site more appealing to the audience and because I thought it looked pretty.

I would change/ manage the website I would use design software to make said changes and update the site with more relevant information or more colouring pages. This would help with overall site maintenance.

My website is hosted on a UTC web server so I can test my site on children. The link to the site is: http://students.utcsheffield.org.uk/lauren_hopkins_unit34/

Construction of website: The Website was Constructed in HTML5 from a previous website I worked on. See screenshots below:

Beginning Code:

Finished Code:

Colouring page Code (some): 

How my website compares to the visualisation diagram very well because the look very similar as shown below:

They both look very similar, this is because I used the same assets for each page to make sure the site was as close to my original idea as possible.


Visualisation Diagram:

Index Page of site:

LO2 Colouring book links/ Bibliography/References:

Actual colouring book http://examples.oreilly.com/0636920022473/svg_coloring_book/coloring_book.html

Code for the colouring book:  3/4 way down - http://chimera.labs.oreilly.com/books/1234000000770/ch05.html#constructing_the_coloring_book_javascript

Actual colouring book code: https://github.com/sandersk/HTML5-for-Publishers/blob/master/svg_coloring_book/coloring_book.html

LO2 Visualisation Diagram and Annotated Wireferame

Annotated Wire Frame

Visualisation Diagram:

  

LO2 Legal and Ethical

Copyright: As the main bulk of my website is created by myself (the cartoonish backgrounds and colouring pages) I do not need to worry about copyright in this respect.

But the photographs I have used in the website are from other sourses and may be copyrighted. To avoid copyright infringement I would have to get in contact with the owner of the image (via telephone, letter or e-mail) and seek to gain permission t use their image/ piece. Once it is agreed that I am able to use the work via settlement of funds I can legally use the photographs.

W3C: The World Wide Web Consortium (W3C) is an international community that develops open standards to ensure the long-term growth of the Web. Abiding by this series of standards will allow the use of code and sound on websites without breaking any laws. They set the standard for what is allowed on websites.

http://www.w3.org/

LO2 Gantt Chart