After years of internal and external lamentation about the ugliness of my blog, I yet again hit the tipping point and started playing around with the layout.
While I’m not going to win any design awards, I was pleasantly surprised that this time around I did not immediately quit in disgust and revert all my changes.
In retrospect, I think it was a) solely from my drastically different approach, and b) nothing I can really take credit for anyway.
What Didn’t Work: Starting from Scratch
Previously, I would sit down and try to divine some magic layout and color schemes.
I would pretend I was a real designer, and hop over to one the color picking tools (based on the color wheel, contrasting colors, whatever), try and pick a completely new (but still black) color scheme, slap around some HTML, and see what came out.
The result was always terribly disappointing.
I could also tell it was disappointing.
I think that, often times, naivety is a blessing when you’re learning, as you don’t realize how bad your results are. So, instead of becoming discouraged, you keep plugging along, until the repetition was made you better.
But, in this case, I’m a user of beautiful (and not beautiful) web sites on a daily basis, so I’m aware of the difference. It was very apparent for my work.
What Did Work: Copy & Extend
Without really realizing it ahead of time, this time I took a different approach.
Over the last few months, I had bookmarked a few websites that I liked:
That I thought looked like how I’d like mine to look: clean, simple, great looking font, etc.
So, this time around, I didn’t start at the color wheels, I started at the Jekyll home page (it’s black), and said screw it, what’s their hex value here? What font is this (turns out Lato)?
With a few simple things like that copied, then I tried to really articulate what I liked about their layout, and then slowly hacked my probably-from-some-other-template HTML/CSS to do kinda/sorta the same thing.
Slowly I had the realization: holy shit, I was learning.
First, a disclaimer: I know this sounds like a completely pompous thing to say. As a explanation, there are several area in my life where I consider myself a very active/“newbie” learner. But lately programming/“Internet stuff” has not been one of them.
Not that I’m a language savant, or assembly hacker, or sit on RFC committees, or anything like that; but just that, in the grind of using imperative/OOP programming basically everyday for 10-15 years…“yeah, I know that”.
So, it was somewhat humbling to remember, “oh right”, a good way to learn programming/webapps/etc. is just go find something else that already works great, copy that, and then extend it.
Learn from best practices. I can’t even believe I’m saying this, it’s so entirely obvious.
But, hey, sometimes you forget.
Make Sure To Extend
As another note, I’ve done plenty of copying of layouts over the years; whether for some of my open source projects (like the spiffy dtonator website, which is someone else’s template), or for work, translating static mockups into webapps.
But copying in and of itself doesn’t teach anything. (At least for digital copying, which only involves a copy/paste/minor changes; I think copying physical movements would be different and actually beneficial.)
For me, it’s once I have an idea of “okay, this does X, but I want it to do Y” is where the mental processes really engage.