I’d originally intended to enter my four (eventually five) games into the CSSCGC 2013 and then, for a while at least, get back to VMware, Citrix and the modern world. Having been crowned supreme loser, however, it would appear my time with the ZX Spectrum (and certainly the CSSCGC) was not over.
As newly-nominated host I would need, at minimum, a website and an email address to submit entries to. Hosting and email were easy enough, however, when it came to a design I was instantly drawn to the Spectrum 128K’s menu system.
With its distinctive cyan selector and rainbow header I’d originally intended to have it stacked vertically, as per the original, but decided that the traditional web-horizontal menu approach worked better.
I modelled my review summary panel on Your Sinclair (even though I was a Sinclair User reader, back in the day) and also wanted to include those little pictures of the ‘reviewers’ and so decided to give the Fighterz from SUFTII a second outing. 💡
I also wanted to use the Spectrum font and palette throughout, however, felt that my browser’s rendering of Darko Stanicic’s True Type font was a bit crap. In the end I decided on a basic Courier for content and pre-rendered .png images of the ZX font for titling and other special uses (News and Review titles use a date format which mimics the Spectrum BASIC PRINT command and the download icons stick to a faithful UDG/Attribute block format.)
Another idea I had, for the landing page, was a loading screen based on the original Cascade Cassette 50 artwork. Having had so much fun doing loaders for last year’s games I already had all the skills I needed to reproduce the screen in an actual Spectrum loading sequence and then simply screengrab the process and sequence them into an animated .GIF!
The website itself was hand-rolled in PHP and largely based on old code from MykeWEB v5.0 and, whilst it uses some modern CSS tricks for mouseover effects and image wrapping, it’s quite an old fashioned affair using Tables and Transparent .GIFs for keeping everything aligned and as intended.
I think it looks pretty good in modern browsers and on the iPad, however, does suffer a bit in older browsers (IE8, for example, loses the menu mouseover and shows up the transparent .gifs for some reason) and on smaller mobile devices.
(I did briefly flirt with the idea of another mobile-ready flexible WordPress Site, however, I had a very specific look in mind and quickly realised I wouldn’t be able to do it justice with my wildly limited CSS skills.)
You can catch up with the latest news and reviews from the CSSCGC 2014, here.