New 2014 design – simplification

R-M 2014 Site Design screenshotIn my spare time I’ve been working on a redesign for this site, and I think it’s finally complete enough that I’m comfortable writing about it.

The first thing that should be immediately noticeable is that top to bottom the site’s been simplified. Largely it’s been pared down to a single column. Navigation is tucked away out of site, and there’s no real “sidebar” any more (a few blocks of things follow internal pages, but that’s it).

When I last redesigned the site, I was looking to use the site as a way to play with some of the new (at the time) features of HTML5 and CSS3. As those things have largely become standard across browsers now, and I’ve had plenty of chances to “play” with them, my goal this time ’round was to edit myself.

Self-editing is one of the first lessons we learned way back in my Journalism 101 class, and is a cornerstone of good writing. It is, however, a difficult lesson to practice — both in writing and design. With an infinite canvas, it can be a challenge to pull yourself back and take a hard look at what is really needed and what is just there out of convention, creative construction or just plain laziness.

So, gone is the clutter. Instead of finding fun ways to create bells and whistles, I’ve spent extra time on readability — improving the site’s typography, use of space, and overall usability. Additionally, the site is responsive now, which was a long-time coming really. This means that it should look great on whatever device you happen to be viewing it on; whether desktop, tablet or mobile.

I’m sure more will be chiseled away, and perhaps hastily plastered back on, as I get more comfortable with the new design. And please, if you have any feedback, or notice anything working in a counter-intuitive way (or just plain broken), let me know in the comments.

8 Responses

  1. Ryan, I like the redesign. Since I’m just starting out with html, css and javascript I’ve thought about this stuff a good bit recently. I’m constantly pulling up the page source codes of the sites that strike me as visually impressive. I can waste a good deal of time copying down base16 colors and so forth.
    Still, there isn’t one website that I like more than kottke.org. It’s pure browsing pleasure. It’s so stunningly simple that the format could have been easily pulled of in the 1990s without a lick of css. I don’t think its quite that old but if it was it still works great.
    It doesn’t hurt that jason kottke curates some of the best stuff on the web but there is also zero noise to distract you from the content.

  2. I love the layout. Beautifully responsive. I only wish the menu bar opened from the right in mobile view (as you often see in native apps) rather than from the top.

    • You’re not kidding Steph. I love Medium’s layout, and I borrowed heavily from it for all the reasons I mentioned in the post above — namely, it feels like it just gets out of the way and lets you read. There are some things I could definitely improve though, and when I find a bit of time I’ll be working on those.

Leave a Reply

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

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>