Explaining the design

Quickly now, as it is late (again.) Here are some of the objectives I wanted to achieve with the redesign:

I wanted a place to post shorter but more frequent entries about interesting things I find on my daily rounds of the web.

I wanted a blogroll/siteroll, organized by subject. I also liked how some Swedish bloggersUpdate 2004-1-11: Jag glömde Enblogomdan. have been promoting new and interesting blogging talent. Hence a running roll across the page.

I wanted to have all the newest information above the “fold” of the screen.

I wanted to be more generous in linking out from my site, and give more prominence to readers’ comments and trackbacks.

I wanted to dive into the deep end of CSS and learn it properly. This would entail letting the stylesheet do nearly all the stylingIf you’re using Internet Explorer to visit my redesigned blog, you might be wondering what on earth took me so long — all I’ve done is add a sidebar on the right into which I’ve dumped the usual blogalia. It looks boring, frankly. Well, that’s because I no longer want to design for IE, at least not for free and for me, so if you use IE around here you will be served a dumbed-down version — it’s perfectly acceptable, it lets you read my posts, but that look took as little time as possible and without any pretence of creativity or innovation. (Actually, it breaks rather badly in IE/Mac.).

I wanted to let my preferred components dictate the page layout, and not vice versa. Among other things, I made use of the newly found ability in CSS 2.1 to style adjacent columns of equal height, as demonstrated by Roger at 456 Berea Street.

I wanted to avoid the overlong page, with sidebars that go on forever. The solution I came up with is to have the most important navigation elements but a click away at all times. Hence the floating “About” layer and search bar. I stole Dan Cederholm’s javascript from SimpleBits. It’s still a bit rough (I’d prefer the ability to toggle styles, but have not explored this yet) but it seems to work in most browsers. (It’s turned off for Internet Explorer).

It’s going to take me a while to get used to this new look, trim what doesn’t work, polish rough edges, do the other templates, etc… In the meantime, do tell me what your least favorite part of this redesign is, or if it breaks in your browser.

26 thoughts on “Explaining the design

  1. Wow, it felt quite nice when I clicked to the permalink for the post and got the old, simpler format back. The new one’s ever so complicated! But I’m sure I’ll grow to love it. Are you going to be serving RSS feeds for your smaller links and whatnot, or just for the longer posts?

  2. It is rather swish looking. My least favourite part is the blandness though- I liked it better when there was more colour and when there were photos(ages back)

  3. Ahhh now I understand. Sorry I suffer because I have IE…. I am sure it is not bland at all.. I imagine an explosion of colour and movement would await me if I could find another browser

  4. Felix, The permalink pages will be simpler in the new model too. It’s just that the main page now carries a heavier burden, seeing as it caters to three blogs, not just one.
    Yes, RSS feeds for the others are forthcoming.
    Kartika, go on, just do it.

  5. I like the ideas behind the remodelation Stefan. Would not mind a slightly more artistic font though. Read in NRC Handelsblad yesterday that a quarter of the Americans that use the internet read blogs (incredible!). I have no idea what the statistics for Sweden or Europeans are. But I am glad that there are bloggers that take themselves seriously, like yourself.
    Do you still blog on request? If so, I would like to hear your opinion on the ethics of blogging, should bloggers take upon them the responsibility to only publish what is ‘fit to print’?

  6. WOW so much better! Have been looking at it with IE at work but that now that i have seen it on firefox your true genius has been revealed! i love it!

  7. Stefan, looks great, although -despite Polselli’s recommendation- I think the colors are a bit much, I realize I’m not on the cutting edge of these sorts of things, and will regret that comment in about nine months time.
    And I don’t know if it was intentional on Stefan’s part, but I think the MT site search doesn’t allow you to search comments, whereas Google does (this is something we might want to consider for comment-heavy MF, as well).
    I’d be wary of those blog figures, Hanneke- I saw them bandied around a while back, and they seemed inflated to me…

  8. Actually, I only picked that particular brand of orange from his list, the green is a complementary color, chosen using this.
    As for the Google search, I was never really happy with the search technology MT provides, but only because Google does it so much better in comparison. The one downside is that Google visits a few times a month, so the most recent posts might not be included… but then, you’re likely to be searching for old stuff, not what’s on the front page.
    Now on to MemeFirst for a little overhaul, mainly in the backend code.

  9. I appreciate the work you’re putting in- if I can make one suggestion: swith the “Sources” and “Archive” sections in the left-hand side column: my name has fallen below the fold! (and yours as well, if that influences your decision any)

  10. Indeed Mike! Each and every statistic should be examined suspicially anyways. This particular research was done by Pew Internet and American Life Project, are those familiar to you?

  11. * suspiciously
    (sorry, I promise I will learn to spell one day, especially because wrong English spelling has tremendous consequences for the meaning of the word, pfff)

  12. Pew is a well respected research group, for what it’s worth. I’m not going to qualify/quantify my suspicions- I’m just going to be the doubting Thomas of the internet age…
    Stefan you should really let us comment on the interesting links/noteable sites (what differentiates the two?)- I’m drooling over the Mac Mini, as well. Although something better than AppleWorks is the real score for me this time around.

  13. Ha-That’s the last time I carpe the diem at your behest Stefan. I downloaded the thing and then it would not connect me to any site. It kept saying “connection timed out”. At least IE does not do that….

  14. Oh wait, Netscape works… but the toolbar does not float.
    I like the other “avant garde” colours such as FF0066 or B700B7- groovy.

  15. Housekeeping

    I’m doing a bit of cleaning up. Forgive any ugliness you might happen to come across. Jan 12 update: Grgrgrggrgrggr. Stefan, right about everything you are not; 100% correct about the evils of PC browsers you are….

  16. First, I hope it’s ok to comment on the design. Otherwise, remove this post and email me personally. 😉 This is a strict design comment having nothing to do with the excellent content.
    As much as I love the colors of the new design, I must comment on the IMHO overly complicated top of the page. It suffers from two important problems.
    1) It draws too much attention to itself. It draws attention from the important stuf further down the page (the posts). It is a second or third priority area. In this aspect (I hate to say this) the IE version is in fact better. It’s usually a misconception of the site owner, that people never scroll for content, they do, and they don’t really mind.
    2) The fact that the white text boxes are the same size makes you instantly think of them as a design pattern rather than important bits of texts. This is a common example of design over readability.

  17. Jocke, I’m so glad you brought those points up, now I have an excuse to pontificate some more….
    Your concerns were my concerns too.
    re 1): It’s precisely because the “important” content, my longer posts, are not written daily, that they need to cede some room to the more frequently updated bloglets. I don’t know precisely how often people visit my sites, but for those who visit once a day the most important content will be the newest, and most often that will be in those two top rows. Or, you can think of them as appetisers.
    Furthermore, the lines of the design direct the eye to one specific spot on the page, and it is right where the longer posts begin. At least my eye.
    2) There is indeed a risk that the design breaks if individual posts are of drastically different lengths. But this should be remedied by two solutions:
    A) I have an outlet for longer posts lower down, and medium-sized posts on MemeFirst. These bloglets should be succinct nuggets of prose. It’s a constraint I’m happy to operate under, much like how writing within the constraints of the rules of a sonnet can produce some great stuff too.
    Meanwhile the short orange headers act as markers for the eye as it scans for new content.
    The other option (and I played with it) is to make the entire top white or gray, draw a line across the top of the four columns in each row, and let the 4 pieces of text drop off that. It’s still something I could turn to if I tire of this look (or there is an avalanche of support for your critique) but in the end I opted for a very light box motif. There is something bauhausy about it that I like. I like how the structure of the site is overtly made to be a collection of its components, nothing superfluous. In this context, the boxes help define the components and the spaces they inhabit.
    Boy that sounded post-modern.

  18. OMG! You broke the internet! When I click on one of the trackback links on the home page, I discover you’re opening the link in a new window! Come on, Stefan — you know full well that’s bad and evil. If you want me to, I’ll explain why at great length, but I’m sure that won’t be necessary, no?

  19. Stefan! Anyone who wacks me with post modern arguments deserve to “win”! 😀 I will start to really try to use the top of the page like you intended to.
    One thing that strikes me is that youre trying to do something kottke-similar with your quickposts in the top, only he does in between the more regular entries/posts.
    Well anyways, keep up the good work!

Leave a Reply

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