Past visitors to this site will note a fresh design update to kickoff 2017. Some changes are obvious (the new header), and some are more subtle (semantic HTML5 tags). In this post, I numerate the design changes, and the reason behind them.

Visual Changes

The most striking changes to the site pertain to the layout. After watching a talk by Jen Simmons on layout design on the web, I realized that my layout could be improved. In Simmons' talk, she discusses the boring, standard webdesign layouts, and suggests ways to make web layout better.

In print media (magzines, newspapers, etc), layout design is known as editorial design. Simmons suggests taking design cues from print media to make the web better. Many of the suggestions involve mulit-column layouts. I've recently updated my questions, projects, and "more" pages to include multiple columns. You can see two examples of multi-column changes below.

However, my side-bar style navigation links interfered with a clean look, so I moved my navigation to the top. However, everyone and their uncle has navigation links at the top of the site. I wanted to make it slightly different, so I put the entire header at an angle, with a bold color background. You can see the difference below.

HTML Changes

My entire website still written in "hand-coded" HTML and CSS. There is no Javascript required for layout, and no 3rd-party libraries. I put hand-coded in quotes because I actually wrote my own custom content management system (CMS). The CMS is very simple, it is a python script that generates HTML. I discuss that further in the about section of my site. Therefore, this fairly major update required only changing a few lines of Python.

I also migrated entirely to proper HTML5 standards. This invovled two steps. First, I moved to semantic HTML5 elements as much as possible (replacing <div id="nav"> with simply <nav>). Second, I ensured that my CMS produces officially-valid HTML. Broswers do their best to fix HTML mistakes, so people often don't notice that their websites contain invalid code (according the W3C standard), but you can use the W3C Validator to make sure any site is valid. You can see that this site is now both error and warning free.

More changes will be coming soon, but until then, enjoy the new look, and check out the source code to see some elegant HTML5.