Tinkering

Apologies for the extended period of silence. This has been mainly to do with the fact that after my initial excitement I became less and less happy with that initial layout design. I’ve been tinkering with it, thinking, pondering, surveying the web scene, tinkering some more, sketching, getting frustrated, etc etc!

I now have something that looks rather different. It’s not finished by any means but I am finding myself more satisfied with the look of this. What do you think?

As you have no doubt noticed, that is only the top of a page! But I was so struck by how was turning out so far I wanted to blog about it before I finished the rest of it. This is pleasing to my eye. The image in the header is not the image that will be used in the final website – just a temporary one with the feel of what I want to have in there.

I was originally going to have different colours for the different channels … they were previously in boxes, and now are tabs, so maybe the tabs should be different colours. I would like to use colour to define the different channels and keep the same colour throughout each channel. But maybe that can be done in another way rather than using coloured tabs – I rather like them the way they are. We shall see.

Back to it!

Top Page Layout mark 2

I probably should have done a wire frame for the sub-sections but I got carried away with the top level css layout. I’ve got mark 2 coming along nicely now. Here’s a screenshot:

Obviously the header image is only a scrappy one I threw together for this layout. We will need to get that redone – I will enlist the help of Emma in the Business Office for that one I think I will have to stop poking at it now though – I’ll spend weeks tweaking and poking and prodding if I let myself!

I’m now going to make a basic wire-frame layout for the sub-section pages, or what I’m calling layer 2. There are four main sub-sections in layer 2 – one for each of the coloured squares, and they’re each going to use the colour from the square to let you know you are still in that section. I need to work out how to have the tabs showing at the top and make it clear which page you’re on by making sure the tab appears attached to the page, while the other tabs are obviously behind the page.

Layer 2 also contains things from the links at the bottom – About, Contact, Jobs, Publications, Links and Sitemap. I’ve not decided yet how these sub-sections should look … probably like the other layer 2 pages, but without a tab being selected – just showing them all behind the page.

Layer 3 will be for delving deeper within the main layer 2 sections – eg on layer 2 for Visitor Centre, there will be links to various topics – these topics will each be on a layer 3 page with the Visitor Centre colour branding.

Back to work!

CSS Layout

I’ve created a CSS layout for the top page of the site. Now be warned, it doesn’t look very exciting! It’s just a wire-frame kind of thing – positioning the elements in the right places. It took quite some time to get my head round it – I’ve done some css before but had always relied on tables for my layout, but I decided this time it had to be CSS only – no tables at all. So, without further ado – presenting the first layout page.

Next job is to layout sub-pages I think, before I move on to prettifying it!