Sun. Nov 07, 2004
Slightly Warm, Slightly Worn
Do not adjust your browser or monitor, I’ve made some changes around here. Hopefully they look OK on your system, but if they don’t, please leave a comment to let me know what you’re using, and how it appears broken. And I’ll either try to fix it, or tell you, “no, it’s not broken, I wanted it to look like that.” Otherwise, your eyes probably tell you all you need to know. The rest is just geekish detail.
Over the years, when I’ve given this site a visual makeover, it’s usually been due to some software or functionality catalyst. Adding something, switching something, or converting to the Latest and Greatest. Not this time.
My last redesign was back in April when my Movable Type installation went ker-blooey, and I switched to Textpattern. Rather than pound my head trying to force the new dog to play old tricks, I just went for a new look. It had to happen pretty fast. In addition, I was having to “support” multiple versions of archives, because my content had gotten split up so much by various software disasters. So that “redesign” was a rather compromised effort.
But once I got all my content under one roof, and pointed Google away from the old archives, supporting them was no longer necessary. Thus, I could finally change the code on things like Pixel Pile, which appeared via includes in about four different versions of archives. Today, those archives are all under the control of Textpattern, so I had a little new freedom.
But that wasn’t really the inspiration, either. I don’t know what it was. Perhaps the best answer is … The Waiting.
The Waiting is what you often do when you are an independent freelance worker. Clients start off with these things they call “deadlines,” which seem to grow increasingly flexible as they approach. Especially when the independent freelance worker cannot proceed any further until the client provides either [a] content, or [b] approval of work done so far, on which further work is dependent.
I’m not whining (really, I’m not), it’s just the nature of the beast. So you learn to deal with it, and try to be constructive in some way.
A couple of weeks ago, I had a 5 day period that felt like 60% waiting. It was bad. During The Waiting, it started with a simple doodle sketch on an index card. Then during an extended act of The Waiting, I did a rough mock up in Fireworks (where I find it oh-so-much easier to do mockups than in Photoshop). And finally a draft page to straighten the kinks, refine, and try to make it all work.
I’d had a couple of other ideas in mind, but this is the one I kept “previsualizing,” to the point of doodling it out in its first index card form. I decided it might be worth refining for a first of the year 2005 makeover, as I’d planned on doing.
Plans. Silly plans.
Then for some reason, late one Saturday night an hour or so before I hit the sack, I decided to just dump the current site design and replace it with the new, unfinished, barely tested, design. Too tired to have the foresight that this might be a bad idea, it wasn’t until I woke up the next morning, that the panic started.
Jon Hicks: “The Redesign Has Landed”
Hehe. Well, I wasn’t quite as impetuous as Jon, but I did decide “the hell with 2005,” let’s ramp this sucker up. I was simply tired of looking at my existing design. As much as anything, I wanted to try and break out of the long held look of this site; two narrowish columns, right and left, and main content in the center. Tired of it.
But, I was also stuck with a lot of columnar content (like QuoteLog, and Arbitrary Secondaries), all competing for a limited amount of “above the fold” space (the part of the screen the browser shows with no scrolling). And then there’s the pictures. Short of reformatting the way I do whatever it is I do here (small links, short quotes, pictures, and verbose rants, all mixed in a Textpattern stew), I can only reformat the arrangement and presentation.
This (so far) strikes me as more pleasing and balanced. On the home page, QuoteLog and Arbitrary Secondaries are still slightly “below the fold,” but I like them better side-by-side, as it gives them both more prominence. Like Jon, I’ve wavered between a fixed width and expanding layout, but given all this damn content someone keeps generating, I just can’t seem to fit into a 780 pixel wide girdle. So the two side columns are fixed width, and the main column resizes to fit your browser. I have started using percentages for margins on the main text, so that helps slightly as you vary in resolution.
It’s been tested pretty throughly on the range of PC browsers (yes, I’m aware of the gap in the header in Opera, but haven’t pounded that nail in yet), and I’m hoping that since it validates, it is comparable on the Mac in Safari. Let me know if you see any problems on your system and setup.
I also wanted to get away from white, but I’m a muted earth tones kind-of-guy. So I stress tested a color palette and some background textures at 16 bits and 32 bits to make sure they remained subtle and not glaring. Slightly warm and slightly worn was the goal. Subtle enough in places that I had to Windex my monitor to make sure I was seeing background texture and not screen grime.
In terms of code, it’s a bit less verbose, but slightly less semantic, in the purist sense. My test page (an average entry) went from a 13 second load at 56K to 12 seconds with the new version. I could strip it down further, and use lists in a couple of places that I’m not (with some far more complex CSS to achieve the current effects), but I haven’t made time for that yet. I’ve still got a bit of tweaking to do, and missed spots to be caught.
But it’s basically the same old content in a new wrapper. The only thing really gone from the front page is Blogads. Any fool who thought they might make a few bucks because an independent “swing blog” could have appeal down the stretch has been proven a Pollyanna some months ago. But Blogads are still on the individual archive pages, where I will continue to use them to promote sites or causes of my choosing.
Published 01:20AM, Sun, Nov 07 2004
Category: PhotoDude Dot Com
Previous: «« Election Amnesia ««
Next: »» One Murder, Many Ripples »»
Peanut Gallery
MT does still power those three individual blogs (Pixel Pile, QuoteLog, and Arbitrary Secondaries) and their archives. Textpattern just pulls it all together (via includes).
And in this case, “The Waiting Is The Productive Part,” as I almost launched this redesign before that “waiting” job completely wrapped and billed.
The three-column layout with the two narrower columns side-by-side is an increasingly popular layout, and justifiably so. It’s a nice break from the one-big-column-with-one-narrow-column tradition. Though I browse most sites through the RSS feed, your site has excerpts in the feeds (or at least the one I’m subscribed to). You designs, since starting reading whenever-it-was, have always been an improvement over an already pretty layout.
This is no exception.
It looks fine in Safari, essentially the same as in a Mozilla-based browser.
I like the new color scheme, layout too. The previous two side panels used to seem a little scrunched to me. I guess it’s the same content, and it may be optical illusion, but the one side panel seems easier to read now, to me.
Richard, that’s the reason I only put excerpts in the feed. I figure I give people enough to know there’s something new and see if it’s of interest, but if they want to read the whole thing, I prefer they come to my site to do it. Selfish that way.
Thanks for confirming the Safari view, Matt. I usually assume that if it validates and looks as desired in Firefox, Safari will render it OK as well. But I know there’s sometimes unexpected quirks.
And Mr. Turner, I’m glad you find it more readable (the overall goal throughout), but by now you should know, optical delusions are our specialty.
Looks fair and unbalanced to me.
The panoramic aspect of the Photodude labs insert at the top right is a nice touch for the western landscape I was served on this visit. Makes the page appear even more spacious, and opens up some possibilities for better display of other images. Nice touch.
It’s beautiful; probably the best looking blog I’ve ever seen.
You’ve really outdone yourself this time.
I Like it alot, especially the colors and column set up. Only one stylistic problem with it: I think the blog entries would be more appealing on the right, with the links and pics and things on the left.
But I like the two columns on one side. I might try that.
And if you’re really having problems with clients making you wait, e-mail me and I’ll give you some err… motivational ideas from law land.
phaTTboi: “Looks fair and unbalanced to me.”
By golly, that may be the genesis of a new tag line (like I need one): “Fair and Unbalanced.”
Paul: “It’s beautiful; probably the best looking blog I’ve ever seen.”
Well, thanks for the kind words, but you (and your browser) really need to get out more.
Emcee: “I think the blog entries would be more appealing on the right, with the links and pics and things on the left.”
Well, being left handed, that feels backwards to me. Purely a subjective thing. This is just the arrangment I previsualized.
And as for waiting on clients, it’s really just the nature of the beast most of the time. I’m just one guy, and even though I’m ready to go, the content/approval process often involves several people above me. Plus, we deal in different time frames. It’s the interface of the corporate world with the freelance world; at 6:30pm, I figure it’s possible I might still get that e-mail I’ve been waiting for … while they’re at home having dinner.
The upside of it is … I’m at home, too, and have been all along.
I agree with the thin columns on the left hand edge… they’d match with the Moz toolbar I’ve already got over there.
I see a texture problem, though. I’ve got Moz 1.7.1:
The thin columns have that sort of earthy tone you were talking about, blended to a texture along the right edge. The problem is around the content for the “Search” column. Where you have content, there is a ‘smooth to textured’ pattern for each column, so that the texture abruptly ends at the search column’s righthand edge and the blending begins again for the rightmost column. Furthermore, at the bottom of the Search column’s content, that texturing stops happening. The effect is of a squared off block of texture that doesn’t continue down through the rest of the page. There’s even a little dashed line to mark the bottom of the google ads box.
IMHO, the ‘smooth to textured’ blend should extend across the whole righthand border, as it does below all the column content, and not draw attention to the ‘column-ness’ of the right side, as it does where the content exists.
Otherwise, I think it’s great!
Thanks, Tony. The blend of textures is a bit difficult, since people’s monitors are set all over the place on brightness and contrast. You’re probably right that I should make it one continuous background file, to eliminate the bad transition you’re seeing, and have it bleed to the bottom of the page. But I do like having two mostly distinct columns within that texture. I’ll have to toy with it some more later today, to try and find a better compromise.
OK, the sidebar texture has been tweaked, and now extends consistently to the bottom of the page. I kept the two fairly distinct columns, but tried to improve the transition between them. And adding a little subtle schmutz to the left edge didn’t hurt, either.
Oooo, it’s a dirty web page.
Reid, from what I’ve seen, there are people who make pretty websites that are an absolute disaster in terms of usability. They hide their content behind a ton of crap that, while pretty, serves no purpose. It annoys me to no end.
What I like is that you’ve made your site pretty while maintaining focus on the content, which is what I guess most people come here to see.
Reid: Yeah, that’s MUCH nicer in my browser. The transition before was really abrupt, especially where the google ads ended.
Nice.
Recent Comments
- Stanley (Is That Really Amish?)
- John (Falcons Explode Expectations)
- mark (Is That Really Amish?)
- Jessica (Is That Really Amish?)
- Reid (Grandpa is Once Again Astounded By The Interwebs)
- elburro (Grandpa is Once Again Astounded By The Interwebs)
ReidStott.com
Photography
by Reid Stott
A decade of web design experience. Two decades of photography experience. All available to you, and your project. View my portfolio online, then let's talk about your needs.ReidStott.com
Reid, your little footer still lists Movable Type as powering three-fourths of your content. (Hey, I’ve been an editor, and you asked…) Otherwise, I like the look. Of course, you remember what Tom Petty said: “The Waiting is the hardest part.”