Some Website Design Stuff

Those of you who come straight to this page will not have seen the changes to the DWD website.

Having gone through my ‘deep blue’ period, I was not happy with the final result. There were a number of things that were wrong. I thought the deep blue - still on the blog - lent an oppressive feel to the website. I don’t normally go in for such strong colours but - hey, I can only give it a try.

The deep blue has been replaced by an unsaturated beige and green (my beige & green period) and the whole header graphic replaced. I liked the web page jumble but it lent an untidy look to the rest of the page content. If you produce web pages then why not use them right at the top of the page to advertise your wares? So, I will use them again but in a tidier arrangement.

Instead, I have used the Firefox toolbar as the header, trying to include functionality in that space. At the very top is an XP style bar running the width of the page

The general aim w.r.t. the home page was to reduce its length - far too long - without reducing the amount of information. So I added some functionality to the header graphic, firstly some keywords on the XP bar. Then, modifying the FF menu items to suit the site. The ‘durban-website-designers’ is real text. The search box works via Google and where there is a select list, I added a Javascript tooltip (basically) that will enable visitors to access any page on the website. I may keep it, I may not because as the mouse goes over it, the thing suddenly appears so there may be an irritation factor.

The top and Right menus are pretty well as they were but the home page content has been changed a lot. The middle section uses CSS to use one space to display 8 lots of text. Even the default area is used to advertise a special. The text stays on the screen until another item is clicked or the link is clicked again and it disappears, leaving the default text.

I quite like the idea. I’ve used the CSS ‘hidden text’ on some of the other pages but this is a little more compact.

Below this are some tabs as a variant of the ‘page within a page’ CSS that I have used on the website-designers.co.za website. The difference in this case is that there is no content visible under the tabs unless one is clicked. Anything can go into the tab area.

All the text on thepage, hidden or not is visible to search engines. Whether they classify it as a devious ploy I don’t know.

I’ve still kept the ‘20 seconds’ link because I think it’s important to give visitors the alternative of a rapid run-through. The ‘utility bar’ at the top of the content allows visitors to email me, to print a printer friendly page, to send a mail to a friend and to change the text size.

The overall appearance I think is less oppressive than the dark blue. I have also made use of includes in this version to make the task of maintenance easier.

What took time is getting MSIE to display the page properly. Instead of using a javascript browser sniffer, I have started to use MSIE conditional comments so there is a base stylesheet that caters for everything except anything that absolutely has to go into a separate MSIE stylesheet. Unfortunately, that’s still too much and on the home page, there was a lot of jiggerypokery to be done.

What I will also do when the loose ends are tied up is to validate the code with the W3C validator.