2. Schedule
8:30 – 9:00am Registration & Breakfast
9:00 – 9:05am Opening Remarks
9:10 – 9:40am Prioritizing Content Strategy and Governance in Your Website Redesign
9:45 – 10:10am Scoping a Website Redesign: Aligning Business Requirement With Technical
Implementation
10:15 – 10:35am Getting to Know Harvard Web Publishing: An In-House “One-Stop Shop” for Cost-
Effective Digital Solutions
10:35 – 10:55am Coffee Talk
10:55 – 11:20am Using Data to Inform Your Redesign Roadmap
11:25 – 11:55am The Biggest Lesson Learned
12:00 – 12:30pm The 21st Century Web
12:30pm Concluding Thoughts
15. Purpose of today’s event
Equip you with a framework built on shared best practices
that can easily align with your office’s objectives—so you’ll be able
to determine the correct size and scope of your next website
reboot (or whether one is needed at all).
16. Schedule
8:30 – 9:00am Registration & Breakfast
9:00 – 9:05am Opening Remarks
9:10 – 9:40am Prioritizing Content Strategy and Governance in Your Website Redesign
9:45 – 10:10am Scoping a Website Redesign: Aligning Business Requirement With Technical
Implementation
10:15 – 10:35am Getting to Know Harvard Web Publishing: An In-House “One-Stop Shop” for Cost-
Effective Digital Solutions
10:35 – 10:55am Coffee Talk
10:55 – 11:20am Using Data to Inform Your Redesign Roadmap
11:25 – 11:55am The Biggest Lesson Learned
12:00 – 12:30pm The 21st Century Web
12:30pm Concluding Thoughts
18. Up Next: Prioritizing Content Strategy &
Governance in Your Website Redesign
● Georgy will discuss establishing ownership, roles, & buy-in at the outset of your
project, as well as weaving content strategy throughout a redesign
● Nearly 14 years of higher ed experience, both in-house & as a consultant
Associate Creative Director, Digital Strategy OHO Interactive
Georgy Cohen
19. Georgy Cohen
Associate Creative Director,
Digital Strategy
Harvard University
Website Strategy Academy
March 22, 2018
Prioritizing Content Strategy and
Governance in Your Website Redesign
24. A newly launched website should
align to a process and a strategy
that ensures ongoing effectiveness.
25. OHO INTERACTIVE
Aligning a web redesign to content strategy
Show your work
Kickoff UX Design Content
Build Launch
- Set goals
- Define
messages
- Process &
policy audit
- Outreach to
community
- Information
hierarchy
- Set content
expectations
- ID content
sources
- Confirm
sustainable
effort
- Reinforce
brand and
messaging
alignment
- Content
creation
- Voice & tone
- Style guide
- Publishing
process
- Content
reuse &
taxonomy
- Data source
integrations
- Publishing
roles &
workflow
- Structure
for SEO & GA
- Activate
policy and
process
- Outreach
goes on
- Content
QA
- Measure
& plan
26. OHO INTERACTIVEHigher ed is… special
Factors Inhibiting a Strategic Website
● Politics
● Decentralization
● Silos
● Lack of nimble decision-making
● Lack of accountability
● Lack of digital owner
● Fear of change
27. Change is inevitable
Change ain’t easy. But standing still is not an option. If our
institutions don’t mature as digital organizations, we risk
losing our audience and failing to achieve our goals.
We can’t impose change overnight if we want it to last. By
priming our community to understand and accept change,
and in the process laying a groundwork for meaningful web
governance, we are investing in the long-term viability of
our website as a tool for strategic success.
Governance is cool
28. If we don’t mature as digital
organizations, we risk failure.
How do we instead set
ourselves up for success?
29. Five considerations:
● Get buy-in from community
● Set people up for success
● Be realistic - think sustainably
● Lay foundation for decision-making
● Establish framework for accountability
34. OHO INTERACTIVE
Bring people together
Get buy-in from the community
Form a content
community to
connect people
to information,
and each other
35. OHO INTERACTIVE
Connect people to content outcomes
Don’t just give
out analytics
logins and
reports - help
them see the real
Get buy-in from the community
37. OHO INTERACTIVE
Gauge savviness & plug skill gaps
Set people up for success
Awareness of brand,
style, goals, audience
Content decision-
making process and
roles
Content quality
assurance
Measurement
strategy
Content publishing
workflow and editor
experience
38. OHO INTERACTIVE
Take inventory of resources & documentation
Set people up for success
● Are they current & accessible?
○ Training (CMS, content)
○ Documentation (style guide, branding)
○ Editorial workflows
○ Policies
40. OHO INTERACTIVE
How are web responsibilities
accounted for in the job descriptions
of those for whom the web is a
measurable task?
● Are the tasks explicitly listed?
● Does the individual receive
reasonable time allocations to
complete them?
● Do they get training, professional
development, or budget?
Codify web responsibilities
Set people up for success
53. OHO INTERACTIVE
Consider the best governance model
Centralized Hybrid
Decentralized
● Central web team owns
publishing process
● Team fully resourced for
content efforts
● Outlying units serve
SME/consultative role
● Ownership shared between
central team & units
● Both sides have resources,
training, and guidelines
necessary to fulfill
established responsibilities
● Appropriate balance varies
● No central web team
coordinating institution-
wide publishing efforts
● Every unit manages its own
information
● Standards & quality vary
Set up a framework for accountability
60. OHO INTERACTIVE
If you are planning a redesign...
● Hold every decision up against your goals
● Form and strengthen relationships now
● Define and assert ownership at the outset
● For every decision you make about the project,
make at least one decision about the process
Next steps
61. OHO INTERACTIVE
If you are in the midst of or recently launched a redesign...
● Consider how best to measure your
effectiveness against your goals
● Evaluate your publishing roles & workflow, and
make sure editors are equipped to succeed
● Make sure you have a sustainable plan for
ongoing content creation & quality assurance
Next steps
63. Scoping a website redesign
aligning business requirements
with technical implementation
64. What to expect?
Web projects, big or
small, have MANY
components ...
Content
Strategy
Design
Development
Analytics
SEO
Hosting
QA
Domain
Accessibility
Project
Management
Development
Maintenance
65. What I will cover
1. Work with vendors
2. Gather requirements
3. CMS selection
4. Align requirements with implementation
5. Q&A
67. If/when/how to bring in vendors
● Web is complex and fast-evolving. If budget allows, bring in vendors to
○ take advantage of the latest technology
○ learn best practices
● Many ways to work with vendors
○ Content strategy
○ Design
○ Development / build
○ Any, or all; separate or together; same vendor or bring in separate
vendors to work together
68. Get cost range via RFI (Request for Information)
RFI RFP
69. Review RFP Responses
and choose the right vendor for
your project. Fit matters!
● Understand RFP responses
○ Expect a range (highest
bid could easily be 4x
the lowest)
● Cookie cutter vs. fully-
customized/tailored
solutions
● Safe vs. creative solutions
74. Sample Requirements Worksheet
● Which audiences do you think are using the
your website (most important ones at top)?
● What are the main reasons these audiences
come to the site?
● Are there audiences you would like to
attract but do not currently?
● What are the main actions we want them to
take?
● Please list the top three challenges of the
current site, user or admin facing
● Name 2-3 comparative sites that you like
and describe why
● Use a few adjectives to describe how the
user should perceive the new site. (Ex:
prestigious, friendly, fun, forward-thinking,
innovative, etc.)
● How will you know if this website redesign
project is a success? I.e. what are the
desired outcomes?
● How does your organization differentiate
itself from its competitive set? Is that
reflected with the site?
75. Joint
Discovery Phase
OPEN
● Hear new ideas and new possibilities
● Ask to see vendor's latest/best
projects
● Educate vendors on the specifics of
your organization
FOCUSED
● All teams have clear idea of goals
● All understand and agree what the
success looks like
● All agree how communication and
signoff will work
do this together with the vendor
76. Don't forget the
admin users
who spend more time on site, and
who deal with more complex workflow
Image credit: https://www.goverlan.com/
77. For Wordpress sites
● Work with vendor to create custom
Wordpress dashboard widget
○ Add quick stats
○ Add links to help
● Set up training for admin users to
learn CMS features
○ For example, "screen options"
78.
79. Analytics shouldn't be
an afterthought
Plan for it when the project is being
scoped out
● Google Tag Manager offers easier and
more flexible control of analytics
tracking effort
● Best time to set up is during the site
development in case html markup
needs to be set up in certain way or if
other tracking or data-layer variables
need to be set up
● It's possible and recommended to
continue use the same Google Analytics
profile
80. Content Migration
This is an area that can easily be
underestimated and could slow down
the project or even push out site
launch date.
If you:
● have a large site with lots of content
● changing CMS
● are looking to consolidate content
from multiple sites
Consider:
● Auto scripting + manual review
● URL pattern -- if changing, need
redirects
Image credit: https://augurian.com/seo-website-migration-strategy-guide/
84. Both are
good choices
Large user/developer base
Stable system
Wide selection of plugins/modules
Secure if properly managed
Score 1-5
Functionality 5 5
Flexibility 4-5 5
Learning Curve
(5 means more
difficult to learn)
3-4 4-5
Cost to build
(bigger number
means cost more)
2-4 3-5
Cost to host 2-3 4-5
85. Additional factors to consider
● CMS of your existing site
● Preference or expertises of your internal team
● Vendor: some vendors work with both but many have a preference
86. Requirements Checklist
● Accessibility
● SEO
● Performance
● Security
● Analytics
● Social share ready
(og tags, etc.)
● Content migration
● Top-page redirects (from
old site to new site, note
redirects limit)
● Admin users
● Design
● User Experience Design
● Content
● Site-specific features
○ Existing features
○ Pain points
○ Wishlist items
89. Focus on Core Requirements
● During the discovery phase, put requirements into two tiers: core
requirements and Nice-to-have's
● During each project review, ALWAYS check core requirements, ensure no
distractions or changes impact the completion of core requirements
90. Simplify approval process and use vendor's resources
effectively
Whether your vendor gives
you a fixed quote or not,
they operate by hours.
https://www.shareicon.net/tag/clock?p=4
95. Harvard Web
Publishing
HWP started as a three-
year initiative in early 2012.
Our goal was to make it
easier for the University
community to build and
maintain effective,
affordable, Harvard-
branded websites.
96. Problems we were trying to solve...
● Lack of unified services for departmental
websites
● Inconsistent and confusing user experience
● Proliferation of web publishing platforms
and technical architectures leading to
inefficiencies in maintenance and support
● Inability of departments to maintain website
content
● Difficulty of access to Harvard’s online
resources
● Harvard’s web presence reflects poorly on
the University’s reputation and image
97. Two Options: Hire HWP or Self-serve
Self-Serve
● OpenScholar platform available
to the Harvard Community
(HarvardKey required)
● Online Documentation
● Ongoing training
Hire HWP
● Full-service in-house agency
● Wide range of services
(consultations, content strategy,
website implementation, training,
etc.)
● Professional-looking, accessible,
responsive sites
98. Why Hire HWP?
● Reliable, reputable, easy to
access vendor
● Familiar with the Harvard
landscape
● Customer service-focused
● Nimble, adaptable service
offerings
● Adapt our team to client profile
● Below-market rates
● Easy-to-use platform (OS)
99. Website Building General Consulting Content Strategy Support & Training
Harvard Web Publishing Services
Don’t know where to start?
That’s cool too!
Let us help you navigate your options, inside or outside of Harvard.
3rd-Party
Consulting Custom Designs
User
Research
And
More!
100. Team
Kenton
Director
Kate Gabriel
Web Project Support
Analyst
Senior Project Manager
Richard
Senior User Experience &
Web Designer
Mary
Senior Project Manager
Dorian Joe
User Experience Lead Web Project Support
Analyst
Interns
Emily
Web Publishing LHT
Yusuf
Web Publishing Intern
We’re
Hiring!
Mourad
Harvard Bridge Program
Professional Intern
110. Some of our 2017 Clients
Harvard Divinity School flagship ● Harvard School of Dental Medicine flagship ● Title IX Office ●
East Asian Art History ● Data Science ● Center for Advanced Imaging ● HMS Graduate Education ●
HSDM 150th Anniversary ● Institute for Theory and Computation ● Executive Vice President's
Office ● Harvard Speaks on Climate Change ● China Project ● Center for African Studies ● EdLabs
● HMS Medical Education ● HKS Ash Center ● HKS Hauser Center ● HKS Carr Center ● HSPH
Center for Health and the Global Environment ● HGSE Instructional Moves ● Harvard Library ●
Harvard College Fund ● Black Hole Initiative ● Zaentz Early Education Initiative ● Planetary Health
Alliance ● Healthcare Policy Program at HKS ● Office of the Arts ● Radcliffe Community Intranet ●
DCE Dean of Students ● HSDM Oral Care and Primary Care ● University Marshal ● Harvard Global
Institute ● Arts and Humanities Division ● Youth Protection Office ● HBS Research Computing ●
Center for Wellness ● HUIT Harvard Phone ● Currier House ● Bok Center ● Faculty Support
Administrator Network ● HUIT Accessibility Site ● HPAC Community Affairs ● Law School Exhibits
Addenda, etc. - About 50 projects per year, of all sizes
111. Looking
Ahead
2018 and beyond
● Provide a portfolio of technology
solutions (OpenScholar and other 3rd-
party vendor options)
● Multiple Platforms
● Enhanced professional services
● Establish vendor referral program
● UX, Mobile, Accessibility
● Focus on digital experiences,
web/mobile
● Buy or broker solutions (rather than
building our own)
114. 114
Using Data to
Inform Your
Redesign
Roadmap
AARON BAKER, DIGITAL ANALYTICS LEAD
HARVARD PUBLIC AFFAIRS AND COMMUNICATIONS
115. 115
1
2
3 Upon launching any major change in
website code, closely monitor the code
for outages or strange data.
Launch and Measure New Data
Discuss analytics opportunities with
your development team, including
using Google Tag Manager to track
scroll depth, element visibility, and
improve user timings.
Collaborate on New Design
Guided by the data you have plus
what you know or hope can be
collected going forward.
Define Goals
Rinse and Repeat as needed.
Analyze and Optimize
4
Where to start? Define goals.
You should focus on analytics at these points in your redesign process
117. 117
Take these Goals of the Harvard Gazette Redesign
Process...
Innovative, modern site
design
Enhanced visual storytelling
capabilities
Increased template flexibility
Improved Wordpress workflow
Improved reader engagement
A ‘one-stop-shop’ for
content
Improved site speed and
performance
Daily Gazette Incorporation
118. 118
...and look at them from the perspective of the
data you have/want.
New design?
New baselines.
New ways to tell stories? New
data (to tell stories).
How does the format of a
story affect analytics?
Expose Wordpress users to
data dashboards
How can we better capture
engagement?
Off-site links build relationships
Improved site speed and
performance
Daily Gazette Audience
119. 119
1
2
3 Upon launching any major change in
website code, closely monitor the code
for outages or strange data.
Launch and Measure New Data
Discuss analytics opportunities with
your development team, including
using Google Tag Manager to track
scroll depth, element visibility, and
improve user timings.
Collaborate on New Design
Guided by the data you have plus
what you know or hope can be
collected going forward.
Define Goals
Rinse and Repeat as needed.
Analyze and Optimize
4
Moving forward: new design.
You should focus on analytics at these points in your redesign process
121. 121
Static, but evolving.
Website homepages,
program or initiative landing
pages, pages used for
wayfinding and general
information. Doesn’t always
encourage returning users.
Optimization can occur at the
page level over time through
A/B testing.
Harvard.edu Homepage
Primarily used for news
and events. Constantly
updated with new stories
nearly every day which
encourages readers to
come back.
Optimization is used for
better acquisition, SEO,
and encouraging user
engagement.
The Harvard Gazette
VS
Different sites, different metrics
Each site uses web analytics in a unique way
122. 122
● Calls to action such as
clicking on featured
content or scheduling a
campus tour
● Time to task completion
(useful for navigation
analysis—how long did it
take to find the right link?)
● Sessions with on-site
search
Harvard.edu Homepage Key
metrics
● Time on story pages
(attention minutes)
● Scroll depth
● Engagement with
embedded media
● Stories pages per
session
● Clicks on share buttons
The Harvard Gazette
Key metrics
VS
In a redesign situation...
Think about how each kind of site meets different needs
124. 124
Analytics Wish List
Newest tracking possibilities, best (easiest) via Google Tag Manager
Predefined percentage checkpoints on
your page that, when scrolled into
view, triggers an event that is sent to
Google Analytics. You can further
customize this by creating a custom
metric, such as “percentage of
pageviews that reached X%.”
SCROLL TRACKING
This page is really long. How do I know
if users are seeing this thing that exists
way down the page? The element
visibility trigger is used to send an event
to Google Analytics when whatever you
configured is shown to the user.
ELEMENT VISIBILITY
Google Analytics doesn’t actually use a
stopwatch to track your users as they
race through the circuit of your
website, unless you tell it to. This GA
“plugin” is used improve the quality of
user behavior time measurements.
USER TIMINGS
125. 125
1
2
3 Upon launching any major change in
website code, closely monitor the code
for outages or strange data.
Launch and Measure New Data
Discuss analytics opportunities with
your development team, including
using Google Tag Manager to track
scroll depth, element visibility, and
improve user timings.
Collaborate on New Design
Guided by the data you have plus
what you know or hope can be
collected going forward.
Define Goals
Rinse and Repeat as needed.
Analyze and Optimize
4
Launch day! Then weeks of measurement.
You should focus on analytics at these points in your redesign process
128. 128
● Menu navigation and category
label
● Share buttons
● Trending box (or “next in series”
box)
● In-story media players and links
● Editor’s picks
● Up next footer
Walkthrough of a Gazette article
To illustrate tracking points
129. 129
1
2
3 Upon launching any major change in
website code, closely monitor the code
for outages or strange data.
Launch and Measure New Data
Discuss analytics opportunities with
your development team, including
using Google Tag Manager to track
scroll depth, element visibility, and
improve user timings.
Collaborate on New Design
Guided by the data you have plus
what you know or hope can be
collected going forward.
Define Goals
Rinse and Repeat as needed.
Analyze and Optimize
4
What’s next? Analyze and Optimize.
You should focus on analytics at these points in your redesign process
131. 131
New site went live
High-level site health: Pagevies
I expected this to remain more or less the same. Good news.
132. 132
Turns out user behavior is unchanged, pages are just physically longer in
the new template, which pushes the first interaction event (50% scroll)
to much lower down the page than before.
New site went live
Bounce rate
Bounce rate is rising slightly, but why?
133. 133
New site went live
Average Session Duration
This decreased slightly, also as a result of the design change
134. 134
4.4% of Story Pageviews clicked “next”
Prior to the redesign, this was less than 1% of pageviews.
On average, 1.27%
of all sessions
clicked on an
Editor’s Pick.
Users from the
Harvard
Homepage, Daily
Gazette, and other
emails (such as the
HAG) are twice as
likely to click on an
Editor’s Pick.
135. 135
The Harvard Gazette
ranks it in the fastest
third of all pages
according to Google
Chrome User
Experience.
Site speed report: mobile
PageSpeed Insights
136. 136
The Harvard Gazette
ranks it in the fastest
third of all pages
according to Google
Chrome User
Experience.
Site speed report: desktop
PageSpeed Insights
137. 137
● The Daily Gazette Audience is 83,559 users
(8.04% of all users on the Gazette)
● They visited 188,049 times (sessions) since the new site launch
● Bounce Rate is better: 39.85% compared to site average of 44.48%)
● Pages per session is 1.37 pages per session
(compared to site average of 1.26)
● Average time on page is 2 minutes 31 seconds (compared to 1:49)
● 3.16% of sessions from Daily Gazette users clicked on an Editor’s Pick item
(compared to site average of 1.27%)
Daily Gazette audience on the website
PageSpeed Insights
149. Shameless plug:
▹ If you’re working on a community-
facing initiative that we can help
amplify, email me!
▹ kendra_butters@harvard.edu
14
9
150. 2.
When Waterfall gets you down:
Going Agile with DUX
(content strategy, user testing, and design)
Kerry Conley
Director of Communications at
Harvard Library
151. Agile in a nutshell:
Build the
right thing;
build the
thing right.
15
1
154. ▹ Set clear expectations with internal
staff and leadership
Tip: if you’re not doing a 1-to-1 content migration,
don’t call it a migration project.
▹ Build in time for consistency check
▹ Be explicit during the RFP process
▹ It’s worth doing!
future.library.harvard.edu
15
4
What I Learned...
155. 3.
Working with a
tight budget
James Evans
Publications Coordinator at
Fairbank Center for Chinese Studies
170. What we learned:
▹ A redesign is a chance to not only
change the website, but also
reevaluate workflows,
assumptions, and editorial
decisions.
17
0
256. Vision
01
Write down business
and user goals
• Conduct interviews
• Run workshops
• Deep dive on past research
• Analyze site metrics
• Define goals & audience
• Develop KPIs
• Establish the big picture
257. • Conduct interviews
• Run workshops
• Deep dive on past research
• Analyze site metrics
• Define goals & audience
• Develop KPIs
• Establish the big picture
Vision
01
01
02
03
04
05
06
07
08
09
10
Establish our biggest
priorities and build
Write down business
and user goals
258. Vision
01
Build
02
• Work agile: 2-week sprints
• Turn vision into product
• Make it real, do it fast
• Frequent client feedback
• Test as we build
• Continuously QA
• Document as we go
• Conduct interviews
• Run workshops
• Deep dive on past research
• Analyze site metrics
• Define goals & audience
• Develop KPIs
• Establish the big picture
01
02
03
04
05
06
07
08
09
10
Establish our biggest
priorities and build