Nicky Bleiel

1. Nicky Bleiel
STC Mid-Atlantic Conference
9 March, 2012 1
Nicky Bleiel
Senior Information Developer
ComponentOne
STC Mid-Atlantic Conference
9 March, 2012
Biography — Nicky Bleiel
• 17+ years of experience as a technical
communicator.
• Director, Society for Technical Communication.
• Written and designed documentation for software
products in the documentation, media, industrial
automation, simulation, and pharmaceutical
industries.
• Speaker at STC, WritersUA, tcworld, LavaCon, and
CIDM on a variety of topics, including: embedded
help, tools and technologies, user assistance
design, single sourcing, wikis, Web 2.0, Agile, and
convergence technical communication.
• Articles published in STC Intercom, tcworld
magazine, TechCom Manager, WritersUA website,
and the Content Wrangler.

2. Nicky Bleiel
STC Mid-Atlantic Conference
9 March, 2012 2
What We Will Cover
• Discover the options available for interactivity.
• Discuss how they can improve readability and
usability.
• Learn how to implement them in a single
sourcing environment.
What About the Wisdom of the Crowd?

3. Nicky Bleiel
STC Mid-Atlantic Conference
9 March, 2012 3
Notes About Online Help
• Many more options for delivery available.
• Browser-based Help makes more possible, but
can add interactivity to HTML Help also.
• ELearning encourages interactivity – Help is a
form of Elearning.
• Help = website.
Considering Interactivity
Will the user understand and expect the
relevant action that occurs?
If content is hidden, will the user know how to
access it?
Does the additional user input actually improve
the overall experience?
From: Bringing Interactivity To Your Website With Web Standards
http://coding.smashingmagazine.com/2011/02/03/bringing-interactivity-to-
your-website-with-web-standards/

4. Nicky Bleiel
STC Mid-Atlantic Conference
9 March, 2012 4
Expanding/Collapsing Text
Image Maps

5. Nicky Bleiel
STC Mid-Atlantic Conference
9 March, 2012 5
Glossary Popups
Google Maps
<iframe width="425" height="350" frameborder="0"
scrolling="no" marginheight="0" marginwidth="0"
src="http://maps.google.com/maps?f=q&amp;source=s_q&am
p;hl=en&amp;geocode=&amp;q=201+South+Highland+Avenue
,+Pittsburgh,+PA&amp;aq=0&amp;oq=201+south+highland+av
enue,+pittsburgh&amp;sll=37.0625,-
95.677068&amp;sspn=34.450489,57.832031&amp;ie=UTF8&a
mp;hq=&amp;hnear=201+S+Highland+Ave,+Pittsburgh,+Penns
ylvania+15206&amp;ll=40.458836,-
79.924694&amp;spn=0.008082,0.014119&amp;t=m&amp;z=1
4&amp;iwloc=A&amp;output=embed"></iframe><br
/><small><a
href="http://maps.google.com/maps?f=q&amp;source=embed
&amp;hl=en&amp;geocode=&amp;q=201+South+Highland+Av
enue,+Pittsburgh,+PA&amp;aq=0&amp;oq=201+south+highlan
d+avenue,+pittsburgh&amp;sll=37.0625,-
95.677068&amp;sspn=34.450489,57.832031&amp;ie=UTF8&a
mp;hq=&amp;hnear=201+S+Highland+Ave,+Pittsburgh,+Penns
ylvania+15206&amp;ll=40.458836,-
79.924694&amp;spn=0.008082,0.014119&amp;t=m&amp;z=1
4&amp;iwloc=A" style="color:#0000FF;text-
align:left">ComponentOne on a Map</a></small>

6. Nicky Bleiel
STC Mid-Atlantic Conference
9 March, 2012 6
Twitter “Follow” Buttons
Twitter Feeds
Embed a Twitter widget <script charset="utf-8"
src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
version: 2,
type: 'search',
search: 'Doc-To-Help OR DocToHelp OR #DocToHelp',
interval: 30000,
title: '',
subject: 'Follow Doc-To-Help on Twitter',
width: 250,
height: 300,
theme: {
shell: {
background: '#8ec1da',
color: '#ffffff'
},
tweets: {
background: '#ffffff',
color: '#444444',
links: '#1985b5'
}
}, features: {
scrollbar: true,
loop: true,
live: true,
behavior: 'default'
}
}).render().start();
</script>

7. Nicky Bleiel
STC Mid-Atlantic Conference
9 March, 2012 7
Videos
Are great for visual learners, but also add interactivity.
Facebook Badges

8. Nicky Bleiel
STC Mid-Atlantic Conference
9 March, 2012 8
Email Feedback
Adding a simple email feedback mechanism is
easy.
Dos

9. Nicky Bleiel
STC Mid-Atlantic Conference
9 March, 2012 9
What we want to do…
• Make information readable
• Expose layers
• Encourage discovery
• Include useful information
Don’ts

10. Nicky Bleiel
STC Mid-Atlantic Conference
9 March, 2012 10
What we don’t want to do…
• Overdo the click count.
• Get seduced by eye candy.
• Mess with established standards.
Things to Consider
• Remember accessibility.
• What about translation?
• Add analytics to browser-based help – get the
stats.
• Security

11. Nicky Bleiel
STC Mid-Atlantic Conference
9 March, 2012 11
References/Fur ther Reading
Interactivity: A Forgotten Art? http://www2.gsu.edu/~wwwitr/docs/interact/
Add Interactivity With Google Web Elements: http://www.web-hosting-
newsletter.com/2009/05/29/add-interactivity-with-google-web-elements/
Formulas for Readability: http://en.wikipedia.org/wiki/Readability
30 Ways to Improve Readability: http://www.problogdesign.com/blog-usability/30-ways-to-
improve-readability/
5 Tips For Improving Readability On Your Website: http://spyrestudios.com/5-tips-for-improving-
readability-on-your-website/
Bringing Interactivity To Your Website With Web Standards:
http://coding.smashingmagazine.com/2011/02/03/bringing-interactivity-to-your-website-with-web-
standards/
Progressive User Adoption: http://www.uxmatters.com/mt/archives/2009/03/progressive-user-
adoption.php
Try It!
• Google Maps: http://maps.google.com/
• Twitter widgets:
http://twitter.com/about/resources/widgets/
widget_search
• Twitter “follow” buttons:
https://twitter.com/about/resources/buttons
• Facebook Badges:
http://www.facebook.com/badges/page.php

12. Nicky Bleiel
STC Mid-Atlantic Conference
9 March, 2012 12
Questions?
Contact information:
Nicky Bleiel
ComponentOne
Pittsburgh, PA
nickyb@componentone.com
www.nickybleiel.com
www.doctohelp.com
Twitter: @nickybleiel