Web Design

In this Digital Media Tools lecture, we looked more in to web design and the do's and don't's of making a website. This is all in aid of the websites that we are going to be making very soon.
The content has to be functional and accessible. There needs to be structure (left to right/top to bottom). The side should show you as a person, through the design and layout. Here is a basic web page anatomy:

1. Containing block
2. Branding/title
3. Navigation
4. Content
5. Footer
6. White space

HTML delivers layout instructions, the tags in HTML are now more complex. Able to make sites individualistic. Too much blank space is not necessarily good, you need to be able to balance it out. You shouldn't use sound on a site as it can be very tacky. Also, no wordy statements because this will make the consumer bored. You should always be thinking about the clients and the audiences expectations. The structure and navigation should be personal and able to show how you perceive these.

• Clear navigation links
• Use of space and gutters
• Feedback (mouse roll over, etc)

The user needs to know where they are, where they can go and how to get back (you can do this through visual feedback). Links should change when the mouse is over then and stay this way when on the page. Feedback can be given through movement and change (colour, etc.)

A horizontal menu bar is always better but if you want to use anything different you need to justify why you are doing so.

Symbols can be used as visual metaphors for menu options. (film reel instead of the word 'films'). These can help with language barriers. Metaphors can also be used to create a clever first impression. A metaphor that I could use could be something to do with my organisational skills and qualities.

Here is a list of the main rules that we have learned so far:

1.  Don't make the user think
2. Manage to focus attention
3. Make use of effective writing
4. Strive for simplicity
5. Don't be afraid of white space
6. Conventions can be good
7. Test early and test often

The use of neutral backgrounds and black text is okay but black on white is best. You should take the time to see what is out there.

I intend to make mock up Photoshop pieces with layers, guidelines and showing visual feedbacks (using JPEGs).

I took the advice and decided to look up what I liked in other peoples websites; here is a list of sites that I thought were very well presented and had some good ideas that I could take from:

captaindash.com

castirondesign.com

abutler.net

scoutmob.com

mcmillerssweetsemporium.co.uk

studioairport.nl

alwaysreadthemanual.com

Again, I am looking forward to the development on my website!

Speak soon!

Image credit: www.co-bw.com