WEBSITE LAYOUT AND STRUCTURE

EdinburghGary

Reply not Report
Messages
19,065
Name
Gary
Edit My Images
Yes
Hi Guys,

I'm about to start my 2011 web site which will have a TONNE of info dropped into it, however I like the look and feel of the current structure.

My requirements:

Homepage will have 8 important links to equally important parent topics (only 5 at the moment). Each parent will have up to 12 children. Site MUST be SEO friendly over and above gimmicky.

My idea is to expand the current layout to the have 8 vertical bars, and then have the site crumble in the best possible way within each section. Bets of both worlds?

Any advice, hints, tips and inspiration appreciated. I build the existing site from scratch including all graphics in about 2 hours. I'm willing to spend a few days on it this time round :D

G.
 
In my experience setting aside a couple of days is just not enough to do a redesign to a good standard, I usually spend a full day on just the first draft of the graphics, and that's before a single line of code is written. Even for a really quick web developer it will take the best part of a week to put together a site of the scale you are talking about and get it to a stage where it can go live.

Have you considered getting a pro in - it may cost a bit, but you'll end up with a better quality site at the end of it, and it wont use up so much of your valuable time which you could be spending taking photos?
 
In my experience setting aside a couple of days is just not enough to do a redesign to a good standard, I usually spend a full day on just the first draft of the graphics, and that's before a single line of code is written. Even for a really quick web developer it will take the best part of a week to put together a site of the scale you are talking about and get it to a stage where it can go live.

Have you considered getting a pro in - it may cost a bit, but you'll end up with a better quality site at the end of it, and it wont use up so much of your valuable time which you could be spending taking photos?

Woohoo! A reply :D

I'm on the lookout for a good outfit and I will allocate a budget accordingly. Before I do though, I'm gonna do my own version and see if I can get something I am happy with. I am not a pro designer, but I know Visual Studio and c# inside out, and can do most things. I have always managed to design sites with good conversion rates, which are also clutter free and quick loading.

I'm still working on it at the moment, have been for about 20 hours now - purely structure / filenames / search term research etc. I suspect it's gonna take me overall about 80 hours (sigh!), however I do it in the evenings when I have no viewings to organise (which I do :LOL:)...

I have managed to come up with something which uses the existing site and grow nicely too (I think!).

G.
G.
 
I'm sure you'll already do this but just in case I'd say a very important (and often overlooked) part of website design is the final proofing.

Because you've spent so much time creating it you will know the site inside out and everything will appear very straightforward and easy to navigate and flows well. But it's definitely best to get several people from different backgrounds (i.e. computer savvy, non-computer savvy etc) to test it and give honest brutal feedback otherwise there's no point. :)
 
sounds like you've got your head screwed on

In terms of the design, if it's an important one I will usually start with a pen and paper as this enables you to think quicker and get ideas down on paper before you've moved onto the next one. At this stage you should have already decided what elements need to go on the site and you are only looking to define what bit goes where, what size they need to be and how a user will interact with them. It's important to get the balance right, so elements don't fight for a users attention. With the most important elements being bigger, bolder and further up the page.

Then turn to Photoshop and replicate the mock-up/wireframe.

I usually start by deciding on a simple color pallete (usually based on the logo), and then find some images that work well with the colours and just start playing around. I find that design is about 80% trial and error and 20% inspiration, so just try lots and lots of different ideas and don't be afraid to scrap it and start over (save a copy just incase). Don't fall into the trap of browsing for good website designs, you'll only end up subconsciously copying them.

For me the easiest designs are always the ones where the client has supplied some really good images, so you should have no reason to complain on that front.

What Graham said about feedback is also important, but be cautious which feedback you pay attention too, some people can be very vocal about what they dislike but not have a clue why (or any taste!) and you want to avoid a design by committee scenario, there's a saying that I like to roll out on occasions like this which goes something like: "A Volvo is a Porsche that was designed by a committee."

Good luck!
 
Hi Gary,

My only initial thought is on the overall width (1260px) at the moment I think. It depends on whether you can fit 8 bars into this width without squeezing the text pane but I get the feeling that width is already fairly maxed. I try to keep my sites to 900px as I find a lot of people view with smaller screens and sideways scrolling websites are a pain.

Those colour coded sections are a nice simple visual cue but I would be tempted to optimise the space they’re taking myself. Possible more along the lines of a colour coded tab control with the tab colour bleeding into the selected tab to surround the text pane.

Not sure I've described that well enough. Let me know if not.

Cheers,
Andy.
 
Andyman said:
Hi Gary,

My only initial thought is on the overall width (1260px) at the moment I think. It depends on whether you can fit 8 bars into this width without squeezing the text pane but I get the feeling that width is already fairly maxed. I try to keep my sites to 900px as I find a lot of people view with smaller screens and sideways scrolling websites are a pain.

Those colour coded sections are a nice simple visual cue but I would be tempted to optimise the space they’re taking myself. Possible more along the lines of a colour coded tab control with the tab colour bleeding into the selected tab to surround the text pane.

Not sure I've described that well enough. Let me know if not.

Cheers,
Andy.

Cheers mate...despite my OP, I've dropped to 4 bars and 930px wide now...

I'm opening into more sections on the parent pages of each category. Dropping less important tabs to below in blue, alongside t's and c's...
 
Cool. 930px much more sensible width I reckon.

Only other thing I could think of would be that I'd like the entire bars to be clickable rather than just the text. I expect you've already got that though.

Happy to view any prototype if you'd like opinions.

I don't know if you're using a SiteMap but they really work great in ASP.NET and make configuration very easy. Worth looking at if not.

Cheers,
Andy.
 
Back
Top