The F-Word Turns 5

Published on 11 March 2006 in ,

I confess I’m a little late with this, owing to me just not being in the mood to blog much recently, but The F-Word turned five recently.

It doesn’t (in some ways) seem that long since we used to sit in our flat and in the pubs of Ealing and Catherine would talk and talk and talk about doing some sort of feminist website, and I’d say things like “If you want to do it, do it”. And that would have been that, probably for years, had I not gone out and bought the domain so that she had no excuses.

At the time – 2001 – there was nothing really like it in the UK. Of course now we’re in an era of blogs and so on, and it seems everyone has their own little site, but it’s good to see that five years on, The F-Word is still going strong.

Anyway, in celebration, I thought I’d look at my own little contributions to the F-Word over the years. No, not the article called Real Men Drink Pints that I wrote in June 2003, but the designs over the years.

The Launch

The very first design from March 2001 – a rather moody black, white and grey thing, but using blue and purple links – this would have been around the time I was reading lots of web usability books, and whilst I don’t agree with a lot Jakob Nielsen says in Designing Web Usability: The Practice of Simplicity, I did decide at that point to try and use blue for unvisited links and purple for visited links around that point. Indeed that decision is still in place on almost (if not all) sites that now have online. Of course it matters now even less than it did back in 2001 – back then the old blue/purple combo could still be seen on plenty of sites and Jakob’s argument was that users expected it. Now links can be anything under the sun, and even fewer set the visited link colour to be anything other than the same as the visited link colour (boo!)

This was also around the time of early CSS when people like myself were thinking about how CSS could replace images. Indeed, there’s only one image used on this design – a 1 pixel spacer gif (ooh, retro!) The rest, even the logo, is done using CSS (although the layout was still based on tables). I think it was also the first site I ever used Verdana on.

Of course it’s a very plain design – well I’m not exactly a designer. Very simple, very functional, but not exactly very glamorous.

Underneath however, it’s stripped back to the bone. The code is very clean, very simple. As I recall, it was the first site I built where most of the presentation was handled by the CSS. It was also built using header tags all the way through – rare at the time.

Design 2

The initial black and grey didn’t last very long at all – just a month later it was replaced by this colour scheme.

The only real is in the colours – a white background with blue, which instantly makes the site look less dark and moody, and much more inviting. The ‘this months articles’ box on the front page also got a tweak.

Looking at it now, I really don’t like the chunky block of blue under the navigation bar. Incidentally, the giant f on the left was replaced by navigation once you got down into the site.

Design 3

The first design was slightly rough and ready in some ways – quick and easy to get out of the door and look after – but like so many initial designs, it didn’t really scale well once the site started being populated with more and more data. It also looked rather boring. Hence, design 3.

The homepage here gets a substantial redesign – moving everything over to a two column layout. There’s also a new logo and a new colour scheme – green and grey. Bit brighter, bit fresher.

Colour choice was always important. Many feminist sites ended up being pink, and there’s even been trends towards the sort of 1950s drawings of women with aprons, which are obviously ‘ironic’ on a feminist website. Neither of us wanted to go down that route, so the F-Word has always had a very functional, slightly serious looking design. No irony allowed.

The attempt was made to make everything a little more graphical – a little nicer to look at. All the graphical touches are done by CSS, although one concession came in the form of the new graphical logo, which does look much nicer than the old, plain Verdana. By this point, people had realised that doing logos in CSS was never really going to take off – mainly because with a graphic you can be just so much more flexible.

Quite when this design got launched, I don’t know. Some point between February and May 2002 I believe.

The current design

This was a change that was painful. Previously, The F-Word had been built using handcoding – every single file had to be created in a text editor and done manually. It was beginning to become a huge task. So I opted to move it over to Movable Type – make it a bit easier on Catherine.

Then there was another problem – I needed to move the site over to CSS for its layout (okay i didn’t need to, but I needed to if you catch my drift.) Plus I hated the old design. Everything just had to be redone. From scratch. Argh!

The process wasn’t quick and it wasn’t easy. It took months of endless copy and pasting just to get the articles in. Then a few more months sorting out the design. Indeed, the project probably took around about a year in total.

But the pain was worth the effort. The new look went up in August 2004 and I still like it, and it still works.

Graphics are a lot more noticeable in the new look – I’d started to enjoy messing with images more and came up with the coloured swoosh effect in the banner. It’s very simple – only two colours – but looks pleasing.

A new logo also arrived. The old one wasn’t very imaginative – italics ‘Times New Roman’ I think. The current logo is a bit more distinctive, with it’s large f.

There’s more images in the site, but they’re used simply and sparingly – little touches here and there. The same font as used in the logo, is used on section headers. It all comes across very pleasingly I think, and for once, I’m not in a hurry to redesign it.

If indeed I do redesign it. Maybe there’s an F-Word contributor who’d like to give it a lick of paint instead of me doing it. We’ll see.

Round up

Anyway, that’s my little contribution to a five year old site. It’s looking good. It’s made a difference. And it’s still going strong. I’ll pop out the champers latter.