Thripp.com Redesigned

By Richard X. Thripp at 2008-08-16T10:09:25Z in News, with these tags: blogs, css, design, header, internet explorer, links, pages, posts, sidebar, thripp.com, jump to comment form. 370 words.

I spent the last six hours working on a redesign for Thripp.com. While I normally deal with programming, this time it was all CSS (Cascading Style Sheets). Check this out; the boring old design:

And the bold new vision:

What do you think? I like it a lot. The new header and borders solidify olive green as the Thripp.com color, and the borders are pleasing to the eye for containing the content. The sidebar’s text isn’t so squished, links are nice and bold there, visited links go brighter green, the header is white on dark olive-green, and the header titles are

big and bold

instead of small and subdued. Outside the body, the background is light green instead of bright white.

This is a fluid layout. It’s optimized for 1024×768, but larger is fine. I browse on my 1440×900 monitor most of the time. The body of the text doesn’t go above 800 pixels, because it’s hard to follow lines of text if you go bigger. But unlike other sites which hinder readers with small monitors or ones who don’t browse full-screen, Thripp.com does not. You can read your favorite blogs comfortably even at 640×480.

This is the first redesign since I launched Thripp.com (then richardxthripp.com) three months ago. Good design makes everything enjoyable. I just found that out. Hopefully this one is a good one. I’m enjoying it over at Brilliant Photography.

Check out the stylesheet if you want to see my technical work. This was a lot of trail and error for me, because it’s my first serious work with web design.

Also, the ads now look the same in Firefox and Internet Explorer. Before, they were 19 pixels too high in Internet Explorer. Really, they’d be butted up right against the tags list. The ad is a paragraph floating with CSS, but I can’t get IE to respect the margins. Can you believe this is how I fixed it?

<!–[if IE]><img src=”http://lib.thripp.com/images/shim.gif” alt=”” width=”1″ height=”19″ /><br /><![endif]–>

Talk about a massive kludge. Conditional code and a spacer GIF. So old-fashioned. It works, so I’m happy.

Enjoy the new layout. I’m open to comments and suggestions if you don’t. This affects not only the 181 Thripp.com blogs, but also DaytonaState.org and VicAndHelen.com, which are part of the Thripp.com network.



One Comment — continue the discussion. RSS feed for this entry.


Have no fear — commenting is here. Comments RSS feed.

These HTML tags work: a href, abbr, acronym, b, blockquote, code, em, i, strike, strong, u. You will be emailed if anyone replies to your comment. Gravatars work here. Thanks for commenting!