Put Your Best Foot Forward Online

10/7/2013 #bbcon #bestfootforwardonline 1

Putting Your Best Foot Forward Online: 5 Rules for Better Engagement

PRESENTED BY ALLISON FLANARY


INTRODUCTIONS


• Sr. Interactive Designer with the

Blackbaud Interactive Creative

Services Team

• 10 Year Veteran of Blackbaud and

nonprofit web design

• Work on creative, visual, strategy

and coding projects

• UNC Graduate – Go Tar Heels!

WHO I AM…

Allison Flanary


RULE #1: BE BOLD


• Explore alternate navigation structures

- Take advantage of super menus or mega fly-outs when appropriate

- Simplify the main navigation to key areas/task

• Integrate interactivity

- Use flyouts for content

- Take advantage of advanced effects, like Parallax

• Break out of the box with your home page

- Try telling a story that leads to an ask

- Use full-scale photography

RULE #1: BE BOLD

Consider taking calculated design risks to up your

game.


MUSEUM OF MODERN ART (WWW.MOMA.ORG)

http://www.moma.org


PHILADELPHIA ORCHESTRA (WWW.PHILORCH.ORG)

http://www.philorch.org


NORTH WEST FILM CENTER (WWW.NWFILM.ORG)

http://www.nwfilm.org


RULE #2: SHOW OFF


• Use strong photography

- Invest in good photography – you have great stuff to show!

- Make sure your photos are active, engaging and contribute to the

story in a meaningful way

• Tell personal stories

- Make connections with your users with stories from donors,

participants, artists, and other key voices

- Integrate these stories into your key asks – don’t banish them to just

the sidebars

• Showcase your success

- Demonstrate how your constituents supports achieves your mission

- Use info graphics, quotes and event photos to connect with your

users and highlight good stewardship

RULE #2: SHOW OFF

Tell your story in a compelling and engaging way


PORTLAND ART MUSEUM (WWW.PORTLANDARTMUSEUM.ORG)

http://www.portlandartmuseum.org


ALVIN AILEY AMERICAN DANCE THEATRE (WWW.ALVINAILEY.ORG)

http://www.alvinailey.org


NEW ENGLAND AQUARIUM (WWW.NEAQ.ORG)


RULE #3: BE CONCISE


• Focus your home page on 3 or less main goals

- Remove content that doesn’t help accomplish these goals – use the

5-second and click test to find out how your content is performing

- Make sure these tasks are front and center

• Revise your writing style

- Write for the web by using short paragraphs, headlines and bullets

- Make your content easy to digest – can you say it in less words?

• Remove clutter and irrelevant content

- Execute quarterly content inventory and clean up…remove out of

date content

- Ask your self if each piece of content is helping to accomplish your

goals

RULE #3: BE CONCISE

Less in more. Writing for the web should be short,

direct and clear.


LOWER EAST SIDE TENEMENT MUSUEM (WWW.TENEMENT.ORG)

http://www.tenement.org


BOK TOWER GARDENS (WWW.BOKTOWERGARDENS.ORG)

http://www.boktowergardens.org


CHESAPEAKE BAY FOUNDATION (WWW.CBF.ORG)

http://www.cbf.org


RULE #4: START A CONVERSATION


• Use social media to converse – not just push your web site

content in a different format

- Pose questions

- Offer thought leadership and links to great outside content related to

your organization

• Integrate social media more completely into your site

- Use stylized widgets so that social media seems more seamless

- Make page sharing easy and intuitive

• Embrace the good and the bad

- Address negative comments in a constructive manor

- Don’t delete unpleasant or unflattering content – it degrades your

authenticity

RULE #4: START A CONVERSATION

Take advantage of the power of social media for

engagement.


ARKANSAS ARTS CENTER (WWW.ARKARTS.COM)

http://www.arkarts.com


AUSTIN FILM SOCIETY (WWW.PAMM.ORG)

http://www.pamm.org


SAN FRANCISCO MOMA (WWW.SFMOMA.ORG)

http://www.sfmoma.org


RULE #5: MAKE IT MOBILE


• Consider a responsive design vs. an independent mobile site

- Use responsive design to streamline your site management

- Control the user experience for each key media platform

• Focus on mobile users as a separate audience segment

- Conduct user research to see how mobile users interact with your

site differently than traditional desktop users

- Structure your mobile or responsive site to meet those needs

• Make key mobile task front and center for tablets and phones

- Don’t be afraid to rearrange content in a mobile or responsive

design to give users what they want

- Focus on making the experience easy

RULE #5: MAKE IT MOBILE

Provide your users a seamless experience across all

media platforms


GEORGE W. BUSH PRESIDENTIAL CENTER (WWW.BUSHCENTER.ORG)

http://www.bushcenter.org


PEREZ ART MUSEUM MIAMI (WWW.PAMM.ORG)

http://www.pamm.org


OPEN MEDICAL DEVICE RESEARCH

LIBRARY(WWW.OMDRL.ORG)

http://www.omdrl.org


DESIGN SHOWCASE


ART INSTITUTE OF CHICAGO (WWW.ARTIC.EDU)

http://www.artic.edu


NEW YORK CITY BALLET (WWW.NYCBALLET.ORG)

http://www.nycballet.org


MID-AMERICA ARTS ALLIANCE (WWW.MAAA.ORG)

http://www.maaa.org


NELSON-ATKINS MUSEUM (WWW.NELSON-ATKINS.ORG)

http://www.nelson-atkins.org




QUESTIONS + ANSWERS


TWEET, SHARE, INSTAGRAM ABOUT US!

#BESTFOOTFORWARDONLINE

#ARTSANDCULTURAL

#ALLISONFLANARY

Put Your Best Foot Forward Online

Technology

social media

responsive

home page

allison flanary

web

center

users

content