Sans Style

If you’ve vis­it­ed my site (as opposed to read­ing only via feed read­er) today, you may have noticed that the site is very, well, naked, stripped down to the basic style includ­ed with The­sis.

I did that because I was get­ting a lit­tle sick of the pre­vi­ous blue-themed cus­tomiza­tion that I was run­ning here. I know I’m no design­er, and those styles were sim­ply my best attempt at some­thing oth­er than the default. How­ev­er, as one of the pil­lars of the The­sis com­mu­ni­ty, I think my per­son­al site’s style ought to be just a lit­tle more impres­sive than that.

So I stripped away the pre­vi­ous style so that it could no longer sit there lookin’ all mediocre, found I site whose style I could shame­less­ly steal base my own entire­ly orig­i­nal code off of. And I’m ven­tur­ing forth into areas I’ve nev­er tread before as an ama­teur design­er — using The­sis’ full-width frame­work and a healthy dose of CSS 3, for example.

Oh, and the pri­ma­ry col­ors will be pur­ples and pinks.

I also make no guar­an­tee that the site will look decent at all in any ver­sion of Inter­net Explor­er, as usu­al. My Win­dows comp — a Dell of less than two years of age — takes over twen­ty min­utes to start up, and I’d rather just let it rest in peace. I’ll be test­ing the style in Fire­fox, Safari, Omni­Web, and oth­er Mac browsers. My faith might be his­tor­i­cal, but my cod­ing style does­n’t have to be.

Some things that I’m doing for this redesign:

  • I’m going to be serv­ing as much sta­t­ic con­tent as pos­si­ble from a sub­do­main to allow users’ browsers to down­load more at once. I don’t yet have enough traf­fic to jus­ti­fy using (& pay­ing for) Ama­zon Cloud­Front (which Dreamhost sup­ports with just a few clicks) or some oth­er con­tent deliv­ery sys­tem, but hav­ing the con­tent already seg­re­gat­ed on a sub­do­main will make it that much eas­i­er should I ever decide to upgrade in the future.
  • I’m orga­niz­ing my cus­tomiza­tions bet­ter as I plan on releas­ing my The­sis cus­tom files (via a Cre­ative Com­mons license). I’d like to think that at least some of what I’m doing will be inter­est­ing or even use­ful to others!
  • I’m re-think­ing which fea­tures of The­sis I use. Sure, the mul­ti­me­dia box is a great fea­ture, but do I real­ly need it, at least in its cur­rent imple­men­ta­tion? Like­wise, I ditched the The­sis nav menu entire­ly and used a great­ly trimmed down, hand-rolled menu. Yes, I lose the abil­i­ty to cus­tomize it via Word­Press’ back­end, but does that hurt my feel­ings? Nope.
  • I haven’t start­ed on this yet, but I want to make my site more inter­est­ing to vis­i­tors, espe­cial­ly first-timers. I’m eye­ing a num­ber of plu­g­ins which will help to do this. I may be strip­ping a few plu­g­ins too. Along with releas­ing my cus­tomiza­tions, I guess I could share a list of which plu­g­ins I’m using too.

And there are prob­a­bly more, they just aren’t com­ing to mind right now. And I know that all this has prob­a­bly been a bit bor­ing, so I’ll leave you with a sneak-pre­view of the new design. Keep in mind I’m active­ly work­ing on this so the final result might change quite a bit:

Sneak Peek

Bonus points if you can iden­ti­fy the site which has inspired me. ;)






11 responses to “Sans Style”

  1. andrew Avatar

    Dude, I’ve got­ta say I’m excit­ed to see the final prod­uct. You always do good work so it’ll be inter­est­ing to see what you come up with next. And yeah, bonus points are not in my future. I’ll save that for anoth­er commenter.

  2. Bart Gragg | Blue Collar University Avatar

    Look­ing sharp, Rick…er, well, ‘bare­ly sharp?’ I say in jest. Good for you.

  3. Clarabela Avatar

    I can’t wait to see the fin­ished results. Maybe it will inspire me to start cus­tomiz­ing The­sis on my site.

  4. Michelle Lamar Avatar

    Hi Rick-
    I am sor­ry to leave this on a com­ment but I have an urgent The­sis ques­tion I need to get some pro­fes­sion­al help on right away. Can you please email me at your con­ve­nience? Thank you!

  5. MJ Avatar

    Shouldn’t the ‘3’ in ‘CSS3’ be an old-style numer­al to match the small capitals?
    And there shouldn’t be an apos­tro­phe after clicks in ‘which Dreamhost sup­ports with just a few clicks’.

    Just being very nit-picky…

  6. Rick Beckman Avatar

    Michelle: The sup­port forums at are the quick­est means of get­ting sup­port. Girlie is there quite often. If you need e‑mail sup­port, try [email protected].

    MJ: Quite right about the apos­tro­phe. Thanks. Not sure what you mean about the “3” though. I don’t shrink any oth­er ver­sion num­bers. Maybe I just need a space between it and the product.

  7. MJ Avatar

    What I mean is that in expert typog­ra­phy, if you’re using small cap­i­tals with a numer­al, the num­ber should be an ‘old-style fig­ure’ (also known as ‘low­er-case fig­ure’ or ‘text fig­ure’), some­thing like this: CSS. The type­faces Con­stan­tia and Geor­gia have these num­bers as the default; Adobe Pro fonts encode them in code­points U+F643 through U+F64C.
    (Of course, it’s not a must, espe­cial­ly on the web, but if you’re con­cerned about perfection…)

  8. MJ Avatar

    (And those code­point names should be in small caps and old-style numer­als, but the font doesn’t seem to want to co-operate…)

  9. kristarella Avatar

    Look for­ward to see­ing it! I’m sure I recog­nise the influ­ence, but I can’t put my fig­ure on the name of that site to search for it!

  10. Sandi Avatar

    Like the pre­view colors :~)

  11. Rick Beckman Avatar

    Before I take the style live, I’m gonna give it a crit­i­cal overview for col­or-adjust­ments and that sor­ta thing. Then I’ll put it live and open up for crit­i­cism from every­one else. I want it to be per­fect. :D

Join the Discussion

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

Use your Gravatar-enabled email address while commenting to automatically enhance your comment with some of Gravatar's open profile data.

Comments must be made in accordance with the comment policy. This site uses Akismet to reduce spam; learn how your comment data is processed.

You may use Markdown to format your comments; additionally, these HTML tags and attributes may be used: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

Rick Beckman