Personal Research Project - My Web Accessibility Test

Over the christmas period, I created an accessible website using my short client project. I provided one site with more images and colour. The non html website having a basic layout with minimal colour and images.

Displaying HTML

The screenshot displaying below is the non accessible page for the disabled users.
I created a link at the top page "Click here for no html", so that the disabled are able to view the website with no html. I have chosen to experiment on colour and layout to see if it's easier to read for disabled users to look at.

Displaying Minimal Html

This is the other website displaying minimal html coding, I made sure that there is less usage of colours. I included hardly any images and I've changed the layout by aligning everything to the left.

I provided a font size change button which is displayed at the top of the non html website. Users are able to select a font size from small to extra large, the whole of the text on the web page will automatically change. I made sure every image had an alt tag.

Live Project - Project Requirements

I agreed and signed a form with a client from Leicester called Bachmann Europe Plc, to help redesign their website http://www.bachmannjunior.co.uk/junior/. Seeing as the activities section on their website is still unfinished, I will help to design interactive games such as colouring activities for different ages. More games are still to be considered.

I will use Adobe Photoshop, Macromedia Flash, CSS and HTML to design the product.

Short Client Project - My Final Web Site Design

This is the finished product for my website that I have built for the past couple of weeks. In my proposal, I mentioned that I will keep the colours consistent and which i have throughout all of the web pages. I tried not to overcrowd my website with images, as it will look unprofessional. I've taken important parts of information from existing sites about malaria. I included the malaria interactive map and placed it in the hotspot page. The links that are activated are: "Home, Malaria facts, Hotspots, Travel Guide and Insect Repellent". Each of these pages have different sources of information about malaria. I've tested and checked if every link on the website works, I've also tested the website on different browsers such as internet explorer and firefox.

I have taken a screen shot of the home page, all of the pages are kept the same.

Top half of the website

Bottom Half of the website

As you can see I've included the malaria interactive map in the "Hotspot" page...

Short Client Project - Malaria map

Using macromedia flash, I created this interactive malaria map so that users will know which country has the high risks of malaria. I will place this map on one of the links on my website.


You can hover over the map to see which areas have the risks.

This is a screen shot of the map when the mouse is not hovered over.



This is a screenshot of when the mouse is hovering over "africa". The mouse can be hovered over the other selected countries, information will appear in the grey box, just like the screenshot below

Short Client Project - Top banner for web site

I created this top banner for my website, which includes my finished logo and insects drinking the blood. The words are animated using macromedia flash, it fades in and fades out.

Short Client Project - the final web banner design

I used Macromedia flash to create this animated web banner. I included more actions to the story such as the bug gradually becoming fat as he drinks the blood and i've included more text at the end to finish off with the story. Although I had problems including sound to the banner. I must say, creating this web banner was the best part of this project.


Below shows a storyboard of the insect repellent web banner.


1) The insect is walking on the skin


2) Insect begins to find a spot to suck the blood


3) Insect turns around...


4) The insect makes itself confortable...


5) The insect digs his way in to the skin and begins to suck the blood...


6) He carries on sucking the bloog and gradually becomes fat...







7) The insect has finished the meal and looks up...


8) It turns around and walks off the opposite direction...


9) Insect carries on walking but struggles to walk....



10) The skin gradually becomes infected...


11) Text zooms in from centre "Are you Travelling Abroad?" and fades out...


12) Second text zooms in from centre again "Don't let malaria ruin your holiday" and fades out...


13)Third text zooms in "Remember your repellent" then fades out

14) Fourth text zooms in and once you have clicked on the link, you are directed straight to the website.

Short Client Project - The final logo design

This is my final design for the logo that I have created using Adobe Photoshop. I made some changes to my previous sketched logo's as i wasn't too happy with them. The sketched logos that I drawn were too over crowded, therefore I kept this simple and tidy. The colours that i said i was going to use in my plan are still kept the same, yellow and black.

Personal Research Project - My Research Question

For this Personal Research Project, I was particularly interested in the area of web design and my ideas were focused on how web sites are design today for the disabled. Are they accessible for the disabled? I plan to investigate whether the disabled today are still being affected by lack of accessibility to the web and should rules be put in place that is applicable to all Websites? I will choose a well known website and research into detail what are the accessibility barriers that are preventing disabled people from using the website. I have chosen to research upon this topic as many web designers are forgetting to follow the guidelines of designing a simple standard Web Accessibility Web site.


My research question: Are the disabled being affected by the lack of accessibility to the web and should rules be put in place that is applicable to all Websites.

The first artefact that I will produce is a bad example of a non accessible website and a good example of a website. I will have this evaluated by a user or use an analysing web accessibility tool to check the two websites to see if it is accessible or not.

Short Client Project - logo, web banner, microsite ideas

The purpose of my website is to inform people potential “DANGERS” of insect bites, the kind of diseases that they can catch and how they can avoid it. I wanted a hard hit danger symbol that people can recognise when they see it.

Below is a danger/hazard sign template which is recognised by most people. I can use this template to symbolise the dangers of Insect Transmitted Diseases but have a black sillhouette of a bug inside the triangle and place a title on the right hand side or below.

Logo Sketches

Here is a rough sketch of how my logo could possibly look. There could be changes when I make the final design using Photoshop. It could work effectively because the purpose is to send the message out to tourists about the DANGER’s of insect bites. I asked a number of people to evaluate my logo and they immediately recognised the DANGER symbol and they agreed that this is an effective way to communicate the message.

Web banner Sketches - Story Board

My Standard web banner size will be 468 x 60 (changes could be made later)

1) Here shows a bug > walking on a skin.

2) The bug is drilling a hole into the skin.

3) It’s half way into the skin.

4) Bug has finished drilling. Diseased has been transmitted. The bug walks off.

5) Disease begins to spread.

6)The disease spreads even more.

My Microsite Ideas

I will use CSS and HTML to produce the final outcome of my microsite. For the template, the colours I will use are yellow and black. Which is the original colours from the hazard sign logo. But I will also include the red colour to symbolize the dangers of death. These colours will be part of the brand identity and used consistently throughout my website.
I will use Adobe Photoshop to create images, such as my web banner sketches. Macromedia Flash will help me activate the actual web banner, this will then be linked to the microsite.

Starting my Short Client Project - my ideas

Why I chose the Web Category


I’m particularly interested in the area of web design and I believe selecting this category will help me to develop my knowledge in web design further a field. Therefore for this Short Client Project, I will be creating a flashy web banner and a microsite based on the theme ‘Insect Repellent’. Many people would search the internet for information as it is the most efficient way, rather than going through the library or searching for the relevant leaflets.

My Chosen Campaign

My choice is to work on the charity campaign. In my microsite/website, there will be information on the DANGERS and High Risks of insect transmitted diseases that tourists are not aware of when they travel abroad. I will explain how Insect Repellent spray can save them from Malaria and other insect borne diseases.


My Inspiration

“Jungle Formula” was my first inspiration to my ideas. Their slogan “the product you have been itching for” and logo is very catchy and memorable. It immediately catches audience attention. The information that they have provided on their website, is very informative and helpful. It warns tourists the potential dangers of fatal diseases. By simply using Insect Repellent spray, they can reduce the risks of any type of diseases.