2007 aqcom Design Imported From Epistula

Redesign Aq15

Stripped back, back to blues, purples and (for reasons best known to the bits of my brain that aren’t talking to me) orangey-salmon-pink.

Epistula’s implementation – finally – of a views system means I can have different templates for the front page and the rest of the site, which is handy, so the front page becomes all about the latest article and a more traditional weblog down the left hand side, a host of things I’ve favourited on Youtube, added to, star’d in Google Reader, Deviantart, taken photos of and added to flickr or – hopefully – liked at all. That’s being merged together by Venus, Sam Ruby’s fork of Planet.

Coming up: Indicators on the Otherwhere panels to show where it came from and when, a return of the AqCom sections and Recent Comments bits, a redesign of the Comments field and the implementation of the old banners into the new banner area for areas where specific banners apply.

Plus, it’s not pink.

aqcom Design Imported From Epistula

AqCom13 – The New Design

Unlucky for some, AqCom13 – the thirteen major redesign since I started – is a lot more image intensive than most designs I’ve used.

The three common elements to the Aquarionics “Brand” for want of a better phrase has been the typeface – Trebuchet MS since 2002, the blue “swish” curve in the top left corner (Since 2002 also), and the black and yellow Aquarius sign in a circle logo. All designs since v4 in 2002 have featured one or more of the above, and once or twice all three.

For v13 I’ve gone back to the idea of the big banner across the top, because I like creating them and it’s a quick way to change the “look” of the site. I’ve been somewhat put off this in recent designs, because the number of people actually seeing the designs regularly – with LJ feeds and RSS readers and such – has drastically decreased. I tend to ignore the fact that most of my visitors come from people searching Google for a single bit of information, who rarely bother to see past the page they get to.

This design doesn’t have the site title in it. Well, it does, but it’s in a very light effect in the top banner. Instead I’m relying heavily on the Aq-circle logo for “branding”. It removes one of the constant elements of the banners, too, which may make making new ones easier.

No more text based navigation – The big images down the left don’t look a lot like navigation, but that’s what they are. I’ll be making incremental changes to make that more obvious, I hope.

Back to the three-column layout. Can’t really escape it, it seems.

I’ve kept the mini-bio bit at the top right, and even added a photo. Narcissism, really, but it provides an answer to “Who wrote this”. If I ever get multiple authors, that’ll change depending who wrote what you’re looking at.

I’ve not provided a link back to older diary entries still. The archives are scary, I’d prefer navigation though search or relevant to this (i.e., the categories of the current item, the date links). Though I’ve also taken out the search box, that’ll be back.

The actual content design hasn’t changed much, although the thick, boxy look comes straight from v7. I don’t muck around with that too much, because text on white – or in this case very light grey – was put there for a good reason in the first place, plus there’s a number of custom styles that rely on it.

A more photo based than illustraty or designy layout, and one I quite like. The photos for the left nav came from MorgueFile, except the last from iStockPhoto. The banner and me images were taken by me. The default top banner is a view of a Cambridge sunrise from the top end of Mill Road (the building to the left is the swimming pool)

The Favicon is still my old glasses. Must fix that sometime…

Oh, side effect of the banner system being back, old banners are displayed with their entries. There was a new banner most weeks thoughout 2004

aqcom Design Imported From Epistula

Something Changed

I got bored of lack of colour, spartan design, and especially grey.

It isn’t perfect, but it’ll do until I invest some more time in it…

I’m not sure what’s causing the weird gaps in the left image in IE and Safari, but in Safari it appears to vanish with a reload, which is weirdness.

Back to a reasonably standard three column layout with the big banner over the top, though the left nav is a bit prettier than my usual fare, I’m not sure it looks enough like navigation. I may underline the words as a better visual hint.

…yeah, the About links aren’t properly done yet, holistic is down for a little while due to the host shuffle. The little blank grey bar on the front page (local navigation on all other pages) will eventually become a linklog feed, once I get around to implementing it. I’m not entirely happy about Pictures going off-site either, so that may become a link to a magical ajaxy world that pulls in the latest images.

Design Imported From Epistula

More Rejected Designs


aqcom Design Imported From Epistula

That which won't happen

Okay, so the new design for Aqcom isn’t actually going to work. Time to go back to the drawing board. Or window, really.

aqcom Computer Games Current Affairs Design Humour Imported From Epistula Moving to Beford Personal programming web development


So yeah, new year, newish design. It isn’t perfect, but it’s a start. And the new new design is trapped in PSP until I get a new 30 day trial 😀


