Web strategy

Presented by Barbara PritchardCoordinated by Alex Green

Website Strategy Planning for Nonprofits

501 Commons HandsOn Tech brown bag Website Strategy

Did you know?

Online giving grew 10.7% in 2012 compared to 2011 • Large nonprofits up 7.2% • Medium sized nonprofits up 14.3%• Small nonprofits up 11.8%

Source: Blackbaud 2012 Charitable Giving Report

Source: Dunham+Company, Direct Mail Study


But where to start?

Always remember….

You are not designing for yourself.

Strategies to help develop your digital plan for your audience:

• Stakeholder & User Interviews• Personas• Heuristic Analysis• User Experience Design Overview


Information Architecture

IA is a….

“On the internet, information architecture means how a

website's content is organized and presented to

its users to facilitate navigation and search functions.”

Source: BusinessDictionary.com


Stakeholder Interviews

A stakeholder is anybody who is part of an organization and can affect or is affected by its web content, branding and/or the information provided through the organization’s digital offerings.


Stakeholder Interviews

1. Identify primary the stakeholders. Examples: Executive Director, Board Members, Fundraisers, Accounting, Content Mangers, Marketing Managers, Volunteer Coordinators, IT.

2. Prep your questionsExamples: • From your perspective, what are some of the critical audiences for the website?• What are the most important things people can do, or actions they can take on the

website? • How can the website support our organizations mission?• How do you personally use the website?• What kind of information, features or functionality needs to be there that isn’t now? • What new initiatives do you have planned for the next 1-3 years? • Who would you consider competitors of the organization?

3. Listen & Take notesYour opinion matters, but should not during these interviews. Verbalize your understanding (“If I understood you…”), Use neutral phrases to encourage the interviewee (“I see”), Listen actively for meaning and emotion as well as for the facts.


User Interviews & Usability testing

Get to know the End Users of your organizations digital offerings – the people that visit your site. Who are they and what do they need from your website?

Examples: Beneficiaries, Donors, Volunteers.


User Interviews & Usability testing

1. Surveys – Find out what’s most important to your usersRule of thumb – Keep it simple, write questions at 7th grade reading level. Examples using a 5 point scale:• How often do you <topic>?…Never, Rarely, Occasionally, Frequently, Often• How important is <topic>?...Not at all, A little, Somewhat, Very much, Extremely. • How much do you agree or disagree with <statement>? Strongly disagree,

Disagree, Neutral, Agree, Strongly Agree.Examples of open ended questions: • What is the purpose of your visit to our website? • Were you able to complete your task today? • If you were not able to complete the task, please explain why.

2. User TestingDefine a specific task or tasks and ask the user to walk you through achieving the task. Do not lead the test subject. • Were they able to achieve the task?• How long did it take them? • Were there points of frustration?• Did you uncover what the user was expecting to happen?


Personas

User Experience definition of Personas:

“Personas are fictional characters created to represent the different user types within a targeted

demographic, attitude and/or behavior set that might use a site, brand or product in a similar way.”Source: Wikipedia, Persona (User Experience)


Persona Examples

ProfileGenderAgeOccupation

CharacterDescriptionSite UsageWeb Confidence & ContextBrand Association Environmental Attitude

Source: Boagworld, “An experience with User Personas”


Persona Examples

AgeLocationSalaryOnline ActiviesOffline ActivitiesBioTechnical ComfortSocial Comfort (online)Mobile UsageKey entre trigger putsMotivation to use client, brand or projectGoalsBrands

Source: Dylaunx.com, “Corporate site redesign, A process Case Study”


Persona Examples

Source: Advertising Communication Technology, “Target”


Personas

As you map out your site keep asking questions….

Examples:

• Does feature X benefit a persona?

• What do I need to explain to support this persona?

• What sort of language should I use to make sure this persona understands the message?

• What tone should be used to communicate to this persona?

• Will this persona be able to achieve their goal quickly and easily?

• Does my homepage speak to each persona? Can they get to where they need to go easily?


Heuristic Evaluation

“Heuristic evaluation (Nielsen and Molich, 1990; Nielsen 1994) is a usability engineering method for finding the usability problems in a user interface design so that they can be attended to as part of an iterative design process.”

Source: Nielsen Norman Group, “How to conduct a Heuristic Evaluation”

Can be performed on…

• Your existing website.

• Competitor websites

• Wireframes or design comps



First, define use cases (ideally of personas)

Examples:

• Joe is researching volunteer opportunities and found our website via a Google Search. He doesn’t know anything about us yet, and is trying to determine if we’re a fit.

• Betty, a potential client, heard about our services and is seeking our support. She’s heard good things, but hasn’t reached out for help before.

• Jane is deciding on her holiday contributions. She’s donated to us annually, and is familiar with our mission. She’s also been considering setting up monthly automatic donations, but hasn’t done that before.



Template provided by Jason Levine, UX Director at Ramp, UX & Usability Instructor at the University of Washington








Additional IA Terminology

User Experience Design includes:

• Content Analysis – What content do you have? What do you need? Start with an inventory. This is usually done in Excel or some sort of Matrix.

• Site Mapping – Defining pages, subpages, and overall hierarchy of content.

• User Interaction flows – The movement of your user trough a task. For example, what steps need to be taken to send a donation, sign up to volunteer, login to the site….

• Wireframes – Defining the content to include per page and the overall structure of the individual pages.

• Functional Specification – Annotating the wireframe to explain user interaction (rollover states, where things should link to, how things should function) as well as defining system requirements (what browsers it must work on, what framework should it be build in, etc).


Q & A

Thank You!

Barbara [email protected]

Alex [email protected]

mailto:[email protected]

mailto:[email protected]


Resources

We can help you further!

• For info on:o Future workshops on technological applications,

social media methods, and other topicso Participating in a free tech assessment of your

nonprofit

• Contact us: [email protected]

Web strategy

Technology

persona user experience

user personas

user testingdefine

different user types

persona understandsthe

small nonprofits

large nonprofits

specific task