Please critique London Sound website

They have: 6 posts

Joined: Aug 2009

Hello, this is a hobby website I do about sound recordings called London Sound Survey.

There's various subsections in it like Sound actions, Sound maps, London wildlife and so on.

Would be very grateful for any feedback. Someone tells me some of the pages don't come out right when viewing them using the latest Firefox version on a Mac, wonder what's causing that.

greg's picture

He has: 1,581 posts

Joined: Nov 2005

Your container div is 768px wide, which allows for 800px resolutions. There are only a handful of people using 800px resolution now so will be familiar with sites having a horizontal scroll, so you can make use of a few hundred pixels more on the width.
Around 980px wide is considered ok these days, and caters for 1024 resolution users.

This will allow you to have a bit of space between the left and right areas and the pages in general, as currently some things are just a little too squashed.

Having A D M I N [ a t ] S O U N D S U R V E Y . O R G . U K as your contact reference is not too good.
It should be a link to your email really, but I understand your concerns about spam, so a contact form with a captcha is better, and more professional.

The text is a little small. It would be improved a great deal even if you just give the main text at the top of each page a little more room to breathe.
As you have very little text at the top of each page, you could probably stretch to 16px (1em).

The navigation menu could do with being a touch larger too I think.
This would mean having to re-do all your images or, better yet, you can do the same without images.
Just have the red-pinky-orange background as normal, then on hover make the background yellow.

The general appearance is fine. Things can be found easily with the top navigation and all are logically labelled.

But you should make the entire thing wider and then that also makes the larger text size I suggested fit nicer too.
Take a look at the screenshot I attached, the huge spaces at the sides is what I and other people with above 1024 resolutions will see.

They have: 6 posts

Joined: Aug 2009

Thanks for taking the time for your response greg.

Yes, it would be an improvement to make the pages wider. I'd had a feeling along those lines but was shying away from it. As for a contact form, excellent idea.

greg's picture

He has: 1,581 posts

Joined: Nov 2005

Yes, as most of your content is set to 768px you'd have to change the images to accommodate the new width.

Alternatively, you could just align them centrally in the new widths. Such as the top image "London sound survey" could just be aligned in the centre of the new width and give it a background colour - probably the yellow would look fine.

Incidentally as a note, when you don't specify a width on a div it will stretch the full width of the space available.

So if you have a container div of say 768px, and put an inner div in that, by default the inner div will just stretch to 768px too (the space available).
Obviously margins, padding, borders etc can change this slightly,

I mention this as you specifically mark some of your inner divs (like header) in your container div with the same width as the container div, which is not necessary in your current scenario as all divs are set to the same as their outer containers.

It's not an issue really, just a note as it might help you in this scenario changing the overall width.
For example, if you change the overall width to 968px, you can just set left and right margins to auto on your "header1" and "header2" divs, then add a yellow background colour and that is the header sorted.
Or perhaps that pinky-orange background colour to the nav (header2).

Megan's picture

She has: 11,421 posts

Joined: Jun 1999

I actually like the narrower width on here - leaves lots of room for the background. If you do widen it, make sure that background still shows at 1024.

This is a nice, edgy looking design - very appropriate for the topic. I like the colour scheme and the header graphic is good too.

A few suggestions:

  • The blue links seem really out of place in the content area. Try changing those to orange. That blue doesn't seem to go with the rest of the colour scheme.
  • The content layout is very grey, and the white text on lighter grey might be hard to read for some people.
  • Try getting rid of some of the borders, so it looks less boxy.
  • When you get to teh actual sounds, it's a bit weird that the information shows up on the right side. It would be good if you could get this to slide down below the table listing. NOt sure how that would work inside a table though...
  • The text is a little bit on the small side for me. If you widened the layout it would be possible to enlarge that a bit.
  • Using "direct link" to point to the download is not very straightforward. Just using "download" might be better.

Good job overall!

They have: 6 posts

Joined: Aug 2009

I'd really like to thank both you for a crop of excellent suggestions.

Some in particular had me slapping my forehead and thinking "That's so obvious, why didn't I do that?"

I've done a mockup of the home page set to a wider width and bigger text size:

http://www.soundsurvey.org.uk/index.php/survey/z_index

It should look okay in Firefox and IE7, but not IE6 yet (needs a separate style sheet). Some further tweaking is needed, eg the banner needs to be rendered again for the new size so it's nice and crisp-looking (the letter shapes and outlines were made in a 3D modelling program, much better control over splines/paths).

The bigger format is definitely more appealing imo, so will set about altering all site pages accordingly. The audio player can be made wider as well, but I'll have to leave that until everything else is finished first.

Once again, many thanks!

They have: 6 posts

Joined: Sep 2009

I like this site. Seems to be pretty useful and I like how avery thing is very clear. I have a 22" monitor stuck on my wall at the back of my desk and im getting sick of having to lean forward to see content. not with your site.. well done nice work

They have: 20 posts

Joined: Oct 2009

Awesome job, and great idea for a website! I love the logo. Maybe consider losing the paisley background-it distracts the eye just a little from the main content, due to the nature of the layout.

They have: 7 posts

Joined: Nov 2009

Well done on creating a unique and interesting website. I agree with some of the comments above insofar as the paisley background is quite strong. Also, I personally found that your homepage has too much text on it. It's a bit hard on the eyes.

Along the top menu, I wouldn't put "share" before "home". It defies common web logic IMO.

Also, I couldn't find a contact us page?

Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.