Alt Tags

ALT tag

Definition

HTML tag that provides alternative text when non-textual elements, typically images, cannot be displayed.

Information

ALT Tags are commonly omitted from web pages, from the smallest personal pages to the largest web corporate sites. Yet, if properly used, ALT Tags can be quite useful. Among other things, ALT tags can:

* provide further detail for an image or the destination of a hyperlinked image.

* enable and enhance access for people with various disabilities.

* provide much-needed information for people who surf the Web with graphics turned off, and people who surf the Web with text-only browsers.

* assist in navigation when a graphics-intensive site is being viewed over a slow connection, enabling site visitors to make navigation choices before graphics are fully rendered.

http://www.marketingterms.com/dictionary/alt_tag/

web design website examples

Continuing with the Accessibility vs Design Blog i thought id have a look at some of the accessibility websites to look at how they get the balance between design and accessibility.

After looking at a number of different examples of different accessibility websites and they seem to prove what i already thought that design and accessibility doesn't seem to mix.

All of the websites I have found seem to have the same simple design examples of which are shown below:

Artifact Refresher

So its been the easter holidays and all everyone has been focusing on is the client project. Now thats all over and done with its time to get bak on with the gud old research project.

looking at the last one i did and the feedback i received from tutors and my peers i had the idea that i would look at design vs accessibility on the web. this however could lead to me opening a can of worms as they say as this is such a huge issue in the web world. this would be a very good issue to look into however i am unsure if it fits into the question

How effective are various accessibility methods and techniques used in WEB site design?

A Blog that maybe useful!

http://fortysevenmedia.com/blog/category/tutorials/

SPP3 Showreel Example

As part of our SPP£ module we have been given the task to create a showreel of our work, this is quite a difficult as a web designer to show our work effectivly within a showreel so i have had a look at some examples so this is one i really liked

Artifact 4 What I did

So as part of the final section of the research project we have created a number of artifacts, for my forth artifact i have looked at layout as part of the accessibility features i have been looking at as part of my research. for this i started by removing the table that was holding all of the content within my test site. this was a huge step to making my test site as accessibile as possible, as this allowed users with screen readers to view content instead of just reading the number of coloumns and rows in the table. this was a very successful step as i tested it using a screen reader to ensure that all of the content could be read. The next thing i did was to then look at different layouts and decide which was the most accessible i decided that the most accessible layout would be the most accessible layout for my test site. after looking at different accessiblity tips regarding layout i decided to put all of the important content within my site to the top then the lesser important content at the bottom. this would ensure that the important information can be access first when entering the site.

Golden Rules Accessibility vs Design

1. Accessibility is no longer optional.
There’s been plenty written on the motivations for accessibility. I won’t repeat it here. If you want to be taken seriously on the web, you must address basic accessibility issues first.

2. Visual design is no longer optional.
If you want to be taken seriously on the web, your site can’t look like it was made in 1996.

3. Accessibility cannot be absolutely measured.
Sure there’s Section 508 and WCAG and (insert accessibility standard/law here), but these are not measures of accessibility. They also are not written by the finger of god as the binding law of humanity. While in some rare cases, laws actually do apply to actual web sites and vaguely define what accessibility is, most of the time we will all be better served if we treat discrimination laws and accessibility guidelines primarily as tools in helping us determine how to best implement accessibility.

4. Accessibility is a continuum.
High levels of accessibility are possible without great amounts of effort, but there is ALWAYS more that can be done. Your site can ALWAYS be more accessible. Users and accessibility advocates should applaud designers that are providing accessibility, if not perfectly, rather than lambasting them for not doing everything they can do to implement every accessibility feature and gadget they believe is necessary. So, the key is for designers to determine what should and can be reasonably done and for accessibiliters to determine what should and can be reasonably expected of designers.

5. Accessibility and design have the same business goal.
It is the goal of each of us to make it so that the user experience with our sites is not less enjoyable than their experience on the sites of our competitors. We can work together toward that mutual goal.

http://webaim.org/blog/access_vs_design/

Artifact 3 What I did

For my 3rd artifact i looked at another accessibilty feature which was font for this i created a number of sample sites with different fonts and text sizes to then find out which is the most accessible and most readable. i also looked for simple tips on how to make text the most accessible and readable onscreen. for this artifact i also looked at different browsers to look at there accessibility features in order to get a better feel of what accessibilty features are out there to enlarge and decrease text size for people with sight difficulties. i also tested and looked into an number of different fonts inorder to find the best one for web accessiblity.

