Monthly Archives: August 2004

Another Redesign (Now it’s My Turn)

In light of the many other redesigns recently, I figured it’s about time I actually implemented my redesign that I’ve been developing for the last month or so. I’ve had this design on my homepage for quite a while, but it hasn’t been ready for site wide implementation until now. The main things holding me back were the menu not working in Opera, and having no SSI set up to include the common features, such as the page header, sidebar, footer and the document head section so that I could easily include stylesheet links.

The colour scheme for this actually took inspiration from Dave Shea’s Proton design. I liked the blue and yellow contrast, but I didn’t want to use the exact same colours. So I downloaded a copy of Colour Wheel Pro, and had a play around until I found some nice colours. Though, I do intend to, one day, produce some alternate style sheets with different colour scheme, but the same layout. I also intend to come up with a completely different layout, but that can wait for a while — this one was hard enough.

I didn’t want to use a fixed width design because for many sites that do, I sometimes wish it were slightly wider, or slightly thinner. But, I didn’t want to go for a completely fluid design because I didn’t want it getting too wide for users who don’t understand about line length, and have their window maximised. So, to get the best of both worlds, because I don’t care much about IE, I decided to make the whole content (including main content and side bar) 80% of the width of the window, the further constraints of min-width: 600px; and max-width: 800px;. With a 250px side bar, this makes the main content range from 350px to 550px. Plus, there is a 5% padding on the side of the main content column. This makes the line length vary from 315px to 495px. This is farily close to the recommended measurements in this Daily Flight article.

For the drop down menu, the initial complication I had was to figure out how to get the borders to overlap. The first difficulty was working out the measurements for widths, margins, paddings and borders. The menus are 33%, 34% and 33% of the width, respectively, of the content column and thus stretch the content stretches when you resize your window. The borders are 10px wide on either side. In order to create the overlap, it required a reasonably complicated addition and subtraction of borders and margins in appropriate places and correct positioning to ensure the overall menu was the correct length, in the right position and the borders overlapped exactly. z-index was used to bring the menu currently being hovered to the front, so that it’s borders overlapped the adjoining borders. The rounded corners were achieved using -moz-border-radius. Of course that means it only works in Gecko based browsers, but until CSS3’s border-radius becomes a recommendation and is supported, there’s no point using it. So, they’re just a bonus for Mozilla users — it’s nothing detrimental to others at all.

After extensive testing and failing to achieve the columns using floats and absolute positioning, I realised that I’m not supporting IE fully for this site. (infact, there is only one IE hack in the entire file, to prevent menu overlapping the content). So, the columns were achieved using the display properties: table, table-row and table-cell. The table-row is redundant, but I had to add an extraneous element to get around a strange bug in Mozilla that caused the side bar to move below the content if either contained content wider than the cell. This was a problem when I launched this style on Net Twits because of some preformatted text, using <pre>, in some articles. There are still some bugs, I’m working on them, and most of them seem to be in Mozilla, and can be fixed by doing a refresh of the page. I don’t yet know why.

The side bar style is yet to be completed, but I’ve applied some very simple styles so that I could at least launch It, and get on with the rest of the site. You can expect to see some big changes to the side bar over the next couple of weeks.

My next problem will be ensuring that everything works in Safari. I’ll be getting a Mac soon, but until then, I’m sorry if it doesn’t all work correctly. If you can help, let me know and I’ll apply any fixes you send me if they don’t break any other browser in the process. (If it breaks IE more, I don’t care, as long as the content is still at least readable.)

Harsh Criticism

Recently, Dave Shea has done yet another redesign. When it launched, he seemed to take a rather defensive stance on his decision to do so, and I didn’t understand why. He should not feel he needs to defend his decisions — it’s his site, and his right to do as he pleases. I now understand from his latest post, it looks like he received a lot of criticism for his previous design, Proton.

I think everyone can agree that there’s nothing wrong with a little criticism when called for. However, there is a line that can be crossed when it comes to being unnecessarily harsh. Some of the comments were quite positive towards the new design, but I’m not concerned about those. I’m particularly concerned about the ones that insult Dave’s integrity. The three, in particular, that I found most offensive are:

“I’m glad he changed it… I was starting to visit less often because some of my confidence was shaken… but it’s been restored now :)”

“I love v5; I can now justify coming back to mezzoblue.”

And finally, the most offensive…

“The new Proton layout isn’t finished yet is it? It’s ugly as hell!”

The other’s tended to be more positive than these, though, as Dave pointed out, the trend is the same.

I’d just like to point out that content is, and always will be far more important than presentation; and Dave’s writing is certainly exceptional. Just because you dislike his site redesign, is no reason to question returning to his site. If presentation is the only reason you can think of to justify returning; then, sadly, you’re really missing out on something good.

Everyone’s entitled to their own opinion, and not everyone is always going to agree. Some people hated Proton, and others (like myself) loved it. Some people will hate the new design, and others will love it also. Hopefully more of the latter than the former, but it’s really irrelevant — it’s not a beauty contest, it’s a blog! It doesn’t have to be the most attractive site. A little criticism can be expected; and, in most cases, is certainly welcome — it can provide valuable feedback that can be used to improve the next time round. However, unconstructive and offensive comments like those quoted above are certainly not welcome.

I applaud Dave for exercising his right to be an individual, to be creative; and to be daring with his designs — he certainly is a talented artist. One whom we should all look up to for inspiration, motivation, and of course thank him for his devotion to his fans (I got a reply to a comment I sent him this morning within 5 minutes! of posting — how cool is that! I certainly didn’t have time to paint a still life while waiting, as he suggested on his thank you page!).