Saturday, June 25th, 2011

Earlier this week, a post appeared on Hacker News: How to Actually Make Text Look Interesting: Minimalist Web Design. It struck a chord with me.

It should be clear that I am not a designer or an artist in any way. I have no talent, little taste, and I only know the names of sixteen colors. The best that can be said is that I know what I like; and what I like tends to involve minimalism, typography, and random bits of spot color. You could say that I have been heavily influenced by Ikea.

So, as I was reading this article, I started wondering: could I do it? Could I create a simple design that emphasizes the things that I like about white space, typography, and color? Or would it turn into a huge mess as if I told a ten year old to go crazy in a type foundry candy store?

I was pretty unhappy with my present theme, a WordPress built-in called Clean Home by MidMo Designs which I had customized a little bit to suit myself better (screenshot: clean_home_jun_2011.png). Since a weekend was coming up, it seemed like the perfect opportunity to take the things I like about Clean Home (I’d chosen it, after all…) and get rid of everything I didn’t like. And maybe explore typography a bit more than I usually do.

I figured the biggest challenge would be to show restraint. When choosing typefaces, I have a tendency to make it look like my fonts folder threw up all over the Internet. I think I mostly did okay in this regard, though I’m sure that any profession designers in my audience could find plenty of fault with my choices. My only defense is that I know it could be worse (*cough* MySpace *cough*).

Visually, I think this new design is certainly an improvement over the old one; but the biggest win is that I started with a blank php file and did everything from scratch. So the markup (and bits of PHP needed to make WordPress go) is as simple as the site itself is. I don’t use widgets, so my theme doesn’t include any support for them. I can hardcode the site title (which let me add that little bit of color to the .me) and don’t need to worry about pulling it from the database. I didn’t need to try to work around WordPress’s comments support; I could just put Disqus in where I needed it.

The markup is simple, so there are only about 20 CSS classes (and 11 # identifiers). Figuring out why any given element is styled is simple and I don’t need to turn to Firebug. My biggest problem with using off-the-shelf themes (especially the free ones) is that I can never figure out how to customize them. There’s random bits of PHP everywhere, hundreds of CSS selectors, and it’s always hit or miss if I can figure out where I need to make my changes. Usually, the best I can manage is to get my stuff somewhere close to where I actually want them.

That’s not really a problem with this theme. So I’m pleased about that.

I do have one confession to make, though: there are two places where I wanted things to be side-by-side but floats were driving me crazy and not doing what I wanted. After about half an hour, I just did those two pieces with tiny little tables. Given the amount of grief I saved myself, I don’t see any problem with that at all.

blog comments powered by Disqus