June 3, 2014

Analytics Tip: How Wireframes And Event Tracking Plans Improve Your Business Online

When it comes to building a digital presence, one of the most overlooked activities businesses make is to not optimize their website layout.  Reviewing a wireframe makes such a review possible.

A wireframe is basically a sketch of website hierarchy. To envision it, think of a NCAA basketball tourney bracket, or any other sports bracket for that matter. Now imagine that bracket cut in half and turned north-south like a pyramid. That’s basically similar to what a wireframe layout should be – a bracket of pages that indicates how they are related. To make your wireframe effective, think of each of your webpages in each slot of the tourney brackets, like the image below. The connections are meant to reflect how a website visitor is meant to navigate from page to page.

Adobe Muse Website Layout

This matrix in Adobe Muse is not a wireframe, but does show how pages are connected in a website. This overview can aid discussion about navigation and other wireframe concerns.

Consider the following criteria for website elements, based on a Website Magazine article "Getting Wilde With Wireframes". These criteria determine how a page layout best addresses the overall website experience:

  • Information: When it comes to the product or service represented on the site, does the element "reflect the goals of the user and what tasks a user should take"?  That question needs to be answered for any content that appears on a page.
  • Navigation: Navigation reflects "the degree of interaction that results in the user experience". Optimizing it with a wireframe becomes essential to ensure users to move through the site or app.
  • Interface:  The consideration of how buttons and boxes, menus and text fields will be presented (where and in what general style).

Examining these criteria leads into discussion about inserting analytic tags - the labeling of players, buttons, and other website sections as a conversion action.  Event tracking was explained in this early Zimana post. Since that time, web apps and updated websites have invented new event tracking usages to understand how visitors will interact with website or app elements.

In a past Zimana post on event tracking, the Javascript protocol was added as a script to a website button. When Google introduced its tag manager, accessing the code and control for event tracking was moved from the page to a user interface.  The benefit was no longer having to manually add the event tracking code to a page.

Google Analytics evangelist Justin Cutroni once explained a great usage for event tracking  - he notes how event tracking can be triggered as a website visitor scrolls down to certain page  segments.  This technique can be useful for vertical parallax website design, revealing how content is consumed in analytics reports.

Reviewing the tag concerns can bring forth a better identified purpose for the site, a better selection of supporting marketing, and be easier to install at a website's launch.  It can also lead to early detection of potential website performance issues. For more on page load performance and other website development tips, check out these Zimana posts:


Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram