![Page 1: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/1.jpg)
Finding the Sweet Spot: Ingredients for Stirring up Elevated Online Results
July 2014: Going Mobile
![Page 2: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/2.jpg)
2
Housekeeping• Please use Q&A for questions, we have folks standing by
to monitor and respond.
• You can find the recording of today’s session at http://hello.blackbaud.com/sweetspot
![Page 3: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/3.jpg)
3
Today’s Presenter
• Principal Information Architect
• 9 years with Blackbaud
• Specializes in User Experience for nonprofit websites
Lacey Kruger
![Page 4: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/4.jpg)
4Blackbaud Confidential 4
![Page 5: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/5.jpg)
5
TRUTH: Mobile is critical NOW
http://marketingland.com/report-65-of-marketing-emails-were-opened-on-mobile-devices-in-q4-2013-71387
![Page 6: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/6.jpg)
6
Poll the audience
What did your org’s last email look like on a
mobile device?
![Page 7: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/7.jpg)
7Blackbaud Confidential 7
![Page 8: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/8.jpg)
Step #1: Start with your landing pages
![Page 9: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/9.jpg)
9
Step #1: Start with your landing pagesStick the landing! Mobile-friendly emails aren’t so hot if they link to mobile-unfriendly content
Blackbaud Confidential 9
![Page 10: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/10.jpg)
10
Step #1: Start with your landing pages
K-I-S-S• Use responsive layout for your donation form
and any other landing pages
http://getbootstrap.com/getting-started/#examples
![Page 11: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/11.jpg)
Step #2: Follow with your emails
![Page 12: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/12.jpg)
12
Step #2: Follow with your emails
K-I-S-S(again)
http://zurb.com/playground/responsive-email-templates
![Page 13: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/13.jpg)
13
Step #2: Follow with your emails
https://www.emailonacid.com OR https://litmus.com/
TEST• Find a variety of devices around your office or use a
testing service like Email on Acid or Litmus
![Page 14: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/14.jpg)
Step #3: Inventory your content
![Page 15: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/15.jpg)
15
Step #3: Inventory your content
Create a spreadsheet with several columns:• Page ID
• Use a numbering system here for reference and to indicate hierarchy of each page
• Title • Title of each page
• URL • Link to each page for quick access
• Owner • Identify the person in your organization responsible for
creation and maintenance• Action
• Keep this content, delete it or consolidate it?
http://www.npengage.com/content-management/tackling-content-inventory/
![Page 16: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/16.jpg)
16
Step #3: Inventory your content
http://www.npengage.com/content-management/tackling-content-inventory/
![Page 17: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/17.jpg)
Step #4: Content sea change
![Page 18: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/18.jpg)
18
Step #4: Content sea change
Future-proof your content• Inverted Pyramid approach• Make your point FIRST, then
follow with supporting details• “Write for the chunk”
http://www.slideshare.net/LaceyKruger/adaptive-content-for-futureproofed-world
![Page 19: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/19.jpg)
19
Step #4: Content sea change
http://www.slideshare.net/LaceyKruger/adaptive-content-for-futureproofed-world
COPE(Create Once, Publish Everywhere)
![Page 20: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/20.jpg)
20
Step #4: Content sea change
http://www.slideshare.net/LaceyKruger/adaptive-content-for-futureproofed-world
CMS(Content Management System)
![Page 21: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/21.jpg)
21
Step #4: Content sea change
![Page 22: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/22.jpg)
Step #5: Responsive Redesign
![Page 23: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/23.jpg)
23
Step #5: Responsive Redesign
How OLD is your website?
![Page 24: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/24.jpg)
24
Step #5: Responsive Redesign
Source: http://flickr.com/photos/69797234@N06/7203485148and http://www.bostongloble.com
2011
![Page 25: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/25.jpg)
25
Step #5: Responsive RedesignGoing responsive with your redesign:• Saves $$• Saves TIME• Serves ALL of your constituents
http://www.npengage.com/online-fundraising/redesigning-responsive/
![Page 26: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/26.jpg)
26
Step #5: Responsive RedesignCurrent Responsive Design Trends:• Embrace the scroll• Ditch the slideshow• LARGE images (sized accordingly for mobile)
• Donate buttonS (plural)
![Page 27: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/27.jpg)
27
SummaryStep 1: Start with your landing pages
Step 2: Follow with your emails
Step 3: Inventory your content
Step 4: Content sea change
Step 5: Responsive Redesign
![Page 28: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/28.jpg)
28Blackbaud Confidential 28
![Page 29: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/29.jpg)
29Blackbaud Confidential 29
![Page 30: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/30.jpg)
We hope to see you again soon!Join us for the next session in our series:
• Emergency Response Preparedness • Thursday August 21| 2:00PM ET• http://hello.blackbaud.com/sweetspot
![Page 31: Going Mobile: Tips and Tricks for Mobile-Friendly Content](https://reader033.vdocument.in/reader033/viewer/2022051311/53ee57b68d7f7289708b60d9/html5/thumbnails/31.jpg)
thank you.