Google Analytics for

Responsive Websites#edui_analytics

1Monday, Nov 4

there will be a time for questions at the endslides will be available - stay with me it’s a lot of informationone sheet up frontadvanced analytics, NOT covering basics - jumping over that stuff fastgoogle changed names - I WILL call views profiles - force of habit

Jessica BehalDirector of

Internet Marketingjessica@insidenewcity.com

@jes525

2Monday, Nov 4

since 2009seo, ppc, banner, email, social, lead gen, ANALYTICS

NewCity

3Monday, Nov 4

digital agency, 30 people in blacksburg...

how real people will interact with technology and use that to plan strategy to help them be able to accomplish their goals

focus on data and results to make decisions and determine success

The Basics

4Monday, Nov 4

Let’s get basics out of the way...

how many of you are hands on with google analytics?how many of you are planning for responsive?how many of you have a current site that is responsive?

What is a Responsive Website?

5Monday, Nov 4

Basically - the exact same website (content, media, code, etc) no matter what device it is on

ConsistentExperience

6Monday, Nov 4

why is it a good idea?-less work for manager of site (versions, content)-your brand needs to come through -you have a suite of components to build a page within the family of design-you can run off of one CMS and set of code-good for SEO

A

B

C

D

A

B E

E

C

D F

FG

G

ResponsiveDesign

7Monday, Nov 4

NewCity’s method:

Use data to drive decisions.Never assume you know what content people want on a particular device.Start with structured content and go from there click x2Design for touch at all major breakpoints based on your actual users Prototype and test.

What are Analytics?

8Monday, Nov 4

Let data decide!

...a powerful, easy to use reporting platform that lets you decide what data you want to view and to customize your reports with just a few clicks.

Google defines as...

Not only can you measure sales and conversions, it gives you fresh insights into how visitors use your site, how they arrived on your site, and how you can keep them coming back.

9Monday, Nov 4

Google Analytics is a powerful, easy to use, reporting platform, that lets you decide what data you want to view and customize your reports, with just a few clicks. Not only can you measure sales and conversions, it gives you fresh insights into how visitors use your site, how they arrived on your site, and how you can keep them coming back.

Analytics Data

10Monday, Nov 4

A bunch of stats about user behavior on your website, important bcthe better you can define a problem (less of a black box) , the more likelihood you’ll be able to solve

Analytics Provides

Data to ask better questions Data to inform the process and revisions Data to enable micro-tweaks Actionable items based on facts not guesses

11Monday, Nov 4

Data to ask better questionsData to inform the process and revisionsEnables you to Make micro-tweaks other disciplines to have actionable items based on real data

Configure Analytics

12Monday, Nov 4Google is great but have to configure >>>>one sheet handout- lowercase filters >>> variations of the same page.- custom alerts >>> notify us if/when there are sudden changes in traffic.- internal site search tracking >>> better understand what visitors are looking for but not finding on the site.- Set up event tracking >>> any action without a URL change- Set up Conversions >>> info form, purchase, etc- Link their AdWords and Analytics accounts >>> how visitors from paid advertising sources are interacting- Link their Webmaster Tools and Analytics accounts >>> analyze SEO data within Analytics.- Custom Reports >>> reporting on quality of traffic sources/mediums, keywords, quality of traffic by location, quality of traffic by mobile device, etc

CONFIGURING ANALYTICSGo-to sources: BOOKS

Web Analytics: An Hour a Day by Avinash KaushikWeb Analytics 2.0 by Avinash KaushikAdvanced Web Metrics with Google Analytics by Brian CliftonGoogle Analytics by Justin Cutroni

13Monday, Nov 4again slides are available with these sources

CONFIGURING ANALYTICSGo-to sources: WEBSITES

http://analytics.blogspot.com/http://www.kaushik.net/avinash/http://searchenginewatch.com/analyticshttp://cutroni.com/blog/http://online-behavior.com/analyticshttp://www.clickz.com/category/analyticshttp://www.googleanalyticstest.comhttp://www.google.com/analytics/learn/http://www.google.com/analytics/iq.html

14Monday, Nov 4

Review Data

15Monday, Nov 4

-types of data to review on a regular basis-• Locations of visitors to the site• Top visited pages and bounce rates for key pages• Traffic mediums: their comparative quality and trends over time• Top traffic sources• Organic traffic quality (keyword phrase in adwords/webmaster tools)

• Mobile Behavior REVISE THE SITE AND REPEAT

Common Mistakes

16Monday, Nov 4

thinking pageviews mean something - or any one single metric... for example, lots of people no conversionsnot looking at data in context - sometimes a high bounce rate is a good thing... like on a directions page!assuming you know why something (like a conversion) isn’t working

Planning forResponsive

17Monday, Nov 4

now that Basics out of the way

lucky enough to be able to plan before building a responsive site there is a lot to learn from the existing data just remember things change. New information comes to light.