Twit twoo!!!

I've known about twitter for a while after a friend joined it and mentioned it to me since then it has exploded into the media spotlight so much so celebrates are joining it and mentioning it on all of the tv programs and news. so i have decided to join and write bout how it works and what i think. It was really easy to join just 4 or 5 simple questions including name, email address, username and password then a security question. it was really easy to use and i was impressed that the text and text boxes were really big even to start with without even having to enlarge the text so so far im a happy girl from an accessibility point of view. then im in so i added a few people to "follow", i think this is where the issues start for me i feel like a stalker. i mean the only people who i am following at the moment is my mate ben my cousin who has a slight obsession with gorge sampson and someone from galaxy who i heard on the radio mention it and altho they may have very interesting lives i just dont feel i need to know what they are doing all the time, however i do like the fact that you can have pics on it to bak up what you are doin, that makes it a little more friendly in my eyes. anyways we will see how it goes...

Client Project Update

As with any job dealing with the general public there was been many ups and downs with my client project and we are only at the beginning. these issues have not been to do with mine and hannahs relationship as i have always tried to keep things at a very professional level however things were becoming a little difficult. Due to lack of organisation hannah was missing meeting and had a lack of input into the project for a while. we have however seemed to have solved these issues as i have learnt to be a little more organised and forward in order to get what i need from hannah. i now have most of the images and work from hannah that i required in order to make a good start on hannahs website.

Enlarging Text Accessibility Features

Text Enlarging is one of the main accessibility features when looking at websites. as websites such as bbc news etc are becoming more and more popular and the world of books is being taken over by the world of media and the internet, people are taking much more time to read online material. however there is still alot of inaccessiblity issues with text size so have looked at what is out there to help and this is what i have found:

Within Interent Explorer they have a simple drop down menu that enables the user to use a simple drop down menu in order to change the size of the text to make it easier to read.


To my surprise i could not find any such feature within Firefox. this surprises me as i expected it to be the other way around. i was expecting firefox to have a add-on or plugin to help with this issue

Tips for web design - Font

Use only fonts that are likely to be installed on your visitors computers and consider the differences between Windows and Mac users fonts.
Use Sans-serif fonts for higher readability on screen.
Use Serif fonts for higher readability on printed paper and/or for page headings.
Use font families to specify an ideal, alternative, common and generic font typeface.
Use monospaced fontfaces to display computer code.
As a general guideline use a maximum of three different fonts on the one webpage. Too many fonts can be confusing and make all harder to read.

http://www.web-energy.co.uk/best-fonts-for-accessibility-and-readability.aspx

Artifact 2 What I Found Out

Looking at my test site now i can see such a difference already, i always knew that colour was very important but i always thought it was something you could play around and have fun with and from this second artifact i have no realised how important is it. the colour of a site is the first thing people see when entering a website so if it inaccessible they will not stay within ur site for long. so you have to think carefully when choosing colour as you mite like a pink site wiv green spots but most people dont and if you want them to visit your site you have to think of them when choosing accessible colour. i also learnt that colour also has an effect on the way that users can navigate your site. if the pages are all of the same colour then the user knows that they are withing the same site as they navigate the site, if your pages are different colours then the users can feel lost or like they are going in and out of your website.

Artifact 2 What I Did

For my second artifact i made my test website a little bit more accessible by changing the colours. the first thing i did was to look which colours were the inaccessible for users with sight impairments and colourblindness. i found that people who are colourblind can see slight colour as they can see certain tones and colours. For red they can see a light shade of blue and for green they can see a bright shade of yellow. so keeping this in mind i decided to keep the colours to a minimum and used red to highlight the important areas such as links and buttons as although they cannot see the actual colour red they can see enough difference to distinguish the difference between that and the rest of the text. i also looked at the colour of the text as i found that it was one of the accessibility requirements within the web standards, (this is shown in one of my previous post). i also noticed this was an issue after taking a screenshot of my test site and taking all of the colour away i soon realised that you could not read the text at all. this is shown in the images below.

This is the original test site


This is what users who cannot see colour could see when viewing my original test website


