The demand for mobile-optimized content on higher ed sites more than doubled in the past two years. Responsive design is a good compromise for getting existing content into the hands of mobile users, but some aspects have a serious effect on your results in Google Analytics. Learn how to optimize your analytics settings to allow for responsive design, and gain valuable insights into user behavior looking at the results from different devices. Not only will it protect the data you're getting on your site now, it will help you make more informed decisions about site architecture, content, and user experience design in the future.

1. 1Monday, Jul 29

2. Google Analytics
for
Responsive
Websites
housekeeping notes:
-there will be a time for questions at the end , slides will be available, one sheet up front
thank you for coming
how many of you are hands on with analytics?
how many of you are planning for responsive?
how many of you have a current site that is responsive?
2Monday, Jul 29

3. Meet
NewCity
3Monday, Jul 29

4. MEET NEWCITY
WE CRAFT
HUMAN
EXPERIENCE
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
4Monday, Jul 29

5. What is a
Responsive
Website?
Let’s get basics out of the way...
5Monday, Jul 29

6. Consistent
Experience
Basically - the exact same website (content, media, code, etc) no
matter what device you are on
why is it a good idea?
6Monday, Jul 29

7. Ability to
Scale
-less work for manager of site (versions, content) click
your brand needs to come through wether you have 2” of visual space
or 12” or more click
you have a suite of components to build a page within the family of
design - click
you can run off of one CMS and set of code click
-good for SEO click x2
7Monday, Jul 29

8. A
B
C
D
A
B
E
E
C
D
F
F
G
G
Responsive
Design
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 x2
Design for touch at all major breakpoints.
Prototype and test.
8Monday, Jul 29

9. What are
Analytics?
Let data decide!
9Monday, Jul 29

10. ...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.
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.
10Monday, Jul 29

11. Analytics
Data
Analytics provides...
Data to ask better questions
Data to inform the process and revisions
Enables you to Make micro-tweaks
other disciplines to have actionable items based on real data
the better you can define a problem (less of a black box) , the more likelihood you’ll be able to
solve
11Monday, Jul 29

12. Configure
Analytics
Google 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
12Monday, Jul 29

13. CONFIGURING ANALYTICS
Go-to sources: BOOKS
Web Analytics: An Hour a Day by
Avinash Kaushik
Web Analytics 2.0 by Avinash Kaushik
Advanced Web Metrics with Google
Analytics by Brian Clifton
Google Analytics by Justin Cutroni
13Monday, Jul 29

14. CONFIGURING ANALYTICS
Go-to sources: WEBSITES
http://analytics.blogspot.com/
http://www.kaushik.net/avinash/
http://searchenginewatch.com/analytics
http://cutroni.com/blog/
http://online-behavior.com/analytics
http://www.clickz.com/category/analytics
http://www.googleanalyticstest.com
http://www.google.com/analytics/learn/
http://www.google.com/analytics/iq.html
14Monday, Jul 29

15. Review Data
-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 by keyword phrase
•
Mobile Behavior
REVISE THE SITE AND
REPEAT
15Monday, Jul 29

16. Common
Mistakes
thinking pageviews mean something - or any one single metric... for example, lots
of people no conversions
not 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
16Monday, Jul 29

17. Planning for
Responsive
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
(explain picture)
17Monday, Jul 29

18. “ Plans are
nothing;
planning is
everything.”
Dwight D.
Eisenhower
It's the process of planning that is most important: where you consider
opportunities and challenges and ways to meet them.
Plans are obsolete the moment they are done. Things change. New
information comes to light.
18Monday, Jul 29

19. Preliminary
Analytics
Review
Determine
what
exists
Get
access
to
all
accounts
>>>>
(side
note
about
access
to
everything?)
Make
sure
at
a
min
you
have
the
following
profiles
>>>
raw
data
(nothing
applied)
all
websites/main
site
external
traffic
only
everything
all
combined
mobile
traffic
only,
external
traffic
only
19Monday, Jul 29

20. Current
Mobile
Behavior
What isn’t working now?
Apply your mobile segment
Compare to non-mobile traffic
Different Bounce Rates/time on page/etc
convert/non-convert
20Monday, Jul 29

21. Frequent
Breakpoints
-design for responsive layouts based on actual sizes
where to find in analytics - under
>Audience>Technology>Browser & OS>Screen Res Dimension
21Monday, Jul 29

22. Common
Browsers
-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
22Monday, Jul 29

23. Configuring
Analytics for
Responsive
Now your shiny new responsive site has launched... what do you do?
23Monday, Jul 29

24. Setup
Baseline
Analytics
Same
as
before
>>>
Make
sure
at
a
min
you
have
the
following
profiles
raw
data
(nothing
applied)
all
websites/main
site
external
traffic
only
everything
all
combined
mobile
traffic
only,
external
traffic
only
Then
set
things
up
by
departments,
schools,
etc
>>>
MAX
50
PROFILES
PER
ACCOUNT
SO
PLAN
CAREFULLY
24Monday, Jul 29

25. Determine
Top Devices
Create
profiles
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...
like
touch,
size,
res)
3.
iPad
4.
iPhone
5.
non-­‐mobile,
non
touch
(tradiZonal
computers)
6.
Windows
8
7.
Look
closely
and
you’ll
see
others
-­‐
“all
mobile”,
“no
filters”,
“internal”,
etc.
25Monday, Jul 29

26. Screen
Resolution
Filters
NoZced
previous
screen
there
were...
duplicate
device
profiles
used
to
be
much
harder
had
to
do
with
screen
resoluZon
don’t
do
it
this
way
>>>>side
note
-­‐
you
can
also
do
this
with
custom
advanced
filters,
we
like
profiles
for
more
control,
follow
same
basic
steps
about
to
outline
26Monday, Jul 29