I like simplicity. It appeals to my sense of design, and the light grey with some of the most delicate shading I could make visible is nothing if not simple. The boxes and curves design is lifted from previous designs, but where there they were gradiented and filled here they are lightly hinted at rather than rigidly defined. The construction marks on the logo I like too 🙂


It’s a long way from the new design, which is slightly more heavy on the photographic backgrounds than I usually do, and is therefore something of a departure. Changes are good.


Today I spent a long time in a car, and a slightly shorter time in an actual meeting with actual clients. For this I am wearing a suit, and am reminded – as I am always reminded – that I need a new suit at some point. I don’t wear suits very often, and part of the reason for that is my enjoyment of the reaction of people who haven’t seen it before. I hate with a passion, however, the shiny clompy shoes, because the shiny clompy shoes are clompy – and I don’t like being clompy – and the shiny clompy shoes go clomp-clomp-clomp all the way home until they wear though my socks and make the backs of my ankles bleed. Which, you know, hurts.


I suspect that, with all the lack-of-updatingness and the cheese-sandwichingness (though currently it’s a bacon sandwich. Mmm, bacon) I’ve lost most of the geeky percentage of my audience. Though the geeky percentage probably didn’t notice the not-updatingness because they all use RSS readers, and the rest all use friends lists. Why do I bother with the designing of actual web pages again?


Current things that I have been mucking around with include “DOM Scripting” (as well I might), which I will get around to mentioning in a bit, Scripting in computer games (Both Civilization 4 and Vampire The Masquerade use Python as their primary game scripting language, which I find interesting, and have on my list of Things To Write An Article About) and Visual Studio Express.

Open Sorcery types, you can switch off now, because I don’t need your next reaction.

So, I have downloaded Visual Studio Express which is what happens when Microsoft miss the point. Amateur coders are mostly nowadays developing in things like Python, Perl, PHP and if they have had their brains fiddled with, GCC and Java. Lots on Linux. This is, indeed, partly because Visual Studio costs TEN MILLION DOLLARS per license.

Actually, it doesn’t, but as a non-professional developer it might as well do, as the high licensing puts something of a boot-strapping problem in front of learning to dev for Win32, or even Win64. So, Visual Studio Express you can download for Free (as in Beer). Well, you can download a demo for free (as in beer), but you do have to register for free (as in, be spammed for eternity) and have a Passport account (as in “submit to the almighty Gates empire”. Much like you have to do for OpenSolaris) (Except different empire, obviously) (Yeash, you guys are pedantic). So yeah, I’m downloading VC++ (Because I want to design a Half life 2 mod about killing lawnchairs) (Incidentally, Valve’s Developer docs are all in a Wiki, isn’t that interesting?) (Yes, too many brackets, Sosumi) and it’s taking an eternity, though not as long as XCode did. I mean, what do you have to put into an IDE to make it 800mb?

Oh, right. OS X. Chrome, naturally.

So yeah, updates as and when. Also about the Mysterious Project Breakfast, assuming I get around to that too.


Bedford has a sushi restaurant. I swear the things follow me around. I am, of course, doomed, but I am doomed with expensive raw fish, and that somehow makes it all worth while.

Dead Ken(nedy)

Charles Kennedy, leader of the UK Liberal Democrats Governmental party, has, shortly after some people accused him of not being a good leader, admitted to having a drinking problem. His chances are not looking terribly rosy.

(From The Friday Thing Dead Kennedy Pool):
When Charles finally goes, the nearest prediction will win its predictor a bottle of Talisker 18 Year Old Single Malt Whisky. And the country will win a second opposition party with an actual leader. Everyone’s a winner.

(Thats three times I’ve attempted to spell “Kennedy” as “Khennedy”, which is your fault, Jason)

Tuesday, Ten AM.

Shortly afterwards all the people who said they wouldn’t run against him in a leadership election will, in fact, run against him in a leadership election “In the interests of the party”.

Wednesday, Thirteen Fifteen, Sir Malcolm Rifkind will announce that he’s actually really been a spy for the Liberal Democrats all along, will enter – and win – the leadership election, and then all three major parties will be basically Tory. This will set off a chain of Heath Robinson events which will naturally lead to the collapse of the entire political system across the world, leading to the rise and rule of a little known previously almost silent group called the “Bloggers” who will alternate between demanding that everyone be nice to everyone else and being so emo their hair cuts itself, their first action will demand that every person in the entire universe gets a weblog or other online journal and the resulting influx of new accounts at LiveJournal will mean that Six Apart become the single source of money in the entire world, except for Sun, who they buy servers from. Sun will open source world government, leading to rule by whoever argues most consistently on the mailing list, which will eventually lead to the population of the world being run by the commentators on Slashdot, leading to great leaps forward in technological research, the population of Space, a new version of Doom, and a world famine as no money is spent on any food that doesn’t go into either kool aid or cookies. We all die, and it’s all Charlie’s fault for telling us about his drinking problem.

