Who Am I?

  • First name is just the letter J
  • When asked what it stands for, I reply Truth, Justice and the American Way
  • Married 20 years
  • Have a 10 year old daughter
  • Own the most ridiculous breed of dog ever created
  • Play too many video games
  • Live in Charleston SC - Hate Boating

Ridiculous Lay-abouts

Using Data Driven

Decisions to Inform Your Web Design

Not just how, but why?

  • Why Data and Science?
  • How do we get started?
  • What are we looking for?
  • How can I improve my site?
  • How does psychology play a role?
  • Why our assumptions fail
  • How we can use analytics
  • Explore the three stages of reinforcing
    human behavior
  • Bust some myths
  • How your website is an extension of
    your organizations 'personality'
  • Final thoughts

Why Data?
This is Art!

Donate Now!

Why Data?
This is Art!

Challenging Our Assumptions of Reality with Data

What you know.

What "feels" right.

Your Gut.

VS

Data Driven Decisions

*

* Expertise plays an important role, but data and experience lead to expertise and expertise without data is anchor-less musings.

Why Your Assumptions Fail

We're old.

  • Game of Thrones premiered before Pinterest. (2010)
  • Heath Ledger played the Joker before the Chrome Browser existed (2008)
  • The last Harry Potter Novel (Deathly Hallows) is as old as the first ever iPhone (2007)
  • Taylor Swift's first album dropped before Twitter (2006)
  • Friends went off the air before you ever had a Facebook Friend (2004)
  • Forrest Gump debuted before the Internet was public (1991)
  • Seinfeld existed in a world where Netflix mailed you DVDs and before Napster began file sharing (1998)

Why Your Assumptions Fail

We're old.

You cannot predict how people will use technology or what that technology will be.

Why Your Assumptions Fail

We're snobs.

Why Your Assumptions Fail

We're snobs experts.

We are the experts of our organizations.

We understand our organizations to the point of blindness.

Why Your Assumptions Fail

We're snobs experts.

The following words are commonly used in the non-profit sector but have VERY different meanings to the uninitiated.

Gift

Pledge

Unrestricted

Constituent

Target

Recurring Gift

Tribute

Ask

Designation

Why Your Assumptions Fail

We have jobs.

We rarely access our website from the perspective of a visitor.

Rarely do we have the time to constantly check our website

I'm Sold.

Now what?

Adding Google Analytics

Or other analytic suite.

We need to know what's going on!

What are we looking for?

Error Pages

Error Pages

Check website health with real time statistics

Analytics placed on error pages can tell you a wealth of information on website health.

Error Pages

Create it as a goal or a custom report

Error Pages

Improve your error pages by asking...

  • Did you tell them why they are there?
  • Can they search?
  • Can they contact you?
  • Can they navigate away?
  • Do they know they are still on your site?

Error Pages

Why have an error page stop your mission?

What are we looking for?

All Traffic

Shows where your traffic and conversions come from.

Use to to understand where your traffic comes from and optimize your efforts

Use to identify quality traffic as well

Check overall traffic against conversion rate to judge the quality of traffic.

Bounce?

Bounce?

Quality traffic means:

  • Courting quality sources
  • Driving visitors to action
  • Telling your visitors what that action is
  • Gaining a visitor's trust
  • Making that action easy to perform

Bounce?

Courting quality sources

The power of social media

is not magic, it's finding an audience of the like minded.

Finding and appealing to communities that share your org's values will create better traffic.

ALS

Was it successful?

Did it drive quality traffic?

$220 million, the answer is yes.

ALS

Successful, but why?

How can we re-capture that lightning in a bottle.

The martyrdom effect states that people give when there is pain and effort because it feels more meaningful.  Christopher Olivola of Carnegie Mellon University tested this, and found people more willing to participate when there is effort and sacrifice involved. Their participation has meaning.

https://www.cmu.edu/news/stories/archives/2014/september/september16_martyrdomeffect.html

is pleasure derived from the misfortune of others.

Schadenfreude

26 seasons of America's Funniest Videos can't be wrong

Driving Traffic

The Emotional Journey

  • Visceral
  • Behavioral
  • Reflective
  • The Ask
  • The Click
  • The Thank You

Visceral