27. iPad
go
into
ADMIN...
Apply
filter
by
mobile
model
name
(iPad)
to
include
traffic
NoZce
mulZple
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...
27Monday, Jul 29

28. iPhone
Apply
filter
by
mobile
model
name
(iPhone)
to
include
traffic
-­‐internal
IPs
and
combine
upper/lowercase
URLs
28Monday, Jul 29

29. Android
Phone
>>Starts
to
get
a
licle
trickier<<
Apply
filter
by
operaZng
system
(android)
>>>
can
only
do
by
device
if
you’re
trying
to
track
specific
like
Galaxy
S4
or
HTC
One
Include
mobile
filter
>>>
enZre
operaZng
system
so
we
only
want
the
mobile
traffic
Exclude
tablets
filter
>>>
enZre
operaZng
system
but
we
only
want
phones
-­‐internal
IPs
and
combine
upper/lowercase
URLs
29Monday, Jul 29

30. Android
Tablet
Apply
filter
by
operaZng
system
(android)
>>>
can
only
do
by
device
if
you’re
trying
to
track
specific
like
Kindle
Fire
Include
tablets
filter
>>>
enZre
operaZng
system
but
we
only
want
tablets
-­‐internal
IPs
and
combine
upper/lowercase
URLs
30Monday, Jul 29

31. Windows
8
Windows
8
(touch
traffic
so
we
want
to
look
at
data
separately)
Apply
filter
by
operaZng
system
(windows)
Apply
filter
by
operaZng
system
version
(8)
-­‐internal
IPs
and
combine
upper/lowercase
URL
31Monday, Jul 29

32. Non-Mobile
Non-Touch
traffic
(Traditional
Computers)
We
want
non-­‐mobile
traffic
>>>
Apply
mobile
filter
to
EXCLUDE
mobile
traffic
We
want
all
non-­‐touch
traffic
>>>
Apply
operaZng
system
filters
to
include
everything
out
there
(Windows,
Mac,
Linux)
We
don’t
want
touch
traffic
>>>
Apply
operaZng
system
version
filter
to
exclude
Windows
8
-­‐internal
IPs
and
combine
upper/lowercase
URLs
These
pacerns
can
be
followed
for
any
other
devices,
operaZng
systems,
etc
that
are
specific
to
you
like
before...
Think
of
what
would
cause
users
to
interact
with
the
site
differently...
like
touch,
size,
res
32Monday, Jul 29

33. What can we
learn?
(explain picture)
Analytics can tell us lots of things... overwhelming amount of info
33Monday, Jul 29

34. Learning
from Data
just remember our goal... fully harness power of analytics
breakdown problems into solvable chunks
with as much info as possible
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
34Monday, Jul 29

35. Analytics
can tell us...
- 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?
-
35Monday, Jul 29

36. Analytics
can’t tell us...
Why things are happening
What audiences are trying to do
Why the page was abandoned
Why the user didn’t convert
>>>> for that we need other tools/disciplines “ux hat” (above my paygrade, might
have to do yourself) >>>A/B testing
SIDE NOTE - Jared Spool resources
36Monday, Jul 29

37. CrazyEgg
Where people click
Where people TRY to click
Scroll distance
37Monday, Jul 29

38. Intercept
Survey
Intercept users real-time as they use the site, insight into what they
came looking for, rather or not if they were able to accomplish it.
38Monday, Jul 29

39. Loop 11
http://www.loop11.com/online-usability-testing-101/?confirmed=true
Ask a relatively simple task first
Avoid 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
39Monday, Jul 29

40. UX Tools
Go-to sources: USER TESTING
Usabilila
Qualaroo
UX Punk
Userfly
Feedback Army
UserTesting.com
OpenHallway
TryMyUI
GoToMeeting, Glance, Skype
Usabilla primarily design, testing small things not complex workflows>> Remote, unmoderated; can test flat
images and live site; recruit your own users
Qualaroo for short feedback surveys
UX Punk Online card sorting & navigation menu testing
Userfly Records what users are doing on your site; no tasks or assigned workflows just records what’s going on
on a page
Feedback Army Quick and dirty test
UserTesting.com -Remote, unmoderated task testing; recruits users for you
OpenHallway 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 it
TryMyUI Remote, unmoderated testing >>> get video of users trying to accomplish tasks
40Monday, Jul 29

41. UX Tools
Go-to sources: PROTOTYPING
Invision App
Balsmiq
Proto.io
UXPin
Blueprint
Invision App Clickable prototype (images
only); great for fast, flat testing and
demonstration
Balsmiq Clickable wireframes
Proto.io for tablets & smartphones
UXPin - Clickable wireframing tool
Blueprint (IOS app)- for mobile
41Monday, Jul 29

42. UX Tools
Go-to sources: OTHERS
SurveyMonkey
Kissmetrics
Card Sort
Websort
Optimizely
Unbounce
Visual Website Optimizer
Usability Hub
SurveyMonkey/Kissmetrics - survey tool
Plainframe - Navigation/wireframe testing
Card Sort/Websort - Card sort, navigation testing
Optimizely/Unbounce - A/B Testing
Usability Hub
http://fivesecondtest.com/
http://navflow.com/
http://theclicktest.com/
42Monday, Jul 29

43. Steps for
Success
set up analytics and configure properly to look at multiple devices differently
review the data
find discrepancies and oddities
use ux tools to A/B and user test
refine site
start again
Good luck on your data revision journey!!
43Monday, Jul 29

44. Questions?
Credit: ESO/M. Kornmesser
slides available: www.insidenewcity.com
44Monday, Jul 29