It’s been mighty quiet around here at Nuketown, partly because I’ve been super busy at work, but mostly because I’ve been slowly working on the redesign.
My current task is converting the design comps into an HTML/CSS compliant layout. After that, I’ll turn those pages into a functional Drupal 7 theme. The challenge has been that going with what I know, I decided to do the entire site in HTML5 and CSS3 … which means I’m spending a lot of time learning exactly how much I don’t know.
It’s not that HTML5 and CSS3 are earth-shatteringly different — a lot of the key concepts (at least with a simple web page) are the same. The challenge comes with HTML5’s new semantic markup. These are tags like “header”, “footer”, “article”, “section” and “aside” which are designed to give meaning to your markup.
The idea is that instead of just having a whole punch of div tags with IDs like “header” and “footer”, you use actual tags that let your web browser understand that this content is different. This in turn can be helpful for search engines, which know which areas of the site are content rich, as well as for accessibility, as accessible browsers are able to recognize headers, navigation, etc. and present them accordingly.
Cool stuff … but it’s not always as straightforward as you might think. In order to build a site that makes appropriate use of semantic tags, you have to know how the spec things these tags should be used. Some are straight forward — obviously a “header” is going to contain uniform logo/navigation elements for the top portion of the site, while the “footer” does the same for the bottom.
But how do you use article? And should you use the “header” tag inside it to declare where the headline goes (yes, you should). Should you use the “aside” tag for sidebar content (no, unless its directly related to the article). Should you use “section” to display and style the component pieces of your home page? (nope — section is for a discrete chunk of content that has its own header, like the subsection of a page).
It’s a lot to work through — I’ve probably spent three hours researching for every hour of coding I’ve done so far. That ratio is getting better now that I have a good understanding of how HTML5 should be used, but it took a good chunk of November to get that far.
Note that I’m only testing this in Chrome, Safari and Firefox; I haven’t delved into Internet Explorer 9. I want to get the site working with standards first, and then deal with Microsoft’s idiosyncrasies.
Must … resist … Git … puns
At the same time I’ve been diving wholeheartedly into Git, the version control software that’s superseded Subversion in most of my web development circles. Git is a lot more flexible than SVN, and it fits my workflow (at home and at work) far, far better. I love that I can clone a repository, make a whole bunch of commits against it, and then only push back my changes to the master when I’m done. Branching, merging and tagging are far more straightforward than in SVN, and it’s been great for working with other people.
It’s great … except for the learning curve. I’ve been using SVN for a while now, and switching to Git meant I needed to unlearn what I’d learned about version control up to this point. That’s not a bad thing, but it does take time.
The Nuketown redesign has proven to be a great test case for learning Git; while I am working by myself, I have cloned repos on my home Mac, my work Mac, and my web host. Those three repos give me lots of chances to push and pull changes to the central repo on Github … and occasionally resolve conflicts when I forget a step.
My next big challenge with Git will be to put the entire Nuketown web site — Drupal code base, themes, plugins, etc. — under version control. This is a bigger project, but it’s a critical part of making Nuketown as easy to maintain and update as possible. That in turn is what’s going to let me keep publishing the site for another decade.
2012: The Year of the Nuke
All in all the project is going slower than I’d hoped, but I’m learning a lot. My hope is that I will be done with the new site by the end of December, and can re-launch sometime in January. There’s still a heck of a lot to do, but with Thanksgiving break and Christmas break coming up, I think I can pull it off.