Selfish bastard.

Design Imported From Epistula web development

An example of impressive web design (Warning: Sound) (Warning: Flash) (Warning: Animated CEO figures) (Warning: Uses flying bits of pages) (Warning: Strong colours) (Warning, Warning, WARNING!)

aqcom Design Imported From Epistula


Okay, so the AqCom tradition of gradual redesign has come back with something of a vengance after a year of relative stagnation, enough for me to stick a peg in the ground and say “This is what it looks like now”, anyway.

This is what it looks like now:

(A rare view there of the elusive AqCom admin interface, such as it is)

The thing that drove the design was the fact due to my current “Sunlight at weekends” status (It’s winter, I leave home before dawn and arrive back after dusk. And, obviously, I walk fifteen miles uphill both ways, in the snow! and sleet! And we never weren’t given breakfast, we weren’t) I haven’t been able to take photos for the banners, eventually falling back from weekly, to monthly banners, and for the last week it’s defaulted back to the original one. Enough was enough. Time to design around it.

Also, I missed the swish. The swish is the design term for the curve that graced AqCom 7 & 8, was replaced with the glasses for 9 and ditched for the banner in 10. I wasn’t happy with the huge gutter it left down the left hand side, really. And since the shape meant that gutter or a large gap at the top – or a medium gutter on both – I was stuck. I couldn’t make the text scroll over it, that looked silly.

Can’t go over it, Can’t go ‘round it, have to go under it.

The swish is now a png, with a semitransparent shadow, placed in a design-element div (yes, ick, but occasionally we sacrifice elegance for beauty) absolutly in the top left hand corner. It’s given a z-index of 200. (The stamps and postmarks have 100 and 101 respectivly, the 200 means that – should it be an issue – they will slide under the swish) and yay, text disappears into the shadows under the arch, isn’t that neat?

Well, yes, yet not perfect. The problem with the swish being on top of the text is that clicks ignore transparency. Any links (or input elements) displayed within the boundry box of the div that displays the swish weren’t clickable, since you weren’t clicking the link but the image over the top of them.


This stopped the idea for a while, while I moved the header from over the top to the current graphic (filling in the gutter down the left I hated so much. Later revisions of Aq10 had a migrane-inducing black & white tiled pattern down there).

What I needed to do was give the links a Z-Index higher than the swish. I initally put Z-Index: 202; onto the “item” class – of which every block of main content on AqCom is a member – but that meant that the text flowed over the top of the swish again, which still looked just as bad as the first time I nixed the idea.

The problem was solved by Rory when he informed me that Absolute didn’t do what I thought it did, because in playing with that and the postmarks, I realised that there was a solution. It is this:

a, input, textarea, select {
position: relative;
z-index: 202;

Spot that? The position means it can get a z-index, but the lack of any further instructions means that the only way it moves is outwards. Everything that isn’t a link slides under the shadow, but links – which are almost the same colour as the top of the fade anyway – slide over the swish and are thus clickable.

Last problem was that the swish was obscuring too much of the text, which annoyed me, so I made it smaller. Eventually I’ll probably move the site content down a bit so I can put the full-sized curve back. The two full sized curves look like this:

  • iSwish

    So this is unlikely to stay still very long…

Accessibility Design Imported From Epistula useability web development

Sites of Evil

Today I was going to buy some Sluggy Freelance books for christmas.

I went to Plan 9 Europe, the European distributor for the comics and…

Well, go see. Your mission is to buy the first three Sluggy books without smashing your monitor.

Your time starts now.

Design Imported From Epistula


Since three people have now commented that they didn’t realise the image in the previous entry was clickable, how would you make an image “obviously” clickable?

The HTML standard, the thick blue border, looks ugly as sin, so it looks like manipulation of the Thumbnail is the best option. Previously I’ve recoloured it, or added a little magnifying glass to the corner. It works mostly with screen shots, mostly because the abbreviated format more or less guarantees that a larger version is available. The problem is that thumbnails are more or less useless for anything more than a general idea of the picture as a whole, which is why I like to use the cropped version. Problem is, the cropped version doesn’t contain the must-clicky nature in the same way the thumbnail does.

It’s an interesting thing.

On a related note, I’m playing with Gallery, which seems to work far better than my homebrew system and therefore might just replace it, if I can get the formatting a little better, and can make it integrate nicely. It already integrates with *nuke and geeklog, so it shouldn’t be too hard.