so from looking at all of the issues I've mentioned above i decided that i would use and off white background black text and red for the links and buttons. i decided on this as it would therefore be accessible for everyone including users without visual impairments and difficulties. the off white and black would be easier as white and black can be a bit difficult to look at for long periods of time so by using an off white colour solves this issue



the image below shows the improved test site when the colour is removed


as you can see there is a significant different and the improved site is much more accessible.

Artifact 2

So ive now looked at colour then next accessibility feature i am going to look at is text. im going to look at the features that already exist including browser features that allow you to enlarge the text on a website. i will also look into makin my own accessibility feature within my test site. i will also look at which fonts are most accessible online both for mac and pc

Useful Quote For Evaluation Artifact 2

Ensure that foreground and background color combinations provide sufficient contrast when viewed by someone having color deficits or when viewed on a black and white screen. [Priority 2 for images, Priority 3 for text].
http://www.w3.org/TR/WCAG10-CSS-TECHS/#ref-LIGHTHOUSE

Artifact 2

For my next artifact im going to change the colour of my website in order to make it more accessible, for this i will look at the different colour that effect people with sight difficulties and impairments. i will also look at good contrasts of colour for things such as background colour, text and links. i will then make a number of different examples of colour schemes then test them to see which one people find easiest to see and use, then i will evaluate the findings.

Colour Blind Add on/Plugin

For my next Artifact i am looking at colour and how it has an effect on Accessibility. to do this i have found a firefox plugin

This plugin is called ColourBlind Ext. This is a feature made by firefox for web developers to enable them to build a accessible website for people that are colour blind. this add on enables web develops to see what people with sight impairments see and therefore addapt there websites accordingly. this is a really good idea as it is sometimes easy to get carried away when using colour within a website. this add on has an number of different features that accommodate to every different kind of colourblindness such as Protanopia, Duteranopia, Tritanopia and Rod monochromacy.

onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://3.bp.blogspot.com/_fXjBvMhg054/SYwC_HE0s3I/AAAAAAAAALU/U-_-Gb3SyT4/s1600-h/firefoxaddon.jpg">

Artifact 1

The second part of our research project is Practice based research there fore we have to create a number of artifacts in order to test and evaluate them. My research project is based on Accessibility. therefore for my first artifact i wanted to create a site that was totally unaccessible. i started by looking at the Accessibility requirements i figured if i got an idea of the requirements then i could do the opersite in order to create an unaccessible website.

so this is what i did
- Used a table
- Used lots of content and lots of options within the same page
-Used lots of different focus points on the same page
- Used lots of unnecessary images and graphics
- Added lots of Links and Rollovers
- Used very small text
- Used small text for headings
- Used brightly coloured text such as red on white, orange, blue and green
- No "image tag" descriptions on images
- No contrast between text colour and background colours e.g medium blue text on a light blue background
- Added flash

Doing all of these things enabled me to create what looked like the worst website in the world. i got to the stage when i couldn't even look at it. But it had the desired affect and will be a perfect example to test the rest of my artifacts against.

Simulated Client Project-Feedback

so the Simulated client project is over and on a whole i think it was ok the feedback i got from my tutor was kind of what i i expected he liked the fun feel of my site but he thought it would be better as a game. this i agreed with as i was trying to make the site as fun as possible to keep the audience engaged. as i noted in the proposal i would have liked to do a sgame i beleive it is the best way to keep an audience of that age range engaged. so overall i think it went well but there is always room for improvement.

Practise Based Research

For the next part of our research module we have a practise based section that we have to create a number of artifacts, in order to gain knowledge and a deeper understand of the the subject area that we have chosen, we had to answer the questions below

Please state the ‘question’ that the ‘research via practise’ (terms 2 and 3) will try to answer or explore?

How effective are various accessibility methods and techniques used in WEB site design?

(b) What type of artefacts/experiments that will be produced/conducted (e.g. short video clips, short animation sequences, building visualisation, audio listening tests with focus groups e.t.c.)? Note it is accepted that this may change as the research progresses past the first few artefacts.

I will create 5 small websites each exploring a different area of accessibility e.g colours, links, text size and multimedia. I will create a focus group containing a mixture of able bodied and people with different disabilities and impairments.

