Use Google Analytics To Improve Your Design and User Experience

Disclaimer: It took me a couple of weeks to put this article together so some information about my site may seem “mismatched” (traffic stats); however, all of the advice still applies!

Just about everyone tells you to install Analytics and most likely, they will recommend you Google Analytics. No one really tells you how to use Google Analytics. All you’re told is how to install them and how to look at that neat graph telling you that people are coming to your site. Yet, that’s basically useless. You can use WordPress analytics via JetPack. Admittedly, Jetpack does have some really cool features but it’s not as robust as Google Analytics. If you look only at traffic, Jetpack is a better option due to the wealth of other features it has. If you read through this guide and want to see how awesome your site can be with just a few tweaks, get Google Analytics. Anyways, my point is. Google Analytics is a great tool for improving your site in terms of design, accessibility, usability, search engine optimization (SEO) and audience targeting.

My Site

If you’ve been on my site before, you’ll notice some subtle (and some “in your face”) changes and all of those were thoroughly researched and based on the results of a couple months worth of data. In a couple more months, I’ll make more changes and probably discuss those changes. If you wish, you can leave a comment letting me know if there are things that you do like and that you do not like. Thanks. My list is currently up to 30 items ranging from creating a printer-friendly stylesheet to revamping the (currently messy) sidebar and everything in between.

Requirements

For this to work, you’ll need as much Google Analytics data as possible. I have about two-three months since my redesign and about 15,000+ views and 10K+ visitors to give me a good idea of what I can do. This is pretty essential. The more data you have, the better. You don’t have to have 10K views to do this either. And 10K is definitely not a big amount (to some people). So just work with what you can. As I was writing this article, I hit some crazy numbers (10K minimum per month, 50-60K peak) which helped me make even more decisions and basically just corresponded with my earlier predictions. So don’t wait around for 50K/month to hit and start with 5K, even 1K. Another requirement is having power over your site. If you have a hosted tumblr or worpdress blog, you won’t be able to follow many of the instructions below, unfortunately. :/ Last of all, you’ll need a bunch of these skills that will allow you to do this stuff like PHP coding, HTML, CSS, etc. So when you’re ready, open up your site, open up Evernote or Trello, open up your google analytics and let’s get started!

Your Audience

Let’s tackle the first one. Go to your “standard reporting” in your Google Analytics account and let’s see what we can get there. You should land on “Overview” under Audience. This place tells us some interesting stuff. The usual “visits”, “visitors” etc. Here’s what to pay attention to on the bottom: Awesome. The left-hand sidebar is where we’ll look and whenever I mention “check the full report”, click on “view full report” on the bottom right.

Demographics

So demographics is pretty interesting, you’ll see that most users I have come from the US and most speak english. Badass. However there is good 5+% of people that speak a different language. Cool thing about that is that we can throw a google translate button onto the site to capture that 5% or to just make their life easier. Head over to the Google Translate page right now and click “add to site” go through the process and get the code. Here’s my code:

