Yes, my blog has yet another new face!  It’s still not quite finished, at the time of writing, but I’m hoping to have some of the problems ironed out by the end of this evening.  This is the final product of the idea I demonstrated the other day, this time with all the appropriate graphics in place.

There are a few differences though, some through choice and others through necessity.  As hard as I tried, I just couldn’t get everything to work as I wanted, but I think that’s mainly due to my resistance to using Javascript to make certain visual things happen – as a stalwart CSS user I like to make as much happen as possible without resorting to external scripts.

The most obvious difference is in the ‘More’ section at the bottom of each post.  Originally I had planned for this to open up and show all sort of nice extra bits and pieces, but there was an issue with the placement of subsequent floated divs.  Frustratingly, if a div extends downwards, a float beneath it cannot occupy the space behind it.  This basically meant that hovering over the ‘More’ buttons would upset the layout of the whole of the rest of the page, which wasn’t quite what I intended!

The other ramfication of this was that I had to fix the height of those smaller post boxes.  The idea initially was that the boxes would just fit in where there was space, regardless of how big they were.  Sadly, floating divs are not quite as helpful as that!  This means that at the moment in some cases the text overflows beyond the capacity of the box.  Part of me says that this shouldn’t be a problem because if people really wanted to read all of it they should click it and view the whole thing rather than just the excerpt, but it’s not quite as tidy conceptually as I would like it.

So, still some work to do to pollish off the design.  That should keep me busy for this evening!  Oh, and I also upgraded to the latest version of WordPress.  Doesn’t seem to be much different though..

Categories: Technology


Phill · 5 February 2007 at 9:06 pm

Nice Matthew, although the font size is a little small. And the ‘comments’ section at the bottom of each blog post could do with a bit of padding or something, maybe.

Incidentally, you’ve mentioned the word “places” twice in the same list in your disclaimer at the bottom. And I think ‘crustations’ is supposed to be spelt ‘crustaceans’ 😀

Matthew · 5 February 2007 at 9:46 pm

Yeah, I haven’t got to the comments styling at all yet, but it’s on my to-do list! And yes, the text is rather small for old posts, but that’s kinda deliberate, and hopefully it shouldn’t be too small to read – the idea again is that the posts are visually made less important. I may still tweak it though if people generally think it’s too small!

Oh and thanks for the tip about spelling, well spotted! You’re worth every penny… 😉

Dad · 6 February 2007 at 12:05 pm

I like it! The text is much easier to read. In design and advertising it’s a known fact that large portions of text can be harder to read if it is white text on a coloured background. The main blog window is fun – I like the way the links at the foot of each excerpt pop into view when you hover over them!

Your sub head “I may not be…” is very faint; could it be a slightly darker grey?

Just an aside, the link to one of the PhotoLounge Extra galleries didn’t work for me (Mac/Safari). I logged in and got this message: Warning: opendir(photos/3D Apartment progress shots): failed to open dir: No such file or directory in /var/wwwsites/ on line 106. Sorry, that folder cannot be found. Please return to the Gallery Manager.

Matthew · 6 February 2007 at 1:03 pm

Unfortunately Safari doesn’t seem to like my Photolounge, or to be more precise the whole MiniGallery script I’m using. It works fine under Firefox, Opera and IE but for some reason Safari just doesn’t load it up at all. At some point I might try to look into why this is happening, but it’s more a problem with MiniGallery than the PhotoLounge specifically.

Thanks for the tips about the greyness of the quote text, I’ll make that a little clearer… this is the trouble with web design, everyone’s computer and monitor is different so it’s hard to tell sometimes what other people might be seeing!

Phill · 6 February 2007 at 1:31 pm

Oh, by the way, I’ve just realised something else a bit strange which is rather random. On Firefox 2 (on both Windows and Linux), the number of comments that you have appears floating to the right of the blog post box. So, on this page at the moment, “4” appears over on the right of the page (to the right of the “in with the new” title), and “comments >>” appears in the place where it should.

I’m not really sure why that is! Maybe another little bug type thing to work out 🙂

Matthew · 6 February 2007 at 1:54 pm

I think that’s because that top panel is currently floated left, so at the moment the comments header (which is still unstyled) tries to carry on straight after that box. The number happily fits in the space, but of course the ‘Comments’ text has to slot in underneath where there is room for it. This is just because I still haven’t got round to styling the comments yet. I’ve been busy trying to work out why the popup menu wasn’t working on IE7 – turns out I needed a background for the container otherwise it wouldn’t stay visible… bit complicated to explain but I’ve been working on it since early last night and only just cracked it!!

Matthew · 6 February 2007 at 2:22 pm

Right, that’s some initial styling done for the comments section. Not particularly imaginative, I’ll probably redo it again at some point with something a little more revolutionary. I really must stop tinkering now and get back to work!! 🙂

Leave a Reply

Your email address will not be published. Required fields are marked *