(c) Have you checked that the research meets the university ethical guidlines and will not require approval (if NOT checked or it requires approval then state the date on which you expect to obtain approval)? IF UNSURE WHAT THIS MEANS TALK TO YOUR SUPERVISOR!

Yes, although I will be asking people with disabilities for there opinion I will ensure that it meets the ethical guidelines. This means I will ensure that I do not ask children under 18 or people over 65.


(d) Have you checked that appropriate resources and facilities exist for you to produce/conduct the artefacts/experiments (If NO then explain how you will obtain the required appropriate resources and facilities)?

Yes all of the facilities are available for me to create my websites. I will use dreamweaver to create all of my artefacts which is available to me at home and at uni.

(e) How will you evaluate and/or reflect on the artefacts/experiments produced/conducted in (b) above (e.g. reflection, survey, focus group, statistical analysis e.t.c.)?

For each one of my artefacts I will write a 300 word reflection of of the artefact itself and how I think it can be used in order to answer the question. I will also use a focus group to gain statistical data, then analysis it.

(f) Please write down below the preparatory work you will do for the first artefact over the Christmas period:

I will read more what I have to do to meet all of the accessibility guidelines, for example I will look on what colours work best for people with sight impairments and what text size e.t.c. I will also begin designing my non-accessible site as this is the starting point of my research.


(g) What is the detail of the first artefact that will be demonstrated to the supervisor?

My first artefact will be a website that has limited or no accessibility. Although it will be a very simple site it will not meet any of accessibility guidelines or requirements. This will then be reflected on and compared with the next 5 websites to check ease of use and look at how it is inaccessible for disabled user. I will also people can use and navigate the non accessible website compared to the accessible one.

(h) On what date will the first artefact be shown to the supervisor? Please remember that on this date you will also provide a short 300 word evaluation and/or reflection summary as well as the actual artefact.

I will be presenting my first artefact along with the 300 evaluation on Thursday 29th of Jan 09

(i) How will you present the research conclusions from the artefacts/experiments and evaluations during week 43 (e.g. written document, slides and/or documentary film)? PLEASE NOTE THAT THE RESEARCH CONCLUSIONS MUST BE IN A FORM THAT CAN BE HANDED IN IMMEDIATELY AFTER THE PRESENTATION i.e. a permanent record of your conclusions and arguments needs to be submitted immediately after the presentation in week 43.

For my research conclusions I will be presenting a written document. This will contain all of my findings and conclusions of all of the artefacts and how they helped answer the question I set to explore.


(j) On what date will you be presenting your draft research conclusions to the supervisor for review (it is suggested 2 weeks before week 43 presentations)?

I will be presenting my first draft of conclusions Week 41 Thursday 7th May 2009

Catalogue Entries

As part of our SPP3 module this year we have to had in 6 images to the entered into the catalogue at the end of year exhibition these are the images i have chose and why.

In this report I will look at the images I have chosen for the catalogue entry and how they reflect on me as a multimedia practitioner. I have chosen 8 images to enter ino the final year catalogue that will be given out within the exhibition. So these images are very important to show my skills as a practitioner. In this report I will write about why I have chose the images that I have and where I think my work reflects on me as a practitioner. I will also think about where I think my work will position me as web practitioner.
The first image I'm going to add to the catalogue is my flash banner that I did in the second year. I have chose this image as I think it shows my skills in the latest version of flash and ActionScript. I think it also shows my design and marketing skills which I think will help me when trying to get into the multimedia industry.

The second image I have chosen is my other flash banner that I did in the second year. I have chose this image as I think it shows my skills in the latest version of flash and ActionScript. I think it also shows my design and marketing skills which I think will help me when trying to get into the multimedia industry.

The third image I have chosen to add to the catalogue is an image of a page that is part of my social network project. For this I created a website called Date My Mate. This is the registration page, this page allows the user to enter data into the site then into a database. I have chose this image as I think it shows my skills in PHP and MySQL. It also shows I have design skills and I think these skills will put me in a good position as a web practitioner.

I have also chose the an image of the profile page from the date my mate website for the catalogue. This page would display the text from the database and display them using html. Again this will show my skills in PHP, MySQL and html. Also I think it shows my design and creative techniques. I have chose this I think its a good way in which for potential clients and employers to see my skills.

Another piece of work I have chose for the catalogue is a piece of group work we did. I have chose this as it again as it shows my skills in flash and php. For this piece of work we worked in groups and had to create a flash application with php that was then viewed in html. Which again shows all of my skills in this area.