What drives viewers toward articles?

  • Emotions
  • Questions
  • Negatives
  • Lists
  • Curiosity

Emotional Headlines get shared more.

https://www.orbitmedia.com/blog/web-design-tips/

“We are not thinking machines that feel, we are feeling machines that think.”

Antonio Damasio

Questions

Questions

Betteridge's law of headlines

Any headline that ends in a question mark can be answered by the word no.

Have we found the Cure for Cancer?

Do you want to help with the crisis in Haiti?

Negatives

In a study by Outbrain it was found click through rate of articles with negative superlatives (such as “never” and “worst”) were 63% better than positive headlines.

https://www.linkedin.com/pulse/20140618065438-86132492-positive-vs-negative-superlation-in-headline/

Negatives

Overexposure to negative headlines can create PTSD, according to a study by the University of California, Irvine in 2013

Lists

“The list is the origin of culture. It’s part of the history of art and literature. What does culture want? To make infinity comprehensible. It also wants to create order.”  -- Umberto Eco

Curiosity

Piquing a reader's curiosity can increase your Click Through Rate.  According to a study by Cal Tech, enticing users with the answers to interesting trivia activated the part of the brain that anticipates rewards.
(caudate region)

http://www.naturalhistorymag.com/features/123206/curious-about-curiosity

Curiosity

Wait-a-minute... that's clickbait...

http://www.contentforest.com/copywriting-tools/clickbait-headline-generator

Curiosity

Be Wary

Studies have also shown that not delivering on a headline promise can produce strong levels of outrage.

Wisdom

"Knowledge is knowing that a tomato is a fruit, wisdom is not putting it in a fruit salad."  -- Miles Kington

  • Find the emotion your cause evokes.
  • Grow it organically.
  • It isn't a bait if it's true.
  • It isn't a trick if you provide a solution.

Driving Traffic

The Emotional Journey

  • Visceral
  • Behavioral
  • Reflective
  • The Ask
  • The Click
  • The Thank You

Behavioral

Your audience has taken you up on your promise of information and action.

 

Don't let them down.

What can derail a donation?

What can increase its likelihood?

Don't Underestimate color, font and design in affecting behavior

"Testers for 7-Up consistently found consumers would report more lemon flavor in their product if they added 15% more yellow coloring

TO THE PACKAGE."

― Malcolm Gladwell,

Blink: The Power of
Thinking Without Thinking

Evocative Web Design

Balancing the familiar with the unfamiliar

Unfamiliar

Innovative interations

Full screen imagery

Unique navigation

Unexpected feedback

 

Familiar

Form Elements

Links

Images with Captions

Buttons

Labels

Browser Behavior

Good design balances both.

It evokes a response without confusing the donor.

How will you know?

Duh.

This is where analytics comes in.

The Unfamiliar
and Unexpected

can be as mundane as a broken link.  Good design uses the unfamiliar to evoke emotion.  Bad design inadvertently uses the unfamiliar to confuse visitors to your site.

For instance...

Donate now

Means now.

Donate now

Means now.

Don't complicate a win.

Don't fight a battle you've already won.

Use Color and Pattern Variation

The Occipital Lobe is sensitive to variations in pattern.

Web Marketer, Paras Chopra found that standout colors are remembered more and clicked 60% more than other web elements.

https://www.orbitmedia.com/blog/web-design-tips/

Don't be afraid to add multiple paths forward.

We are a notoriously inattentive species.

What that means

for website navigation.

Creating multiple paths to donate allows the user to easily find the path forward that they are specifically looking for.  Do they expect a button or a navigation element? 

"Why not include both?"
-- famous gorilla

Then use Google Analytics to see which modes are working and which are falling flat.

Using Event Tracking you can see how often a link or button is clicked, cross referenced with any other link or button.

ga('send', {
  hitType: 'event',
  eventCategory: 'Gorilla',
  eventAction: 'click',
  eventLabel: 'Ball passing'
});

Path Variation

By varying the routes to success we can ensure that users will find the action they are looking for.  It also allows us to experiment with the familiar and unfamiliar to evoke emotion.

Click Test

https://usabilityhub.com/click-test

Goal Funnels

  • Giving you information about donation form performance.
  • Finding areas where donors are abandoning the conversion path
  • Drilling down to see where potential friction exists

