Redesigning

The observant, regular visitor (provided that person is a non-mobile device, non-tablet user) will have noticed that this website has been going through a serious of redesign experiments in the last week.

I have been playing with seven design variations. I liked bits of most of them, but none gave me everything I felt I was looking for.

After many hours of scrabbling about, I came to realise that I wasn’t going to find an off-the-shelf design that ticked all of my boxes.

There was nothing for it. It was time to roll my sleeves up and crack and hack the hundreds of lines of css code that hold this website together.

Unfortunately, though, the old design was put together by someone else. And hacking about with someone else’s css is never fun. Every change contemplated, every edit made, everything has to be carefully scrutinised.

Why?

Because what looks like a simple ever so tiny tweak here, could have massive implications in a different section of the website.

I decided that the base design I wanted to use would be the Dot-B.

After installing Dot-B, the first thing I did was incorporate a sideview of the Bandit’s fuel-tank/engine cross-section, in the header.

 

 

 

 

 

 

Then I scrolled down to a post and used the css (cascading style sheet) design behind that as my proof-of-concept.

 

 

The first view looked like this.

 

I decided I didn’t like the text size; I wanted the font to be slightly larger.

 

 

 

 

 

A quick tweak of the css gave me this, slightly too large, text.

 

 

 

 

This is a much better font size, but I felt unhappy with the mouse-over behaviour of the post title.

 

I also wanted to change the hyperlink colours

 

 

 

A few minutes later and the mouse-over behaviour of all post titles had been improved.

 

I also felt that the new ‘first-look’ at hyperlinks and the mouse-overs of hyperlinks was an improvement.

 

 

Finally, a cross-browser compatibility check showed that a couple of browsers offered poor granular definition between shaded/unshaded background and foreground text.

A few minutes later this was fixed.

 

 

 

Not too long ago, hacking another person’s css, to produce design and functionality changes across an entire website, in this manner, would have been a long, slow and laborious process.

All of these changes took fifteen minutes.

I have used a css editor called Sylizer, to made these complex alterations.

Stylizer is, quite simply, the mutt’s nuts.

I might not stick with Dot-B, as a design, but I shall be sticking with Stylizer as my css-Editor of choice.