Lastly I have chose to add an image of my portfolio, Pixl Dust I have chose this image to show mainly my design and CSS skills. I think this is one of my best pieces of work at the moment and its a really good piece of work to show off my design flare as I was set free on this to just do what ever I liked so it shows a little bit of my personality too. I think this is my best piece of work so far and if I had to choose one piece of work to show the most it would be this one.


Looking at all of the images I think my position as a multimedia practitioner is still at a junior level. Although my work shows that I have learnt a lot over the last few years I dont think that my work is at a high enough level in order to enter at a higher position as a multimedia pactitioner however thoughout this year I am hoping to create a higher standard of work that would show my more potential to be a successful multimedia practitioner.

Online Shopping Basket Research

For my live client project my client requires a website that she can sell her illustrations and fashoins. this is a big thing fro me but i am willing to take on the challenge. firstly i thought i would have to create a shopping basket myself but iafter asking the boys and my tutors i soon realised that this would not only be project that is far tooo big for the time period that i have also that it could be alot more dnegerous than i thought so both the boys and the tutors informed me that i could find simple shopping basket software online either for free or for a small fee so i thought id look into this further than i can explain to my client with knowledgeable and clear advise on how these things work.

the first one i found that i liked the look of was the Boss Cart JVS Series. this is a uk based company and offers a free shopping basket service.

how it works
it is shopping basket software containing php and using a msql database
there are 3 files for you to download or you can enter a link into your webpage

features
Template driven for easy customisation
Search engine friendly pages
Search engine friendly images
Support raw flash movies as images
Built in CRM system
Upload multiple products at the same time
No limit to number of items you can sell
Easy to set up
Integrates with all UK payment provider gateways
Money off web hosting from leading hosting companies
Free technical support

advantages and disadvantages
it seems pretty simple but because it is free there are no garantees that it will work but its worth a try
i think you would have to have alot of experience with php and mysql in order to use this one.



this company also offer another servise that is not free
this is called Cart Boss Premieum and it is £110

i think it works like the other but it is alot more helpful

features
Quick and easy to set up.
Powerful catalogue manager, manages over 10,000 products.
Create your store look-and-feel or use one of our pre-designed templates.
Integrate your online store with a payment gateway of your choice.
Host your shop with the web hosting company of your choice.
Extensive marketing and merchandising features, including social networking/marketing plug-in.
Bulk product upload to make populating your store with products easy.
Export your products to Google base.
Easy order management.
Multiple language support.
Multiple currency support.

Additional features
Drag and drop interface for quick access to products and product attributes.
Extended product image upload, add additional seven images per product.
Define header and footer for each product category and sub category.
Crate links to external URLs.
Specify shipping and weight for each product.
Import data to or export data from Boss Cart in CSV format.
Automatic email confirmation of orders.
Powerful product search feature.
Built in Contents Management System (CMS).

advantages and disadvantages
theres is alot more design and layour flexiblity with this package compared to the other one.
it seems alot more secure and proffessial
alot more easy to use and update
the main disadvantage is the cost

The Story So Far (client project)

we are a good few weeks into the live client project now so i thought id rite a blog in order to show how i think its going so far.

So far its been full of ups and downs, as working with a client will be

From not turning up to meetings and not produsing her side of the bargin i think ive had it all so far and the hard work hasnt even started yet but hopefully we will get there in the end and i will produce a good piece of work in order to get a good peice of work out of it at the end

Live Client Project

For the live client part of our assessment this year we have to work with a live client in order to create a professional piece of work as well as getting experience of working with a live client and all of the ups and down that can bring.

My client is an artist illustrator Hannah Morrison. i approached hannah through an another artist that has a small shop down the road. Soon after i arranged a meeting with hannah to discuss what she required and how i could help her solve her problems using multimedia.

she requires
- A website
- Displaying her work
- Displaying her fashion work and illustrations
- Infomation about her and contact details
- Facilities to sell her work
- She site needs to be easy for her to update
- She also would like to be able to put her own stamp on it

we also discussed some of the design that she would like and the feel of the website, we discussed that she would like each section of her site to be represented with an image for example her logo would represent the about me section of her site in the same way that the one of her illustration images would represent the her illustation section of the site.