Pre-Creation Website Opinions

[smithmr8]

Hi,

I'm in the process of re-designing my website. I've made a quick mock-up which I personally like, but want to get some more opinions before I splice ect..

 

Thanks,

Luke

 

[attachment deleted by admin]

[smithmr8]

Have made some amendments. This is the finished design.

 

http://i48.tinypic.com/14m81nb.jpg

 

Any thoughts / comments would be much appreciated.

[smithmr8]

Its now online.

 

http://www.bytefish.co.uk/

 

Although, cross browser viewing is rubbish.

 

Tried it in an old version of IE and it doesn't display right. Tried in FF, works fine. Opera is fine, and Chrome it doesn't work properly.

[webmaster1]

Messy on Chrome though to be fair you're already aware of this.

 

The grey font is a bit dull. Try using a stroke, drop-shadow or whatever it takes to create more contrast between the grey text and the grey block behind it. I think the titles should sit on the top of the boxes rather than inside it.

 

I suggest using a mouse-over image swap for the link boxes on the right. Try adding a little gloss or shine to the panels behind the icons.

[smithmr8]

I'll try some different things to make it contrast a tad more.

I've already got image-over swaps in the works. Just working on the specifics of the them. Will try your suggestion of adding some gloss or shine.

And I tried sitting the boxes on top, rather than inside, via PS and it looked surprisingly good so I'll give that a whirl as well.

Will post when things have been changed.

 

Cheers

[smithmr8]

How's that looking now ?

Moved the title boxes to outside of the main boxes. Changed the titles to a blue fore-colour with a grey stroke which has increased the contrast. In the process of doing the rollover's atm

[webmaster1]

Hey, the contrast is better. I'd consider trying a white font with a grey stoke and gentle drop shadow.

 

The layout is fine on Chrome. The text of the footer is right aligned. Not sure if it's meant to be centered or not.

 

Have a look at these tutorials to learn how to render your link boxes with a little flair:

http://www.ekhoury.com/2007/03/29/glossy-black-panel-with-photoshop/

http://www.zoomcities.com/forum/showthread.php?tid=6564

 

I use these sites for design inspiration a lot:

http://siteinspire.net

http://patterntap.com

 

[smithmr8]

Cheers, I'll take a gander

[smithmr8]

I've used one of those tut's to make a glossy" image. One of which is now live on the site. Just going to do so layout changes and will finish the others. I think it looks a fair bit better

[webmaster1]

You glossed the panels like a pro, buddy. Well done. The reflections and the drop shadows are looking tasty too.

[smithmr8]

Cheers ! Just got to start working on the additional pages.

Trying to find a decent JS script for the rollovers which also preloads the images to make it more fluid.

[cags]

Consider putting the `Contact Us` labels above the fields rather than next to them and make them a uniform width, it will look cleaner and is supposedly parsed easier by the user. Overall I quite like the design a fair bit but I do find the light grey a little hard to read against the blue background.

[webmaster1]

Not sure if you're leaving the form as it is but to be direct with you it's looking fairly dire and spoiling the rest of your layout.

 

Here's over a dozen examples/tutorials of what a modern form should look like:

http://www.smashingmagazine.com/2006/11/11/css-based-forms-modern-solutions/

 

In terms of preloaded image swaps I'd go with this:

http://www.dynamicdrive.com/dynamicindex15/domroll2.htm

 

Not only does it give you a rollover effect, it also gives you a mousedown effect, all of which are preloaded.

 

Have fun styling the forms!

[smithmr8]

Consider putting the `Contact Us` labels above the fields rather than next to them and make them a uniform width, it will look cleaner and is supposedly parsed easier by the user. Overall I quite like the design a fair bit but I do find the light grey a little hard to read against the blue background.

 

Thanks for the input. I'll have a look at the form layout. And the text colour was something I considered changing. It works fine for me, and on all the other monitors I've viewed it on. But will take a look at some darker (more contrasting) colours.

 

Not sure if you're leaving the form as it is but to be direct with you it's looking fairly dire and spoiling the rest of your layout.

 

Here's over a dozen examples/tutorials of what a modern form should look like:

http://www.smashingmagazine.com/2006/11/11/css-based-forms-modern-solutions/

 

In terms of preloaded image swaps I'd go with this:

http://www.dynamicdrive.com/dynamicindex15/domroll2.htm

 

Not only does it give you a rollover effect, it also gives you a mousedown effect, all of which are preloaded.

 

Have fun styling the forms!

 

I wasn't finished with the form, no . It was just there to pad things out so I can get a feel of how it's looking. Planning to make the input boxes rounded, like some of the examples on that page. And cheers for that JS. It looks so much simpler than others I've been using.

 

Will let you know when I've finished with these changes to get some more feedback.

 

Thanks

[webmaster1]