December 8th, 2010

A new blogging platform for Onegeek: WordPress + HTML5

The OneGeek blog has now been ported to use Wordpress and all of the Web’s semantic goodies: html5, Microformats and CSS3.

— Matthew Fellows —

WordPress

So it has been done. After some serious culling of content, deliberation of style, design & procrastination I’ve ported this blog from Joomla to WordPress – and couldn’t be happier.

Whilst Joomla has a well built, object-oriented, MVC design, I couldn’t resist the elegance, style, user-friendliness and fantastic community associated with WordPress. It makes me want to publish. The plug-in community is fantastic and the documentation is brilliant.

I may well regret it in the future when globals are no longer supported and WordPress doesn’t have an update to remove that dependance but for now I’m blissfully ignorant…

A new look

Whilst I’m no designer, I’ve gone for a clean, elegant, typographical look for the new site to emphasize what this site is about: content.

Add in semantics: HTML5 + CSS3 + Microformats

I’ve also decided to use HTML5 and CSS3 heavily in the new design along with hcard and other Microformats. Given that my audience predominantly uses Firefox, Chrome and Safari, my task was relatively easy, however it also works with IE7+8 with the help of Remy Sharp’s HTML5 enabler.

To infinity, and beyond!

To get the most out of this excercise, I decided I would do what I could to make it high-performance.

With a careful CSS\JS compression cycle built into my standard deployment deployment scripts (another post\project for the future), some nice caching rules implemented in the .htaccess file, heavy use of sprites and the fantastic WP Super Cache plugin I was able to achieve the YSlow reading A (93 \ 100) and Google PageSpeed score of 85. Note that I lost marks for not having an Expires header, ironically, for the Google Analytics script and for not using a CDN.

Performance results

I also tested this from US and AU servers using LoadImpact and Webpagetest. The following are 3 independent tests of the OneGeek home page:

LoadImpact (US):

  • 1.88s (I assume this figure is document loaded, not document ready)

WebPageTest (AU):

  • 2.782 Document loaded
  • 3.010s Document ready
  • 0.702s Subsequent request document ready

WebPageTest (US)

  • 1.405s Document loaded
  • 1.840s Document ready
  • .806s Subsquent request document ready

In the end for a blog running on a super-cheap, massively overlcrowded US based hosting provider, I was pretty happy with that.

Time to get publishing!