PreliminaryAnalytics Review

18Monday, Nov 4

Determine  what  existsGet  access  to  all  accounts    Make  sure  at  a  min  you  have  the  following  views    >>>  raw  data  (nothing  applied)global  site  view/main  site  external  traffic  onlyeverything  all  combined  mobile  traffic  only,  external  traffic  only

Current Mobile

Behavior

19Monday, Nov 4

What isn’t working now?

Apply your mobile segmentCompare to non-mobile trafficDifferent Bounce Rates/time on page/etcconvert/non-convert

Frequent Breakpoints

20Monday, Nov 4

-design for responsive layouts based on actual sizes

where to find in analytics - under >Audience>Technology>Browser & OS>Screen Res Dimension

Common Browsers

21Monday, Nov 4

-what browsers are used by current audiences-what will we support?

where to find in analytics - under >Audience>Technology>Browser & OS>Browser>Secondary - Browser Version

ConfiguringAnalytics for Responsive

22Monday, Nov 4

Now your shiny new responsive site has launched... what do you do?

SetupBaseline Analytics

23Monday, Nov 4

Same  as  before  >>>  Make  sure  at  a  min  you  have  the  following  viewsraw  data  (nothing  applied)global  website/main  site  external  traffic  onlyeverything  all  combined  mobile  traffic  only,  external  traffic  only

Then  set  things  up  by  departments,  schools,  etc    >>>  MAX  50  VIEWS/profiles  PER  ACCOUNT  SO  PLAN  CAREFULLY

Determine Top Devices

24Monday, Nov 4

Create  views  for  top  devices                                                                                      (HOW  DID  WE  COME  TO  THESE?        LOOK  AT  OLD  DATA...  DIFFERENT  FOR  YOU)   1.  Android  phone     2.  Android  tablet                                      (Think  of  what  would  cause  users  to  interact  with  the  site  differently...  touch,  size,  res)   3.  iPad         4.  iPhone   5.  non-­‐mobile,  non  touch  (tradiXonal  computers)   6.  Windows  8       7.  as  wells  as  others  -­‐    “all  mobile”,  “no  filters”,  “internal”,  etc.

Screen Resolution

Filters

25Monday, Nov 4

previously  with  old  analyXcs

used  to  be  much  harder  had  to  do  with  screen  resoluXondon’t  do  it  this  way

CustomAdvanced Segments

26Monday, Nov 4

addiXonally  you  could  usecustom  advanced  segments,  follow  same  basic  steps  about  to  outlinewe  like  views  for  more  control:-­‐apply  advanced  segments  (like  returning  users)  to  a  view  of  specific  device-­‐segment  data  is  sampled  over  250k  visits  so  to  be  truly  accurate  at  high  volume  a  view  is  preferable  bc  not  sampled

iPad

27Monday, Nov 4

go  into  ADMIN...Apply  filter  by  mobile  model  name  (iPad)  to  include  traffic

side  note  -­‐  we  have  mulXple  filters  applied-­‐we  almost  always  also  filter  out  internal  IPs  and  combine  upper/lowercase  URLs  in  these  profiles...  can  have  internal  traffic  iPad  profile  if  you  think  you  need  it...

iPhone

28Monday, Nov 4

Apply  filter  by  mobile  model  name  (iPhone)  to  include  traffic-­‐internal  IPs  and  combine  upper/lowercase  URLs

AndroidPhone

29Monday, Nov 4

>>Starts  to  get  a  lidle  trickier<<Apply  filter  by  operaXng  system  (android)    >>>  can  only  do  by  device  if  you’re  trying  to  track  specific  like  Galaxy  S4  or  HTC  OneInclude  mobile  filter    >>>  enXre  operaXng  system  so  we  only  want  the  mobile  trafficExclude  tablets  filter    >>>  enXre  operaXng  system  but  we  only  want  phones-­‐internal  IPs  and  combine  upper/lowercase  URLs

AndroidTablet

30Monday, Nov 4

Apply  filter  by  operaXng  system  (android)    >>>  can  only  do  by  device  if  you’re  trying  to  track  specific  like  Kindle  FireInclude  tablets  filter    >>>  enXre  operaXng  system  but  we  only  want  tablets-­‐internal  IPs  and  combine  upper/lowercase  URLs

Windows 8

31Monday, Nov 4

Windows  8  (touch  traffic  so  we  want  to  look  at  data  separately)Apply  filter  by  operaXng  system  (windows)Apply  filter  by  operaXng  system  version  (8)-­‐internal  IPs  and  combine  upper/lowercase  URL

Non-MobileNon-Touch

traffic

[Traditional Computers]

32Monday, Nov 4

