Growing a Website

Today, I am doing something different. For a while, I’ve wanted to build a personal website. Procrastination and perfectionism always got in my way but, today, I have decided to “take the plunge”.

I’m attracted to the idea of publishing my thoughts and what I learn so I can:

• Solidify my experiences
• Teach others (if possible)
• Get feedback from my peers

Thinking it over, an idea occurred to me. What if I only include what's necessary right now? Focus on a great reading experience and nothing else? Could I grow a website?

It makes sense. If I want feedback, I must respect those giving me feedback. If I want to teach, I don’t want to distract. If I want to solidify my experiences, how does anything but what is necessary help? Ultimately, there is less to procrastinate about.

My plan

I want to keep things simple. To do that, I must set rules for myself. I will veer off course otherwise.

Goals

My goals are simple:

• It must be readable. The primary purpose of this website is to be read. Nothing else. A relentless focus on the reading experience is the priority.
• It must be focused. Everything must serve a purpose in support of the first goal. This includes content, UI and tools.

Eliminations

The goals lead to some interesting eliminations. It surprised me how much I thought I needed can be stripped away.

• No navigation (yet). Right now, this is the only page. I do not have an about page because I don’t think people want to know about me. I don’t have a contact page because nobody has yet tried to contact me. If the need arises, I will adjust.
• No social widgets. It must be readable. Social widgets do not help with readability, only sharing. If my goal was marketing, maybe. In any case, social widgets add clutter and impact load times.
• No comments. News aggregators and social sites provide great support for comments. They do not aid the reading experience and, if anything, impact page performance.
• No adverts. It is unusual for personal websites to feature adverts but I feel it must be said. Adsense and friends kill the reading experience for short change. It is cheap and I will never do it.
• No tracking. This is difficult for me. I live and breathe this data. The insights could help improve the reading experience. Unfortunately, a cookie policy hinders the reading experience.

Promises

I promise I will:

• Ensure my writing is the highest quality I can produce. The reading experience is, above anything else, about quality writing.
• Maintain readable typography. Second to good writing, typography is a cornerstone of great reading experiences. Typography can, and does, render good writing unreadable.
• Maintain excellent frontend performance. There should be no reason for poor performance, especially since I’ve cut away so much. Good performance is a prerequisite for a good reading experience.
• Maintain a disciplined stance on readability and focus.

I am not a great designer, developer or writer so I must also promise to consider feedback at every step of the way..

Implementation

Tooling

I considered using Jekyll. Since I have don’t have more than one page at the moment, I don’t think it’s necessary. Perhaps in future a static-site generator will help.

I also considered using SASS. Again, I don’t think this is necessary. I intend to keep styling simple. SASS would only encourage style complexity.

This page is a hand-crafted HTML file with a handcrafted stylesheet. The source you can see is the source exactly as I wrote it.

I may consider using Markdown in future.

Styling

I’ve used a mobile-first approach. It is far easier, in terms of code and experience, to design for mobile first and then work outwards.

I’ve used two web fonts; Libre Baskerville for headings and Open Sans for the body. The clear contrast between headings and body text helps more than the performance gain from using only one font.

I’ve used basehold.it during development. This handy tool overlays a baseline grid over your page. Baseline grids are a bit of a pain in CSS and this tool gives you a good visual of how far you’re out.

I have used an 18 pixel body size, using a perfect fourth ratio for headings from type-scale.com, another great tool for generating type scales.

I have used Normalize.css. I want the experience to be consistent, at least.

The future

I hope this won’t be the only page forever. Given my habits, I can’t guarantee otherwise. It will, at least, remain true to the goals.

When, or if, I write something new, the new piece will become the front page. I will create a link to the previous page and vice versa. I think, even at that point, a navigation would still be unnecessary.

If people have a desire to get in touch, I may introduce a contact page. I will link to this at the bottom of each page so it doesn’t distract.

I enjoy programming and I do intend to write about that. A code display widget may help there. I’m not sure so sure about using embedded gists. Performance is okay but a plain solution is better.

The best conclusion for me, however, is that I have taken the first step. I have, for a change, defeated procrastination. Well done me.