Website Design and usability review

[william232]

Hey,all i have a website and i need you to tell me the following does the following match my Layout and the design & Usability of my Website?


Design takes into account eyeflow,fallow areas,right/left,top/bottom reading patterns
Design balanced
Design elements are consistent
Layout takes the targets browsers and screensizes into account which is only internet explorer
Elements of Layout are hierahical
Sufficient Contrast to provide easy eye scanning
Color of the Layout and elements on layout
Type size adds to harmoney of Layout and text readable


Does this website match any of those?

http://bcdesigns.pozter.info/Usablitytesting/BillMayersartgallary/

Anyone help me here? From what you think :)

[the tree]

Design takes into account eyeflow,fallow areas,right/left,top/bottom reading patternsNo, text is often just in one or two lines.
Design balancedNot especially, whitespace doesn't appear to be intentional.
Design elements are consistentNo, there does not appear to be any consistency with borders. Footer image disappears.
Layout takes the targets browsers and screensizes into account which is only internet explorerSeems to work in Internet Explorer okay, no account is taken for window-size. (It seems a bit odd too assume that your visitors are only going to be using that one browser).
Elements of Layout are hierahicalFor the most part, I guess.
Sufficient Contrast to provide easy eye scanningSufficient contrast yes, but there are many other aspects of graphology that have been ignored.
Color of the Layout and elements on layoutAnd by this you mean?
Type size adds to harmoney of Layout and text readableNo.
what you thinkYou would do well to run a spell check over your site, validate your code, check it in multiple browsers, and read up on modern web design.

[abz]

Is this for some kind of Human-Computer Interaction assignment?

You code is pretty tidy overall. I would cut out the image width and height specifications, and the <br/> tag(s) (should be <br /> anyway) and add the specs to the CSS. This will keep your design and your content seperate, so it is easier to update later.

To me (using firefox like any sane person should) all of the text is overlapping. I see what you want it to look like in IE,but in firefox, all the images are in the wrong place, your navigation is completely bizarrely placed. Your naviation is in a table. I dont really understand why. Try putting it as an unordered list, then styling it with CSS.

From a design and usability perspective. First thing I notice (now looking at what you want it to look like in IE) is it is all centred. It looks horrible. Having everything centred is one of the first pitfalls in design for sites looking 'ameteur'. The default borders around your images and navigation look sloppy - a lot of people know they are there by default, so it just looks like you have ignored them. the center and bottom cells have a border, which is then outlined again by another border - unecessarry clutter on the page.

It is not accessible in the slightest, seeing it how it is in firefox. If the type size is changed, the site layout shifts. It isn't fluid - when I resize my browser, i just get big scroll bars, rather than the site shifting to fit.

Your title and footer are images, meaning they wont be seen by search enguines, or screen readers.

your links dont have titles, and your images are missing alt tags. again, stopping search and screen readers from doing their job.

overall, its very blocky, and not very inventive. It also looks empty. I don't think it fulfills many of your criteria that you listed. You code is half decently structured though, so you should be able to play around with it fairly easily to see what other effects you can have.

Try looking at some fancy/popular/sucessful websites, and try to pick out why they look good to you. Then adapt that feature and use it in your design.

good luck

[william232]

I am more of a programmer than a designer.What do you mean my links do not have titles? Where can i find a screen reader from? i will remove the align to center of the page.

How can i make my Design/usability fix what i have listed above thanks for responding to my post thank you.

[abz]

I am more of a programmer than a designer.

me too. Because of the logic involved in practical and useable design interfaces, I can get by ok. I can make things work, and relatively easy to navigate, but they are never going to be overly stunning.

you add titles to your links via: <a href="yourURL" title="This link goes to X">

you add alt tags via:<img src="yourimgsrc" alt="A picture of my rabbit, bernard" />

Even if i had time, I would not sit here and design your site so that it fits your assingment criteria. If you can't do it, then ask your lecturer or boss or whoever the project is for, for advice.

If it helps, draw out the bits of your site that you want on bits of paper, then arrange them in lots of ways, to see what kind of looks you can get. Or, like i said before, look at sites that you think are good, and try to see why you think they are good, then use that as inspiration.

[william232]

Do you know of any websites that meets the requirements as i stated above?

[Kravvitz]

http://www.456bereastreet.com/ might fit that criteria.

[william232]

Hey,all i have a website and i need you to tell me the following does the following match my Layout and the design & Usability of my Website?

Design takes into account eyeflow,fallow areas,right/left,top/bottom reading patterns
Design balanced
Design elements are consistent
Layout takes the targets browsers and screensizes into account which is only internet explorer
Elements of Layout are hierahical
Sufficient Contrast to provide easy eye scanning
Color of the Layout and elements on layout
Type size adds to harmoney of Layout and text readable
Font Choices are approprate to website

Does this website match any of those?