eCommerce

Use eCommerce to track donations and compare them to various campaigns and designations.

BLACKBAUD.netcommunity.api.DonationConfirmation.add(function (data) {
    if (data.TransTotal) {
        ga('ecommerce:addTransaction', {
            'id': data.TransID,
            'affiliation': '',
            'revenue': data.TransTotal,
            'shipping': '',
            'tax': ''
        });
        for (var i = 0; i < data.Items.length; i++) {
            ga('ecommerce:addItem', {
                'id': data.Items[i].ID,
                'name': data.Items[i].Name,
                'sku': data.Items[i].SKU,
                'category': data.Items[i].Name,
                'price': data.Items[i].Price,
                'quantity': data.Items[i].Quantity
            });
        }
        ga('ecommerce:send');
        ga('ecommerce:clear');
    }
});

eCommerce Tracking

  • Transaction ID
  • SKU
  • Category
  • Quantity
  • Amount
  • Name of 'Item'

Busted Myths

Placing Content Above The Fold

There is no fold...

A study by Huge Inc

 

http://www.hugeinc.com/ideas/perspective/everybody-scrolls

Tested four designs

  • A control image, with no visual cues to scroll below the fold.
  • A scroll arrow that cues users to scroll down.
  • A short image, where users had to scroll to see above-the-fold content in entirety.
  • An animated image with a moving element to lead viewers below the fold

Regardless of how you cue your visitors,

91% of them WILL scroll.

http://www.hugeinc.com/ideas/perspective/everybody-scrolls

Convinced?

  • Chartbeat, a data analytics provider, analyzed data from 2 billion visits and found that “66% of attention on a normal media page is spent below the fold.”
  • Long Text and articles should ALWAYS scroll, according to usability studies by the Software Usability Research Laboratory
  • ClickTale's heatmap service analyzed 100,000 pages and found that 22% scoll to the bottom regardless of length.
  • TMZ's most clicked homepage link is at the bottom.

Content and Image Sliders and Slideshows

Diminishing Returns

That bears repeating...

1% clicked the slider.

Of those, 89% were the first position.

Don't Forget Mobile

This content removed, it's 2017 people.

Driving Traffic

The Emotional Journey

  • Visceral
  • Behavioral
  • Reflective
  • The Ask
  • The Click
  • The Thank You

According to Symantec, after issues of stolen data, this is the number 1 concern of online shoppers.

In online transactions, customers are worried whether they will actually receive the item they purchased.

But... wait...

This is an online donation...

 

Your aren't buying a physical object.

This makes your what you do after the transaction doubly important.

Silent gratitude isn’t much use to anyone.

- G.B. Stern

Reflection

Looking back at a successful decision.

  • Acknowledgement Email
  • Thank You Page
  • Communicating success

Donors prefer to give to a winning team.

Kiva.org ran a study on the percentage toward a funding goal and the effect it had on donations

They found that donors gave substantially more often to goals that were 50% funded than those less than 33% funded.

And they gave to goals over 66% funded substantially more than 50% funded.

Communicate your successes as well as your goals.

Your Website is You

Humans personify everything; your organization is one of those things.

Anthropomorphism

Attribution of human qualities to non-human entities such as animals or objects.

"Did you see what Apple did today?"

"The government is shady."

"I love my car.  She always gets me where I need to be."

Your website becomes your introduction and establishment as a person worthy of empathy, trust and consideration.

 

Your design should evoke those emotions and start the conversation.

GoFund-Envy

If the Internet can raise $20,000 dollars for cat tuxedos - surely your cause can too.

We tend to give to people rather than causes.

We tend to give to winning teams and attainable goals.

Spurious Decisions

Try not to make spurious decisions on a single set of data.  Double check and retest your analytics.

Remember the old
mantra of statistics:

Correlation is not (necessarily) Causation

One Final Thought

Doing the Wrong Thing Doing the Right Thing
Well
Poorly

Anxiety

Courage

Growth

Flying Without a Net: Turn Fear of Change into Fuel for Success - Thomas J. DeLong

To Get Here

We Must Go Here

Last Words

Questions?

The Psychology of Web Design

By J Owen Schultz

The Psychology of Web Design

  • 786