10/7/2013 #bbcon #bestfootforwardonline 1
Putting Your Best Foot Forward Online: 5 Rules for Better Engagement
PRESENTED BY ALLISON FLANARY
10/7/2013 #bbcon #bestfootforwardonline 2
INTRODUCTIONS
10/7/2013 #bbcon #bestfootforwardonline 3
• 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
10/7/2013 #bbcon #bestfootforwardonline 4
RULE #1: BE BOLD
10/7/2013 #bbcon #bestfootforwardonline 5
• 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.
10/7/2013 #bbcon #bestfootforwardonline 7
PHILADELPHIA ORCHESTRA (WWW.PHILORCH.ORG)
10/7/2013 #bbcon #bestfootforwardonline 8
NORTH WEST FILM CENTER (WWW.NWFILM.ORG)
10/7/2013 #bbcon #bestfootforwardonline 9
RULE #2: SHOW OFF
10/7/2013 #bbcon #bestfootforwardonline 10
• 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
10/7/2013 #bbcon #bestfootforwardonline 11
PORTLAND ART MUSEUM (WWW.PORTLANDARTMUSEUM.ORG)
10/7/2013 #bbcon #bestfootforwardonline 12
ALVIN AILEY AMERICAN DANCE THEATRE (WWW.ALVINAILEY.ORG)
10/7/2013 #bbcon #bestfootforwardonline 13
NEW ENGLAND AQUARIUM (WWW.NEAQ.ORG)
10/7/2013 #bbcon #bestfootforwardonline 14
RULE #3: BE CONCISE
10/7/2013 #bbcon #bestfootforwardonline 15
• 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.
10/7/2013 #bbcon #bestfootforwardonline 16
LOWER EAST SIDE TENEMENT MUSUEM (WWW.TENEMENT.ORG)
10/7/2013 #bbcon #bestfootforwardonline 17
BOK TOWER GARDENS (WWW.BOKTOWERGARDENS.ORG)
10/7/2013 #bbcon #bestfootforwardonline 18
CHESAPEAKE BAY FOUNDATION (WWW.CBF.ORG)
10/7/2013 #bbcon #bestfootforwardonline 19
RULE #4: START A CONVERSATION
10/7/2013 #bbcon #bestfootforwardonline 20
• 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.
10/7/2013 #bbcon #bestfootforwardonline 21
ARKANSAS ARTS CENTER (WWW.ARKARTS.COM)
10/7/2013 #bbcon #bestfootforwardonline 23
SAN FRANCISCO MOMA (WWW.SFMOMA.ORG)
10/7/2013 #bbcon #bestfootforwardonline 24
RULE #5: MAKE IT MOBILE
10/7/2013 #bbcon #bestfootforwardonline 25
• 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
10/7/2013 #bbcon #bestfootforwardonline 26
GEORGE W. BUSH PRESIDENTIAL CENTER (WWW.BUSHCENTER.ORG)
10/7/2013 #bbcon #bestfootforwardonline 27
PEREZ ART MUSEUM MIAMI (WWW.PAMM.ORG)
10/7/2013 #bbcon #bestfootforwardonline 28
OPEN MEDICAL DEVICE RESEARCH
LIBRARY(WWW.OMDRL.ORG)
10/7/2013 #bbcon #bestfootforwardonline 29
DESIGN SHOWCASE
10/7/2013 #bbcon #bestfootforwardonline 30
ART INSTITUTE OF CHICAGO (WWW.ARTIC.EDU)
10/7/2013 #bbcon #bestfootforwardonline 31
NEW YORK CITY BALLET (WWW.NYCBALLET.ORG)
10/7/2013 #bbcon #bestfootforwardonline 32
MID-AMERICA ARTS ALLIANCE (WWW.MAAA.ORG)
10/7/2013 #bbcon #bestfootforwardonline 33
NELSON-ATKINS MUSEUM (WWW.NELSON-ATKINS.ORG)
10/7/2013 #bbcon #bestfootforwardonline 34
QUESTIONS + ANSWERS
10/7/2013 #bbcon #bestfootforwardonline 35
TWEET, SHARE, INSTAGRAM ABOUT US!
#BESTFOOTFORWARDONLINE
#ARTSANDCULTURAL
#ALLISONFLANARY