<?php if(substr($_SERVER['HTTP_ACCEPT_LANGUAGE'], 0, 2) != 'en'){ ?>
<div id="google_translate_element"></div><script type="text/javascript">
function googleTranslateElementInit() {
  new google.translate.TranslateElement({pageLanguage: 'en',
   layout: google.translate.TranslateElement.InlineLayout.SIMPLE,
   gaTrack: false'}, 'google_translate_element');}
</script>
<script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
<?php } ?>

What this little snippet will do is add the google translate code to your site only IF the browser is not set to english/come from an english-speaking country. It’s not tested thoroughly but you get the idea. You may want to just use the “if” statement and add your own code between the braces. This will encourage the users to translate the entire page in their native language while not necessarily “both” users that are viewing the site in english, and speak/read english. There will be a percent margin of error but that’s pretty much inevitable. I’ll leave it the way it is. You can test if your implementation works by using Firefox and going into the Settings/Languages/Choose/ and pick a foreign language. Make sure you move it up to the first place.

Google Translate also has a tool that will automatically show the navbar on top if the default browser language is different from the language of your site, taking that step marked above from you.

Also if you’re using CloudFlare, you’ll have access to a couple of handy variables that will tell you the country code of the incoming user. You can just set an array of countries that do speak english, and anyone else will have the code displayed. The rest of the demographics statistics basically tell you the same thing as language.

System

This one will be more important as we go (and you’ll see why). Let’s look at it first. w00t! Check that stuff out, you got a bunch of browsers doing stuff. See the full report. Sweet. Your may look a bit different but here’s what mine tells me:

50% of my incoming traffic is from Chrome
20% is Firefox
8% Safari
7% FF-look-alike
5% android
5% Internet Explorer

here’s why this is important. Audience. When you drill down through the IE versions, you’ll see a further breakdown, and this breakdown will basically tell you the lowest IE version you SHOULD support. For me, that’s IE8 (MAYBE). You see, I got 24 visits from IE7 users and 3 visits from IE6. That’s a total of nothing in comparison to 8000 visits I got. That’s not even close a %. In contrast, I get more IE10 users than IE7 and IE6 combined, and IE8 alone, and IE10 hasn’t even been officially released. Imagine that! It basically tells me I can soon drop support for IE8 and definitely 8 and less. By using Google Chrome Frame, I bet I can knock that number I need to support lower Do the same thing. Go through your browsers and go through IE. How does it compare? Do you get only 2 visitors per thousand that use IE7 or lower? Do you get 25% of your traffic from IE? Depending on these factors, you should optimize your site The rest of the stuff under system is pretty useless (well, mostly) but kind of interesting. Here you can have a quick overview what mobile platforms access your site (such as iOS, Android, Blackbery etc.). This is a pretty cool, quick way of considering if your mobile website will need more work or not. Approximately 16% of my visitors used their phones so yeah, for me it’s a big deal Luckily, my site looks pretty good. We’ll see later if the users think so As far as “Service Provider”, you can check it to see if anyone still uses Dial-up. Otherwise, let’s move on.

Mobile

So this is a better mobile-only breakdown. In the last section, you saw that a good portion of your visitors are mobile (or maybe not). Here you can see more closely what operating system they use, who their service provider is, and the screen resolution. The last one is pretty important. Click on it and see what shows up. Here’s mine: This is a GREAT indicator as to what screen-size you should cater to. My site is pretty responsive and does work well on 320px+ screens. That’s a plus. If your analytics look similar and your site does not have a mobile site or caters to larger screens, you may want to address that…like now. If you view the full report, you’ll also get a “avg. visit duration”, this will let you know if phone users are putting up with your crap. Other than screen-size, having a large mobile base is a good indicator that your site should be optimized for mobile speeds at least 3g. Meaning less HTTP requests, smaller image and file sizes, minifying and so on. Here’s what my site looks like on a 320px resolution: There’s a pretty sweet extension called Pendule for Chrome that will resize your browser so you can see what your site looks like. You can also use a number of emulators online, your phone, or Opera Mobile Emulator which actually works extremely well. If you view my site on your phone, you’ll see I have some things to fix such as:

loaded javascript that falls off the page
html that has a fixed with beyond the size of the screen (especially images!)
“pre” html tags that do not allow wrapping
elements with margins that make it offset (such as my nav)

Addressing these issues will help you grow and satisfy your audience. It will help you better cater your users rather than going blind. Let’s move through the rest of the menu items under “Audience”. Most of those were accessible from the front-page that’s why we used that and didn’t go through the actual menu.

Behavior > Frequency & Recency

We skipped New vs Returning because this thing basically tells you all that. Here’s a drill-down of how many users have been here for how many visits and how many pageviews they’ve had. Oooh, not good. I got around 80% of my visitors be one-time, first-time, only-time visitors. Okay, it’s not that big of a deal given how I get my traffic: posting on reddit, dzone, and other sites. So, actually, that’s fine. I’m actually happier with the rest of those stats. If you have a good amount of traffic returning traffic (around 10%), you know you gotta step up your game to cater to those users! How can you reward frequent users? What can you do to capture them forever or help them out? You have choices:

newsletter sign ups – inform your users of best articles and of site changes
RSS feed READILY available. You can either publish summaries or full articles. I prefer the latter because, personally, it makes me more loyal to a blog.
Favicon <- this one for sure so that they can easily bookmark your site and recognize your site anywhere, easily
Apple icon – in case they’re iPhone users and from what I’ve seen there are a lot.
social media – so that they can share your content because they obviously like it. Some may also want to just use their favorite bookmarking service to keep up with you.
an “about” – chances are, those users will want to know more about you and who you are, or follow you on their favorite social networks. Allow them this pleasure

I’m sure you can think of more ways, perhaps welcome a returning user with a modal window that contains a freebie? Ideas and ideas. Okay, let’s move on.

Engagement

So, you have all these visitors, how long do they stay? Not long, at least for me, and probably for you. Users are used to jumping around what’s important is capturing some percentage to stay with you. Here: Along with bounce rate you’ll get a pretty good as to how your users interact with your site. This basically shows me that most people just jump into the site, scroll down and close out. Sucks but it’s something to deal with. What’s comforting is that there is a good amount of users doing the opposite! Now, I realize that with a lot of my articles, you can just scroll through, scan the headlines, and a get a good idea of what it’s about. Some aren’t, and I’m glad that some users actually read it. So, this is the place where you try to figure out how to keep your users on the site. Here are some suggestions:

create tutorials, those need to be followed step-by-step. Here you’ll get a sense of whether the person actually wanted to follow the tutorial or did not want to. You can’t really just scan it and say “Okay, I know what to do”. At least not with less than 10 seconds
write interesting, provocative, and NEW content! Don’t copy ideas. When you see the millionth article about why “Apple is better than Microsoft” or “Importance of Social Media In Business”, you won’t read it. I know I don’t. But when I see, “What Apple learned from Microsoft” and “How major businesses run their social media”, I may be more interested in reading it.
have other articles readily available. It’s possible that your site has a good article but that, the user may have realized, they already know all about. Give them the option to look at something else you may have. Keep recent articles around

You may want to consult some other blogs for more thorough answers. What I’m doing on my end is redesigning my sidebar so that it not only scrolls with the user (to allow easier access to articles) but to also be easier to read. Another thing I’ll definitely do is write better content! =D

Mobile > Devices

Here’s another breakdown of devices. What’s interesting here is that I assumed that the iOS users are iPhone users but if you look closely, Apple iPhone and Apple iPad are listed as separate devices and split the iOS traffic 50/50: So yeah, look at that. This brings me to another point. If you’re designing media queries, you may want to include tablets (with a break down like this) and may want to use a responsive design rather than having a separate mobile device. According to these states, there’s a ton of iPad users and I want to have a good experience! Are there any details you can think of that these devices suffer/benefit from that you may want to adjust your site to?

all of these devices are webkit based (mainly). Keep that in mind
iPhones/iPads, as mentioned before, use Apple icons
people hold the iPad with both hands so they use their thumbs to navigate. How about adding a side navigation for tablet view? I’m actually considering it for easier use
use large-enough fonts. It’s pretty hard to read on your phone or tablet sometimes, especially with a 12px size!

Where does your traffic come from?

Probably google, social media, and a bunch of sites you submit your links to. Let’s see what’s useful and what’s not though. You may find your links reposted to places you haven’t heard of, being searched for keywords you have never thought imaginable. The main splash screen gives away most of what we need. Go ahead and head on over to traffic sources > overview

Optimizing For Search Traffic

Sorry to burst your bubble but no. Unfortunately, Google Analytics is no longer a good indicator as to how your site is doing SEO-wise other than “am I getting enough traffic from search engines?” Ever since Google disallowed capturing keyword information from searches performed by signed in users (thus https using users), Analytics has become quite useless. As you can see, I have had 9 searches for “twitter bootstrap” which took the users to my site but 350 searches that have no meaning to me, unfortunately. To get a better idea of what kind of search traffic you get, use Google Webmasters. I strongly advise you to do this. If you know what people search for and how they find your site, you’ll know how to optimize your text, URL, titles, and meta information. Also, check out the matched search query, this will give you a number separate from the “Keyword” which will probably, again, be “not set”. The last one here is kind of just for fun. WHen you click on source, you’ll see what search engines you get traffic from. Honestly, I barely get anything out of Bing or other search engines. Again, this is more for SEO purposes. You SHOULD pay attention to it but there are other tools to tackle this from google Webmasters to Raven Tools.

Referral Traffic

For this one, click on the sidebar’s referrals, this will be much better than the cramped overview page.

What’s great here is that you’ll find out where links to your site go and where you’re the most popular. I’m obviously very popular on Hacker News (news.ycombinator.com). I’ve gotten a lot of great critique from them so I know it’s an important source of information for me. They’ve taught me a couple of things about my writing:

be less passionate sounding (ie. less angry, no condescending etc.)
provide examples!

Great advice and I’ll be applying it to my website from now on. Not only that, hacker news is a site full of developers so I know who to impress here. Same goes for reddit. What all these statistics tell me is where I need to place my links and how to time my post release. I’m on a shared server and despite heavy optimization, my site just can’t handle too much traffic at once. I’ve encountered that problem before. What this allowed me was a timed release. I’ve learned my lesson. If I posted on all those sites at once, my server would be overloaded and visitors will have a bad experience (slow loading). What I started doing instead was posting a link on Hackernews to see if it takes, if it does, I wait for the traffic to peak and start dying down. At that point, I post to reddit (reddit’s users usually visit later on in the afternoon anyways), and then everywhere else. Not only does this ensure a better experience, but it also allows me to deal with any problems the article may present (grammar errors, misunderstandings etc.) from one audience to another.

Let’s dig deeper however…

Okay, so it’s no mystery that most of my traffic comes from other sites rather than the search engine. What’s important is not only the peak traffic (from HN and reddit) but also residual DAILY traffic. The smaller sites are just as important and may also provide link backs. Leave your referrals sorted the way they are (highest visits first) and started listing through the pages. If the domain doesn’t tell you much (such as google.com), clicking on the link will bring you to a more detailed page where you’ll see the rest of the referring URLs (turns out, it was from google reader). Also t.cois twitter’s url shortener so that’s a twitter referral In my case, I found a few interesting sites and offshoots from sites:

news.ycombinator.org and heckerne.ws, plus twenty other sites, all mirroring news.ycombinator.com. Pretty strange
phpdeveloper.org <- link sharing site for php developers
echojs.com <- link sharing sites for js developers
codeproject.com <- tutorial/article site for all kind of developers
inbound.org <- link sharing site for seo/inbound marketers
popurls.com
lamernews.com <- similar to echojs but with a wider usage
a ton of readers and social media managers like getprismatic.com, netvibes.com and so on.
phpcamp.net <- similar to phpdeveloper.org
jquerybuzz.com <- link sharing site
and a bunch of person sites from people that linked to me.

I immediately jumped on top off phpdeveloper, echojs, lamernews, and inbound.org. Now, whenever I submit a site, they’re one of the first few to get my link. I get steady residual traffic for a long time and tend to stay on top of their sites in their popular list. Plus, they’re actually great places to discover content! Go look through your lower-ranking referrals and see what YOU can find! Now, other post release, referrals will help you find your audience and thus cater to them better.

Direct Traffic

The problem with “direct traffic” is that often times it’s not direct at all. Direct traffic used to mean that someone just typed in your URL but trying to type: antjanus.com/blog/web-development-tutorials/functional-javascript-front-end-performance into a browser, and the chances of 5000 people doing that are minimal. So what IS direct traffic?

traffic from certain emails
traffic from links anywhere outside of a browser (outlook, pdf, etc.)
traffic from sites that will not give away their http_referer

What can you use this info for? Nothing really. Check out the landing pages and try to figure out where all this stuff came from: I never got to the bottom of this and my data still lurks around with a disgustingly large number of direct hits that have no information attached to it. There are a couple of ways you can mitigate this problem:

Use Google’s URL Builder - this tool will allow you to append certain data to the URL (such as campaign name), you can use this data to figure out where something came from. If you have a twitter campaign, for instance, you’ll know that wherever the traffic came from, the person got the URL from twitter
Bit.ly - in combination with Google’s URL Builder, you can shorten your URL and hide the fact that the URL holds data. You can measure clicks this way as well.

Search Engine Optimization

Ah, I already have this enabled but for you to make this work, you’ll need to sign up for Google Webmasters. It’s very neat. Google tells you what searches you showed up for, how many clicks you got, what ranking you get, and puts that into a cool analytics package. There are three sections here:

Queries – what people search
Landing Pages – where people land
Geographical Summary – where they search from.

The first page will give you a good idea as to what’s important on your site and what you can capitalize on easily: A few things about the analytics. The CTR gives you the metric to look at when it comes to your success rate. “Bootstrap” for instance has only a .64% clickthrough. Not really that much. “Twitter Bootstrap” does MUCH better with a better placement. Third page? Are you kidding me? SWEET So we have Impressions (how many times you showed up), “Clicks” (how many clicks), “Average Position” (your placement in search), and CTR (clickthrough). If you look at my stats, you’ll see that i’m the most successful for “twitter bootstrap themes”. With only 400 impressions, I get 35 clicks which gives me a 8.75% CTR. On the second page of these stats, I had an even better stat (17.5% CTR with 35 clicks) for “customize bootstrap”. Given all of this. I can reinforce my page rank and standing for these keywords with another booming article. Most important keywords? The ones with the highest CTR. This is a wonderful place to find ideas for articles. Sometimes you’ll get some surprising results that can lead you to write a really successful and ranking article. For me it was “Background Patterns For Websites”. Never having written anything on it, it was nice to see it. Maybe I’ll write about it or make a freebie! If you’re purposely trying to rank for a keyword, this is the place to check if it’s working. Landing Pagesis the ending place. With “queries” you’ll see what you come up for, with “landing pages” you’ll figure out where they’re going. You connect the dots! One useful feature for this is if you’re creating a freebie or even just coming out with a new article (or follow up), this is a great reminder of where to put your link and move the traffic too. The last one is, again, an audience indicator! I’ll be writing an article later on the topic of using webmasters the same as I am here so look forward to it! =D

Social

A bit of a new feature, I haven’t put it quite to test yet. Google decided to track social media for your links and shares. This is pretty cool since you don’t have to manually search sites like reddit, twitter, and others for who’s doing what. It seems that Google supports a plethora of social sharing networks. My top contender for the last month? Hackernews. So here’s what you can use these stats for:

figuring out if your social engagement is enough
figure out where you’re lacking (in my case, Facebook!)
figure out where you’re excelling and should become more involved because of previous success (Hackernews + Twitter)
figure out WHICH social network sharing buttons are crucial to include. I focused on my top contenders there (except for Dzone). This is always a good practice. I personally use shareaholic which has beautiful buttons and easy sharing

In the left sidebar “Shared URL” will let you know which of your URLs are the most popular and “Social Source” will tell you how it was shared. The inner pages of the “Social” section will give you more in-depth data on all of this. Again, this will tell you where your most valuable visitors come from: So who’s the most valuable? It seems that even though I get a low number of Google+ visitors, They stay on my page longer that anyone else. Reddit guys seem to jump around with low visit duration and pages/visit. What should i expect from those guys anyways, right? And last of all Hackernews. I still feel like they’re the most valuable visitors. The little “node” icon lets you know that those sites partner with Google Analytics so I suppose they have the most accurate analytics.

Conversions

Ah, so I’m not sure if I mentioned this before (this article has been taking me WEEKS) but “conversions” track little sweet goals. For example, I have a “goal” setup for someone to visit my form page, or my custom Tseczka theme landing page. Again, here you’ll find out who is and is not really useful to what you’re trying to do. I currently don’t care much, I LOVE traffic and I like engagement so my goals are pretty arbitrary and more for fun. So, even though I have gotten almost as many visitors from reddit as twitter, Twitter users are more likely to convert. And Dzone people are more likely to convert even though I get less visitors there. Talk about the value of all those guys. I don’t mean to treat visitors as “customers” or “leads” but for many companies and blogs, this is important. It helps shape the targetted audience, and it helps shape what the blog should focus on. And social visitor flow lets us know what that audience wants. Ah lame, people drop off my site like flies. This is something that really sucks but it seems that SOME people do continue browsing my site. What are they interested in? Is it other blog pages? Stuff about me? Do they care about anything at all? They obviously do and it’s important to keep your visitors engaged. It’s time to make a change. Here’s what I did: At the bottom of each article, I list three related articles with BIG images that will hopefully get users to keep going. The sidebar also scroll with the user (sorry for the cut-off I’m logged in) which allows them to quickly scan for recent posts instead of having to scroll up. On the right, you have recent posts. If you’ve been on the site, I changed styling on this part to make it more accessible. There will be more changes in the future but ever since I implemented the sliding sidebar, my stats went up! Here’s what I recommend:

have a “related articles” section at the bottom of your articles
have “recent posts” in the sidebar
interlink your articles. If you’re talking about Laravel, link to the article you’re talking about it so that the user can read more on it.
An accessible menu helps as well

Content

Finally here. Oh my god. Took so long. And this is the largest section as well. Let’s dive in right away. I feel like this section is the most important. As we’ve discussed before, it’s important to keep users engaged and on your site and thus I implemented a scrolling sidebar and a “related articles” section. Here you can see how BAD my % Exit is (% of users that exit the first page they hit). Content overview is a great place to see how well your site is doing and it’s also a great conclusion to this article. Here’s where you’ll be redesigning your menu, bumping up important information, taking down useless stuff, and emphasizing your best content. Quick look as to what these stats teach me:

I need to start a “featured articles” section on my blog because there are OBVIOUSLY some articles that are more popular than others. Those will make a good impression on new users and show recurring visitors some articles they may have missed
“Avg Time On Site” is high. That’s a good sign. People seem to like my blog. This leads me to want to capture these users for long term. Which is why I implemented a way for users to subscribe to a newsletter.

These are some quick observations. If, for example, the articles had gotten a similar number of users, related articles would become more important and thus showing just random articles would be more effective than having a constant set. The same way if the Avg Time On Site was shorter, I’d focus more on better content and why people leave quickly than trying to get users to subscribe right away. Let’s move onto “page titles” Page titles are also helpful. If you look at the top ranking titles, you’ll see that “name dropping” works the best. The #1, #3, #4, #6, and #7 are articles that all discuss a specific technology, they’re also the only articles I HAVE that use a keyword like that in a title. People are interested in new technology, in new javascript libraries, frameworks, and hitting a hot topic (for example “SASS”) will get you traffic. Am I exploiting this? No, because this is the first time I’ve noticed it but it makes me think that people are more interested in hearing about the specific tools they use rather than general overview of techniques. My article “Build Your Own Blog” did not rank well; however, I’m sure if I changed the title around a bit… “Build Your Own Blog With A Custom PHP Framework and SASS”, I might have gotten much more traffic. Why am I not linking to the article by the way? I’m hoping to bury it since I discontinued that series of articles :/ Look through your own top articles. While there may be other factors (sharing, existing traffic etc.), the title may have a lot to do with how much it gets shared, definitely how it gets shared on twitter and facebook and other social media.

Site Content

Site Content is often thought of as the main part of Google Analytics. How many people am I getting? How long are they staying? How many users are unique? So let’s see what these stats can tell us. I think my own stats can be used as an example for bounce rates, entrances and exits and so on:

The first article is exemplary in most cases. Great pageviews, great time on site, awesome amount of entrances. BUT, high bounce-rate and high exit% that’s an indicator that I’m not doing enough to keep my visitors on site. I already covered this part by adding “recent articles”, mentioning articles throughout my articles, and giving ways to explore the site easily.
The third page shows you something. It’s my homepage. And it’s useless because there’s no time spent on it and people simply leave it. Most of the time this makes sense but I’d like something different. So what can I do to keep my visitors on site?
The rest are a mix and match between high bounce rates, low avg time on site, high average time on site, and low exit%.

As is very apparent, my blog is the main part of my site so I need to work off that. If I want to keep my business, it’ll have to be around the blog as is completely obvious by the stats. This is something that many of you may consider. Do you need to pivot your business strategy? What does your blog capitalize on the most?

Your best articles are indicators of your best content and what people want. Move with it.

Compelling Home Page

So even though the homepage is supposed to be an introduction and a portal for people to get through and use to explore the rest of my site, I’m not entirely happy with the avg time spent on it, one minute is fine but compared to the rest? Not that great. And I used to experience worse times than these.

First of all, this entire site was built for my business and has since turned into more of a “magazine” because of the high traffic from my blog. I wish to perpetuate this and build a magazine with services on the side. It seems to work out better for me. So here’s the thing, it renders my home page obsolete and that’s why it gets no action. What are some design changes I’ll make based on these observations?

more compelling and catching sliders. I left original mockups in there in a rush to send this site off so this part is useless. Plus, no one realizes that the slides are clickable to get to different services. So: time to redesign the slider. What’s necessary is to have slides that connect with the user so instead of “Small Business Solutions – We will help you grow”, I should have “Web Development & Design” with examples of my work and a button on the button to indicate the slide is clickable. You can see that my services page is nowhere near the top 10 so I have to convey the messages on those pages directly through the home page.
Next up is the heading and the three columns are pretty useless and I’ve gotten an incredible amount of crap for them. So how do I replace them? Featured Blog Articles – I used to have a mockup for that but abandoned the idea. So I can have a section for featured articles as well as for calls to action so that if I do get that bounce rate, exits, and whatever else, it will at least go to a good place!
Mission statement / quick about – so you can see that in my top ten, there’s no “about” or “services” or any of those pages. By integrating a simple mission statement, my picture, and so on, I’ll capture traffic for a longer time and expose vital parts of my business immediately instead of waiting for the user to clickthrough. This section would go above the “featured blog articles” section.
Headline is now a mismatch.

Within 5 minutes, I was able to tackle several points. First of all, My home page now has my 3 most popular articles. I offer not only for people to read them but for people to also contact me directly regarding services. I’m way overbooked right now but it’ll be nice to have some steady leads coming in. Note that this is not programmatically done, I manually copy/pasted images and inserted text. Why? Because I needed to have that custom lead line coming in. I feel like it’ll give me more power over the home page. I’ll be adding a mission statement later, after I discuss some of the next things to focus on.

Try following a similar process through each low-ranking page that you want to do better. I’ll definitely spend some time on my blog page because that’s supposed to be the meeting place of anyone wanting to read anything I’ve written. It should definitely not be so low.

Keeping Your Visitors On Site

We’ve already discuss some techniques earlier but here’s a summary:

provide users with a way to get to the next article quickly (ie. recent posts/featured posts/similar posts)
provide users with a commenting system to keep them engaged and coming back (try Disqus)
provide a downloadable piece. You’ll not only get extra engagement, you’ll also get a visitor who becomes a lead
provide a quickly accessible navigation. This can be either a scrolling navbar or just a scrolling sidebar
WRITE GOOD CONTENT (this goes without saying, it’s the most important part of everything)

Content Drilldown

This part of google analytics is another emphasis on what I’ve said earlier:

Again, this shows you the order of importance of stuff (not sure why “wp-admin” gets logged but whatever). Blog is the king of my site but what about the rest? My portfolio page gets some traffic and that’s good, and next is services but out of 70K page views, I only get 380 for my “about-aj” page? Not acceptable. Another reason to move this part of the site to my homepage. Clicking through services/solutions, I’ll find that most people go to the general page and don’t visit the subpages. This tells me that a single page for solutions and a single page for services is all that’s necessary and everything else is useless. So here’s what you do:

rethink your sitemap based on these stats. Are visitors even seeing your most important pages?
how many people are visiting your subpages? Perhaps it’s time to merge all of your subpages into a single strong page
what’s your most visited site? Take it into account, and figure out how to drive people from there to other parts of your sites through Calls-To-Actions, links, and so on

The next two sections “landing pages/exit pages” weren’t too useful to me personally but here are some tips for it.

Landing/Exit pages

These are the pages that people enter and exit your site through. The entrance is the link that someone clicked to get on a specific page. The exit is when someone left your site. This could be a good indicator of pages that “leak” visitors out. Do you find a specific page acting as an exit page more than others? How about entrance page? Are a lot of people entering a specific page and then browsing through your site? Try to capitalize on these by:

creating a flow from your exit pages. Already mentioned before, utilize CTAs and menus
capture your audience within the first second on your entrance page. What’s above the fold? What will they see? Do you have annoying pop ups to ruin their experience?

Site Speed

Oh boy, this is embarrassing. I’m doing my best to keep site load good but honestly, Google Analytics doesn’t show this well. Skip to Page Timing first and let’s get to it.

Before you look at the stats, here’s something you need to do. In the top left, you’ll see a link saying “select metric” right next to a “vs” and “Avg. Page Load Time”, click it, go to “technical” and click on “page views”. This will give us more accurate information as to whether your site sucks or your server just can’t handle it:

Please don’t judge me too harshly. Okay. here’s what to look at:

Avg. Page Load Time – this is how long the page loads ON AVERAGE. 23 seconds is largely unacceptable. It’s ridiculous to be honest. But i feel like Google Analytics is kind of wacky here. At one point, I had stats that people waited several minutes to view my site. So I’m not entirely sure if this discusses full page load (all images, scripts etc.), or whatever else.
Page Load Sample – this is how many people were measured. Having 2-5 measurements on a page with 1500 pageviews is not really an indicator of anything. This however makes me wonder about the 300 page load sample for my 50K pageview page. I’ve heard complaints about my site loading strangely so I had to get a CDN
The graph. If your page load times spike at the same time as your pageviews, your site basically loads well but under stress can perform a bit worse. As you can see that’s the case for a few peaks on my graph but not all

What could this all mean?

You need to optimize your WordPress installation
You need to upgrade hosting to something that performs better
You need to get a CDN to help take the load off your site
You definitely need caching

On September 3rd, I switched hosting which is why there is a zero and then some wacky load times. On September 10th or so, I reinstalled my CDN and cloudflare which is why the number started to normalize toward the end. Makes quite a difference! You can see that my old hosting was reluctant to let me use the server a few days before that and started throttling my usage before I got kicked off due to server loads.

Keep all this mind! Also, fast loading = better user experience!

Site Search

Honestly, this is one thing I have not implemented and am a bit weird about implementing. It involves the searches within your site via google custom search engine. There are plenty of guides on how to implement it. You can get some really cool stats there but again, my site doesn’t currently have a search feature. I’ll probably implement a wordpress-driven alternative when I hit 8 or 9 pages worth of content.

Events/AdSense

I’m not using either of these so I can’t tell you how to use these either. Google event tracking is basically the usage of javascript to trigger and record custom data including file downloads, load times for data, ajax-driven elements, gadgets, widgets etc. Load time for data maybe a good one to track because you can make it more accurate than page timings and mandatory rather than voluntary.

Adsense basically just integrates your adsense account.

Experiments

This is the A/B testing platform. You create several variations of the same content, for example, three different landing pages. One of them randomly shows up after you click a link. Each one of them will be tracked as a variation. Google will log data as to how many people clicked through a button or a specific part of that landing page to figure out how effective that landing page is. This is an extremely powerful tool and should be used to drive your experimental design and statistics. What you can use it for:

tracking landing pages – which design gets more people to click through?
tracking calls to action – which design, again?
tracking home page designs – which users are more likely to read it?

You can test just about any metric from time spent on site to bounce rate to everything else. It’s EXTREMELY powerful and I will discuss in the future how to set it up correctly.

In-Page Analytics

Probably my FAVORITE tool. This thing will take ALL of your data and place it on your site. You get to browse through your site and view what percentage of people clicked where. here’s what it looks like on my site (June 21st 2012 through September 13th 2012):

Obviously, my portfolio isn’t getting clicked and neither is “contact”! What gives??? And this is where I start making design and development changes:

better way to “contact” me via the home page. Perhaps an on-page form or a CTA.
add “buttons” to banners to make them visibly CLICKABLE because they’re not getting clicked.
my most popular “About” should have an excerpt or featurette on the home page.
My pages under “Services” get barely any clicks. I’m glad about my decision to merge those pages into a single page

Moving on. What pages did we say were most visited? Ahhh. blog posts, let’s go to my “bootstrap” page which (we already know) received the most traffic out of all my pages. It’s the best source of information as well.

You can easily navigate through you site as if you were on it in your browser. In fact, if you load up your site right now, you’ll see that there’s a new bar on top with all your stats.

The only problem? My sidebar is dynamic and my footer is gone, and my sidebar changed as well. Keep in mind that these things CAN change the way your stats look. A Quick view of all the click tells me that I’ve lost a lot of data. Not only that but it tells me that a lot of people that came to my site simply exited (as further proven elsewhere). Let’s look at the most and least clicked.

home link – this one is pretty obvious which is why my homepage needs to be more “blog” like. People that land on blogs instinctively click on “home” not “blog”
about – again, another page to focus on.
author page – now, I don’t have this one setup. The author page simply leads to a collection of all my articles, not really a good idea.
in-article links – as I scroll down, I see that people click a lot of my in-article links. This is a GREAT sign and should encourage the continued practice of interlinking articles

Next up? Let’s check out my portfolio, a page I find extremely important and let’s figure out what to do from there:

So this page should (ideally) lead only to services or through to a landing page. It’s good to see that a lot of it IS leading to those parts but again, people are going to my home page after this. Why? I don’t know but my home page needs to be more kick-ass due to the traffic it receives from my secondary pages.

Also, while “start a project” and “schedule a consultation” do pretty much the same thing, people prefer the first one. What’s another button I could include to get the rest of the audience? Those are questions to ask yourself when designing new element pieces for your site.

Use these and other techniques to figure out how to better funnel your visitors. Right now, my visitors are following a flow of “home -> about -> blog” and “service page -> home ->blog” and it continues. What I want them to do is: “service page -> landing page”, “blog -> portfolio” and so on. Browsing through gets you to the mindset of the users:

I see a portfolio and spend on average a minute on here. Probably scrolling through back and forth (portfolio)
Okay, let’s see who this guy is. Looks a bit weird (about Aj)
I guess I’ll just check out what he writes about (blog)
let me read this article (bootstrap)
okay, (exit)

I realize that funneling works a bit differently. Users that enter through portfolio may not actually check out the bootstrap article and a user that lands on “About Aj” may go to the home page instead. This is just an interesting tool to illustrate most of our stats.

Wrapping it up

I hope your journey through Google Analytics and their impact on design and UX was a pleasant one (if long!). Before I let you go, I want to impart you with a few extra nuggets of knowledge:

don’t spend hours lamenting over these stats every day, it’s sufficient to go through and optimize once a month or once every two months
Go read my answer on quora on how to grow traffic, this will give you an idea on how to get more visitors and gain more stats for better design decisions
Users aren’t always the smartest people. Even us designers aren’t. Make decisions that will help the users and use the stats to guide you, not rule you
Focus on what’s important to you and how it can become important to your users. If users like reading your blog and it’s important to you to check out your services, make offers for services readily available (such as how Smashing Magazines interjects about their book in every post, unobtrusively)
The funnel is important, learn to adjust the flow of your users
Let referral traffic help you find the “smaller fish” and pools of users to focus on. These guys will bring in steady traffic
Enjoy!

I’ll be making a lot of changes to my site based on my Google Analytics finds so watch out for those.

Also, I’ll be converting this article to an easy-to-read ebook very soon, watch out for it!