Jeff Croft

I’m a product designer in Seattle, WA. I recently worked at Simply Measured, and previously co-founded Lendle.

Some of my past clients include Facebook, Microsoft, Yahoo, and the University of Washington.

I’ve authored two books on web and interactive design and spoken at dozens of conferences around the world.

I’m currently accepting contract work and considering full-time opportunities.

Blog entry // 02.12.2004 // 8:51 AM // 13 Comments Design Dilemma

I have a minor design dilemma with this site. I’d really like to have a sidebar. You know, the type of typical sidebar you see on many blogs that includes things like daily links, “what’s playing in iTunes”, blogroll — that kind of crap.

The problem is that I don’t know where to put it. I really like this site’s design and I don’t want to tear it apart. I like the thick vertical bars of color, and while thinning them or removing them altogether would make room for a sidebar, it would also significantly decrease the impact this site has visually. I’ve considered making the main container DIV wider, but it’s already pretty wide. Obviously the easiest thing would be to lose the scrolling DIV layout of this site and use the space below the navigation menu for a sidebar (Jon Hicks does this). However, I don’t think I’m quite prepared to get rid of the “framed” design.

I guess the best thought I have so far is to move the navigation and nameplate to a horizontal bar across the top and use the left-most column for a sidebar. I might give that a shot.

I’m open to suggestions — anyone?


  1. 001 // David House // 02.12.2004 // 10:24 AM

    The left hand column could certainly be thinner, and you could probably squeeze 100px off the main content area.

  2. 002 // Jeff Croft // 02.12.2004 // 10:32 AM

    Thisis pure laziness, but if I took width off the main content column, I’d have to go back through my blog and scale down images that take up most/all of the width (like the iTunes account image I posted the other day, for example). I’m too lazy for that kind of work. :)

    You’re right about the left-hand column, though…thanks for the comments! :)

  3. 003 // chuck // 02.12.2004 // 11:27 AM

    I would do nothing. I look at your website everyday and one of the reasons I like it is because its different than all the others. I love the layout and bold colors.

    I know you really want a way to display those “other things” , but why not try to find an innovative way to do that rather than to shove those things into your already great layout?

    Just my opinion.


  4. 004 // Mark // 02.12.2004 // 1:57 PM

    You could do a Kottke and embed the “sidebar” contents into the main stream of your journal. Initially I wasn’t sure I like what he was doing along these lines, but the more I read his site the better I feel about the idea.

    With the right kind of offsets, the “sidebar” content would be easily distinguished from the primary content.

  5. 005 // John Y. // 02.12.2004 // 3:09 PM

    FWIW, your website is already a few pixels too wide for my creaky iBook with a max display of 800x600 - going any wider would probably make it a lot harder to read your site on anything smaller than 1024x768… so, I’d suggest if you want to add a sidebar, you look into reclaiming the one that’s already on the left and/or narrowing other things… making the whole design wider, as you pointed out above, isn’t really an option.

  6. 006 // Jeff Croft // 02.12.2004 // 3:19 PM

    Thanks for all the suggestions, guys (I’ll still take more, if you have them!).

    Chuck: Thanks for the kind words. I’ve thought, too, that maybe I should just leave it and leave the daily links and goofy stuff to other people. We’ll see. :)

    Mark: Good thought. Maybe I will consider something like that!

    John: Yeah. No doubt. I’ve thought about that. But then I think…n the other hand…since I’m already too wide for 800x600, would it hurt to go wider, as long as I stay under 1024x768? It doesn’t really matter, though — I don’t plan to go any wider, I don’t think.

    Thanks again!

  7. 007 // Brian Ford // 02.12.2004 // 4:20 PM

    What about making the whole site a little taller, and adding a space underneath the journal… ?

  8. 008 // Mark // 02.12.2004 // 7:54 PM

    A footer bar. Now there’s an idea. Scoot the whole display up a bit and tuck a new space for links. Horizontally scroll it ala a CNN or stock ticker.

  9. 009 // Tom // 02.12.2004 // 11:15 PM

    Play around, see what’s best.

    I was thinking what you said at the end of your post. Make drop-downs a la Mezzoblue for non-IE users [I think that’s most of us]) for the navigation bar. Keep everything the same width and the where the navigation is now is where the sidebar can be.

    I like the footer bar idea, too.

  10. 010 // Jason // 02.13.2004 // 7:45 AM

    Maybe you could move the logo out of the left nav and place it above the whole box (another color bar?) — that is the only thing making the left nav as wide as it is.

    With that, you might have enough space on the right.

  11. 011 // OF Jay // 02.13.2004 // 4:25 PM

    If you don’t mind scrollbars on your left column as well you could use an overflow:scroll rule (so that the left div doesn’t dip outside of the container, as is the case when opening up all your menus) and have the toggler roller-upper for your blogroll too.

  12. 012 // ak // 02.13.2004 // 5:02 PM

    how about two new divs; one will be a small image or bit of text under the nav or elsewhere, the second will appear when the former is rolled over.

    the first will be the placeholder for the sidebar and the one that appears will be the sidebar.

    i’m planning on coding something like this for future a tutorial on my site, and this seemed like a good use for the concept.

  13. 013 // David House // 02.14.2004 // 4:39 AM

    Another idea, go the Dunstan way with a tabbed interface.

Tags for this entry
Links in this entry