http://bcdesigns.pozter.info/Usablitytesting/BillMayersartgallary

Anyone help me here? From what you think

[pcthug]

Moved to Website Reviews.

[william232]

Thank you :)

[Mania]

The layout breaks a little in Firefox (2.0), especially the navigation.

[sitehatchery]

Yeah, not working in firefox

[william232]

So are you saying it meets these requirements:

Design takes into account eyeflow,fallow areas,right/left,top/bottom reading patterns
Design balanced
Design elements are consistent
Layout takes the targets browsers and screensizes into account which is only internet explorer
Elements of Layout are hierahical
Sufficient Contrast to provide easy eye scanning
Color of the Layout and elements on layout
Type size adds to harmoney of Layout and text readable
Font Choices are approprate to website
?

[the tree]

No. I could swear I've already posted in this thread, is there a duplicate of it or something?

edit mwa ha! I was right! Original Thread (http://www.webdeveloper.com/forum/showthread.php?t=125424)

edit II of course, I do realise that it has changed since.

[william232]

Does it fit the Requirements above? now since i have done the updates to the site?

[the tree]

I would strongly recommend that you request for one of these two threads to be closed, for the sake of continuous and comprehendable exchange.

Now as it stands I think you would do well to remove all design elements from the page and begin using semantic markup. Then check your spelling and grammar then check it again and again and again.
Then add design (use CSS, not presentational markup) with care. And please check it in browsers other than IE, be realistic about your user base. Don't use such vibrant backgrounds and don't use a single image in your design unless it is of reasonable quality.
Use large sans-serif typefaces for legibility, and employ a much, much higher contrast (that's dark/light, not hot/cold) between text and background.

[TheBearMay]

Note: I merged the two threads that were going on this subject. - TheBearMay

[sitehatchery]

Gallery is spelled incorrectly.

http://dictionary.reference.com/browse/gallery

[summer2006]

hi...william....
sorry...i am not reply your message..
i am a new registered user for this forum. may i know how to post a new message in this forum??
thanksss.
i oso have question wan to ask all the experience frens.

[the tree]

May I know how to post a new message in this forum?You click on "new thread".

[summer2006]

thanks...i got it

[william232]

i have changed my website now and i would like ask you to tell me the following:

Design takes into account eyeflow,fallow areas,right/left,top/bottom reading patterns
Design balanced
Design elements are consistent
Layout takes the targets browsers and screensizes into account which is only internet explorer
Elements of Layout are hierahical
Sufficient Contrast to provide easy eye scanning
Color of the Layout and elements on layout
Type size adds to harmoney of Layout and text readable

Does this website match any of those?

http://www.bcdesigns.pozter.info/Usablitytesting/BillMayersartgallary/

[the tree]

Design takes into account eyeflow,fallow areas,right/left,top/bottom reading patternsNo, still bunched up in a corner.

Design balancedNo, title image (of horrific quality) has far to much precedence over text.
Design elements are consistentNo. Proportions vary from page to page. The colours of the footer text bear no relation to the colours on the rest of the page.
Layout takes the targets browsers and screensizes into account which is only internet explorerNo. There is no response to screen size at all. Assuming that Internet Explorer (which is spelled with title case) is to be your clients only browser is stupid.
Elements of Layout are [hierarchical]Code is too buggy to properly asses this.
Sufficient Contrast to provide easy eye scanningNo. White on bright purple is very far from sufficient contrast.
Color of the Layout and elements on layoutThe absence of a verb here make it impossible to use this bunch of words as a criterion.
Type size adds to [harmony] of Layout and text readableNo. The font-size is never defined.

Does this website match any of those?No. You've already been told this and made absolutely no changes in response to the feedback you've been given or responded to it directly in any other fashion. You relentlessly repeating yourself whilst ignoring what is being said to you can been taken as extremely rude.

[william232]

For a start it was meant to fit the screen resolution size of 800 by 600.
What Color do you think would be better for this website?
How is it too buggy?
What color should the footer then be?

No,i am not being rude.

[the tree]

For a start it was meant to fit the screen resolution size of 800 by 600.And it does, not particularly snugly or anything but it does fit.
What Color do you think would be better for this website?Black text on white background was just fine, the Purple/Green could be retained in borders or elsewhere, where they don't interfere with text.
How is it too buggy?Ask the experts (http://validator.w3.org/)
What color should the footer then be?Anything but a gradient, so long as it fits with the colour scheme of the page (there is yet to be one) then it will be sufficient.
No, I am not being rude.Of course, you announcing that you are "not being rude" makes all the rudeness just disappear into a cloud of retroactive honesty. But, in reality yes you are and you're lucky that very patient people frequent this forum.

[william232]

i am not too good with design. i am more of a programmer its not purpple is a greeny blue and pink.

[the tree]

You've said that, and to be honest being a competent programmer should at least aid you in creating a page with well structured markup.