This series of blog posts will look at each of the major parties’ websites in detail, picking apart their web analytics strategies, design and code. We’ll be going over one website per week, so keep checking our website or subscribe to our Twitter feed to be notified about updates to this series of posts.
It’s high noon, folks. Harper, Ignatieff, Layton, May – turn around, then walk straight ahead twelve paces. This here’s a showdown!
This week, we take a close look at the campaign website of the…
The Liberal Party of Canada
http://www.liberal.ca
Google Analytics Performance
The Google Analytics script is properly situated in thetag according to best practices, and is the proper and current asynchronous version.
The code is properly formed and not duplicated. Furthermore, the Google Analytics tracking code is customized to produce a much more streamlined tracking code that demands less of client-side system resources while doing just as much, if not more.
The Liberals are employing advanced Google Analytics features such as _setAllowLinker, _setDomainName and _setAllowHash to track visits across separate domains as though they were all part of the same domain.
Either they have a very, very bright kid volunteering for them, or they have hired a web development and design firm that knows what they’re doing with Google Analytics
or a separate firm coordinating their analytics strategy. Just about everything is being done right.
Design Performance
Just to the right of the main navigation bar is an easily noticed “Donate Now” button, shaded to appear as though it is rising out of the page. This is a nice, commanding and clear call to action. I’d love to see the Liberal party’s statistics on the donations generated by their website vs. those generated by the Conservatives’ site. It is not known whether they’re using Google Analytics’ e-commerce functions to tack donations, as we would have to make a test donation to expose that code.
Like the donation button, most of the main navigation items are solid calls to action in their own right, and are repeated further down the page under the heading “Make a Difference”.
The Liberals are also taking full advantage of Facebook’s Open Graph meta tags to ensure that when their pages and articles are shared on Facebook, the correct accompanying image, title, description and URL are displayed along with them.
One thing the Liberals may wish to improve on is that they lack a Facebook “Like” or “Share” button closer to the main navigation bar or on individual articles in their sliding “featured items” banner. Currently, these are hidden below the fold in the “Discover the Liberal Party of Canada” section.
The overall layout appears to adhere to best practices, separating the presentational, behavioural and structural layers into CSS, JavaScript and HTML respectively. |
The Liberals could potentially improve their SEO performance, or at least the clarity of their search engine profile, by finding a way to replace text rendered as part of images, especially in their navigation buttons, with ‘real’ text actually embedded in the HTML. Machines cannot read text in images easily, and search engines can’t do it at all.
Code Integrity
The W3C HTML Validator reported 177 errors and 14 warnings when the page was validated as the version declared in the tag (XHTML 1.0 Strict). When re-evaluated as HTML5, the errors were reduced to a count of 49, suggesting that many of the previous errors were in fact the result of using more advanced code despite using an archaic DOCTYPE declaration.
The Liberal website had 166 CSS errors as reported by the W3C CSS Validator when evaluated for compatibility with CSS 2.1. On closer inspection, however, many of these errors are in fact due to the use of more advanced CSS 3 properties which are not yet taken into account by the W3C CSS validation tool.
The Final Verdict
A-
The Liberal site does just about everything right as far as Google Analytics is concerned. Some improvements could be made to the overall site design, depending on the party’s objectives and willingness to exploit social media.
The Liberals are, laudably, using more advanced and current code and development principles, opting for more HTML5 and CSS3 integration.
Still, improvements could be made, especially as many of the main navigation items, as well as the party name, are unreadable by search engines because they are rendered as images rather than as real text.
In our next entry for Part 3, we’ll have a look at…
The New Democratic Party of Canada
http://www.ndp.ca
And in Part 4, we’ll round things up with a look at the oft-forgotten …
Green Party of Canada
http://www.greenparty.ca
In Part 1, we looked at…
The Conservative Party of Canada
http://www.conservative.ca
Stay tuned, and subscribe to our Twitter feed to be the first to hear about updates to this series of posts!