Redesign

When I put up the previous design of the site I did so because the one before it didn’t represent who I was anymore. It was blue, orange, yellow… it reminded me of a clown site. After a couple weeks of playing around I came up with the layout to the right.
Previous Layout
Less than a couple days after that I began to blog. Let me tell you, that layout is not ideal for blogging. For one the graphics in the background distract from the content, the colors didn’t work well, and the font was too small. How can I blog if the site doesn’t read well? White space, kerning, line height, things like that were hindering the site. Although all of the above had been altered by me, they had not been altered very well. They lacked the correct ‘numbers’ to make it work. My headers needed more space, my lines needed less space, and I needed a good way to present code to the viewer.

New Design

So after a couple days of looking at blog/news sites to figure out what made them successful I settled on a couple things to consider when redesigning:

  • Main headings need more padding below than subheadings
  • Headings don’t need to be bold, they can be a larger font size, italic, a different color… bold isn’t the only option
  • Subheadings should be smaller than the main headings, obviously. In addition I found that italic subheadings seemed to work best to differentiate from the main headings and body text
  • Spacing between the lines should be around 150% of the text size.
  • Font size shouldn’t be small because you want to conserve space, the goal is to have your content read.
  • Space, space, space. Don’t be afraid to leave some space. In my early designing days I felt like every pixel had value and therefore there should be no whitespace. As I looked over other sites though I realized I enjoyed being on less cluttered sites, and I don’t think I am alone in this feeling.
  • Lastly, if I was going to be posting code on my site, I needed to get a good syntax highlighter. I chose to implement SyntaxHighlighter, I encourage you to check it out if you haven’t.

So after all my research and tips I ended up with this. So if you see anything that could use some work or have any suggestions let me know I am always looking to learn something new.

Some of the articles I did read while researching more about typography were:

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=""> <s> <strike> <strong>