For a school assignment I have to create a website with high usability rate. I had to make it about Jonny Imerman, this is a guy that helps cancer patients.

 

What do you think of the overal usability?

and also is there enough information on the homepage to let a user continue?

What do you think of the layout of some of the pages?
And do the facebook and twitter logos in the help now page look professional enough?

 

I would appreciate some feedback!

 

Thanks

https://sites.google.com/site/jonnyimermanhero/home

Some good stuff in there content-wise. I think the best thing would be to contain your elements since you essentially have a fixed width site.

body {
max-width: 1024px;
}

Is there a reason you are using XHTML 1.0 Transitional and table layout? Tables are generally frowned upon these days if not for tabular data. I'm guessing this is a result of a Google sites template?

For the search box at the top right it needs some sort of margin between the search box and the writing below.

Mantis, Good to hear it looks okay content wise. Unfortunately the layout is indeed like this because of the google sites template we chose and unfortunatly we have to work with sites.google.

 

SeikoShadow, The total header is an image and I can't move the search box, But I decreased and moved the text a bit lower so it does not fall behind the search box.

Thanks for the tip!

If your assignment doesn't call for a google site specifically, and you're willing to put in some work learning to code proficiently I'd definitely suggest learning HTML and CSS so that you can code a website yourself. The freedom it gives could easily make the difference between a pass or a fail.

 

Also I'm not sure how much you can edit it as I've not used a Google site but i have some recommendations.

• Increase line-height so that content is easier to read (25px or over worked from what I could see)
• Increasing the contrast between elements will have the effect of increasing usability, so for example rather than changing the background colour of links when you hover over, I'd personally suggest changing the colour of the link itself.
• I'd also suggest styling the navigation in such a way that it stands out, whether you simply increase font-size or change the design aspects of it is a personal choice

Just a few suggestions but hopefully you get something out of them.

Edited December 13, 201312 yr by SeikoShadow

SeikoShadow, Well unfortunately my assignment specifically calls for us to use a sites.google domain. I am currently learning myself HTML with help of youtube videos though. My plan is to start creating informative websites for small companies, without too much css and php use. For this I will try working with Adobe Dreamweaver. To correct my code a bit and assist me in coding as I am just starting with it.

I like the color scheme that you have chosen, it has a very soothing feel to it. Which seems appropriate for the content. A couple of comments I would make are:

 

The left nav bar seems lost on the home page. When I was reading the page, I at first didn't see where I could move on to new pages. I am not sure if there would be a way that you could make it more noticable?

 

Second, the page "Help Now" does not look like the other pages. The other pages fill the screen and are easy to read. The help now page is all condenced and feels like it needs more content.

 

I am by no means a web design expert, so take my thoughts for what they are. I try to look at a site as a vistor and not a designer. Hope it helps.

 

Unfortunately the layout is indeed like this because of the google sites template we chose and unfortunatly we have to work with sites.google.

 

I see. You can still use CSS to style the existing elements. It would be a good way to learn or improve your CSS. I would suggest adding some padding and perhaps a white background to the divs in the main content area for starters.

 

 

My plan is to start creating informative websites for small companies, without too much css and php use. For this I will try working with Adobe Dreamweaver.

 

You might be able to avoid PHP for a while but not CSS. Its pretty much indispensable if you want to work in this field.

Edited December 13, 201312 yr by mantis

BrandableWeb, Thanks for the tips! I moved the menu under the header, so they are horizontally alligned and I am going to create a banner that I can put on the Help now and cancer facts page as they both have empty space on the right hand side. This banner should then direct visitors to other parts of the website.

 

Mantis, I will try to start up with CSS as soon as I improved my HTML. Do you by any chance know a good video or tutorial that can explain me the CSS basics?

Thanks!, more tips are always welcome.

one quick thing: typo on front page - should be "its" in "its devastating power"

 

Mantis, I will try to start up with CSS as soon as I improved my HTML. Do you by any chance know a good video or tutorial that can explain me the CSS basics?

 

There are probably millions of them out there by now. I started off following CSS Tricks and although the early ones are probably a bit out of date by now they are free and good. I think if I had to do it over again I would go through Treehouse or lynda.com. They're not free but they're not too expensive either and they're probably worth the time and energy you would spend looking for free stuff. You can actually learn HTML and CSS almost simultaneously.

one quick thing: typo on front page - should be "its" in "its devastating power"

Changed the typo, Thanks!

 

Thanks Mantis I will look into CSS!