We  want  non-­‐mobile  traffic    >>>  Apply  mobile  filter  to  EXCLUDE  mobile  trafficWe  want  all  non-­‐touch  traffic    >>>    Apply  operaXng  system  filters  to  include  everything  out  there  (Windows,  Mac,  Linux)We  don’t  want  touch  traffic    >>>  Apply  operaXng  system  version  filter  to  exclude  Windows  8-­‐internal  IPs  and  combine  upper/lowercase  URLsThese  paderns  can  be  followed  for  any  other  devices,  operaXng  systems,  etc  that  are  specific  to  youlike  before...  Think  of  what  would  cause  users  to  interact  with  the  site  differently...  like  touch,  size,  res

What can we learn?

33Monday, Nov 4

(explain picture) ... she would say dig deeper and don’t make assumptions

Analytics can tell us lots of things... overwhelming amount of info

Learning from Data

Remember our goal:

Fully harness the power of analytics to break down problems into solvable chunks with as much information as possible

34Monday, Nov 4

and... the solution will be different in every case

>>> look responsive data this way rather than breaking the entire system to fix solving the problem (micro level) of not working on this specific device, screen, etc

Analytics can tell us...

35Monday, Nov 4

- What questions to ask- What should we examine further >>> finding oddities and discrepancies in the data

- Conversion rates - Bounce rates -Time on page - New Visitors vs. Returning- >>>remember - it’s exactly the same code/content so when it acts differently what does it lead us to think

about?-

Analytics can’t tell us...

36Monday, Nov 4

Why things are happeningWhat audiences are trying to doWhy the page was abandonedWhy the user didn’t convert>>>> for that we need other tools/disciplines “ux hat” (above my paygrade, might have to do yourself) >>>A/B testingSIDE NOTE - sessions here, Jared Spool resources

CrazyEgg

37Monday, Nov 4

Where people clickWhere people TRY to clickScroll distance

InterceptSurvey

38Monday, Nov 4

Intercept users real-time as they use the site, insight into what they came looking for, rather if they were able to accomplish it

tie into analytics with custom variables

this is great on pages like the homepage, major landing pageskeep it to 2-3 questions

Social Media Polling

39Monday, Nov 4

you have a captive audience already

what do you want to do on the admissions page?what is the top task you try to accomplish on the website?

Loop 11

http://www.loop11.com/online-usability-testing-101/?confirmed=true

40Monday, Nov 4Ask a relatively simple task firstAvoid creating task scenarios that give participants hidden clues (info/words give hints)Keep the length of evaluations as short as possible - less than 6 questions is good - results in higher completion rates

- looking at most common success pages and most common fail pages- find the problems and the strengths then focus on finding the cause of the problems using the click path analysis and heat maps. - rank the problems by severity - decide how to solve and put the findings into action

UX ToolsGo-to sources: USER TESTING

UsabililaQualarooUX PunkUserflyFeedback ArmyUserTesting.comOpenHallwayTryMyUIGoToMeeting, Glance, Skype

41Monday, Nov 4Usabilla primarily design, testing small things not complex workflows>> Remote, unmoderated; can test flat images and live site; recruit your own usersQualaroo for short feedback surveysUX Punk Online card sorting & navigation menu testingUserfly Records what users are doing on your site; no tasks or assigned workflows just records what’s going on on a pageFeedback Army Quick and dirty testUserTesting.com -Remote, unmoderated task testing; recruits users for youOpenHallway Remote, unmoderated task testing >>>>have to have a URL to test, users are prompted out loud to talk about the task as they work on itTryMyUI Remote, unmoderated testing >>> get video of users trying to accomplish tasks

UX ToolsGo-to sources: PROTOTYPING

Invision AppBalsmiqProto.ioUXPinBlueprint

42Monday, Nov 4Invision App Clickable prototype (images only); great for fast, flat testing and demonstrationBalsmiq Clickable wireframesProto.io for tablets & smartphonesUXPin - Clickable wireframing tool Blueprint (IOS app)- for mobile

UX ToolsGo-to sources: OTHERS

SurveyMonkeyPlainframeKissmetricsCard SortWebsortOptimizelyUnbounceVisual Website OptimizerUsability Hub

43Monday, Nov 4

SurveyMonkey/Kissmetrics - survey toolPlainframe - Navigation/wireframe testingCard Sort/Websort - Card sort, navigation testingOptimizely/Unbounce/Visual Website Optimizer - A/B TestingUsability Hubhttp://fivesecondtest.com/http://navflow.com/http://theclicktest.com/

Steps for Success

44Monday, Nov 4

set up analytics and configure properly to look at multiple devices differentlyreview the datafind discrepancies and odditiesuse ux tools to A/B and user testrefine sitestart againGood luck on your data revision journey!!

Questions?

slides available: www.insidenewcity.com

45Monday, Nov 4

Credit: ESO/M. Kornmesser

slides available: www.insidenewcity.com

Writing Content thatWorks Everywhere

Tuesday, 9:30amShenandoah Room

46Monday, Nov 4