Nicky BleielLead Information DeveloperComponentOne Doc-To-HelpSTC Mid-Atlantic ConferenceMarch 8, 2013
Biography — Nicky Bleiel     • 18+ years of experience as a technical       communicator.     • Vice President, STC     • ...
We will discuss…Best practices for single-sourcing to Mobile Helpand EPUB.
From One to Many           Browser-based               Help Content      Manual            Mobile Help               EPUB ...
Browser-based Help                      HTMLHelp                      (.chm)                      Mobile Help            M...
Mobile Facts andFigures
Device Trends          Growth rate of          iOS and Android          device adoption          faster than any          ...
Top Mobile OSshttp://gs.statcounter.com/#mobile_os-ww-monthly-201110-201209-bar
Top Mobile Browsershttp://gs.statcounter.com/#mobile_browser-ww-monthly-201110-201209-bar
Mobile HelpExamples
Apps v. Mobile Helpfrom http://www.noupe.com/how-tos/mobile-web-design-tips-and-best-practices.html
EPUB v. Mobile HelpEPUBs can be read on Mobile devices, butMobile Help is:• Easier to navigate• Easier/more robust search•...
Mobile Help
Motorola Razr Mobile Help   Razr Manual
iPhone 4 Mobile HelpiPhone Manual
T ips and BestPractices
Generic Mobile PersonaStart here, make more specific with scenarios:• Often distracted• Using one hand• “Fat finger”• Usin...
General Best Practices•   Keep it simple and prioritize content•   Use vertical navigation•   Be concise•   Simplify navig...
A Note About Navigation…http://developer.android.com/design/patterns/navigation.htmlhttp://developer.apple.com/library/ios...
Tables of Contents• For mobile, keep TOCs to no more than 2  levels (2 taps).• Keep TOC entries shortSingle source managem...
Tables• Avoid tables with dense text.• Large tables make scrolling necessary. In  EPUBs, there can be display issues.Singl...
TerminologyDesktop terminology – such as “Click” – doesnot apply.Single source management:• Manage with Variables• Avoid u...
Keep It ConciseContent  – Some Topics or text may not be necessary for    mobile.  – Consider a fresh edit of content.Sing...
MinimalismAccording to “The Nurnberg Funnel”  – Minimalizing the obstructiveness to the learner of the material itself.  –...
Images• Graphics should be used only as needed.• Images need to work across platforms.  Recommendations: PNG for screen ca...
VideoApproximately one billion YouTube videos arestreamed on cell phones every day.Different Oss/devices need different vi...
Indexes• Not necessarily needed in Mobile  – Users more likely to use Search  – “Fat Fingers” make them harder to useSingl...
AccessibilityFeatures built into devices, plus 3rd party apps.• We still need to do our part…Accessibility requirements:• ...
Other Mobile T ips        • Progressive information          disclosure.        Single source management:        • Incorpo...
Other Mobile T ips• Be creative with inline links.• Don’t place links too close  together.Single source management:• Displ...
Wrap-up
Remember• There are many options for the “Mobile  Experience”• It is possible to single-source successfully to  many devic...
References/Fur ther ReadingTen Best Practices for Your Mobile Website http://socialmedia.biz/2012/05/31/10-best-practices-...
References/Fur ther ReadingImage Format Considerationshttp://windowsphone.interoperabilitybridges.com/articles/chapter-5-i...
Handy Stuf fList of emulators:  – http://www.mobilexweb.com/emulatorsW3C mobileOK Checker:  – http://validator.w3.org/mobi...
Questions?Contact information:Nicky BleielComponentOnePittsburgh, PAnickyb@componentone.comwww.nickybleiel.comwww.doctohel...
Upcoming SlideShare
Loading in …5
×

Practical Tips for Single-Sourcing to Mobile and EPUB

885 views

Published on

Delivering content to mobile devices and eReaders is a new challenge, but one that can be managed in a single-sourcing workflow that also includes online Help and manuals. In this presentation, I discuss issues specific to mobile and EPUB outputs, best practices for how to adjust to them, and some testing tips.

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
885
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
11
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Practical Tips for Single-Sourcing to Mobile and EPUB

  1. 1. Nicky BleielLead Information DeveloperComponentOne Doc-To-HelpSTC Mid-Atlantic ConferenceMarch 8, 2013
  2. 2. Biography — Nicky Bleiel • 18+ years of experience as a technical communicator. • Vice President, STC • 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. • Technical Writing Instructor, Community College of Allegheny County • www.nickybleiel.com
  3. 3. We will discuss…Best practices for single-sourcing to Mobile Helpand EPUB.
  4. 4. From One to Many Browser-based Help Content Manual Mobile Help EPUB Etc …
  5. 5. Browser-based Help HTMLHelp (.chm) Mobile Help ManualsEPUB
  6. 6. Mobile Facts andFigures
  7. 7. Device Trends Growth rate of iOS and Android device adoption faster than any consumer technology in history Mobile Device Adoption Explodes Internationally
  8. 8. Top Mobile OSshttp://gs.statcounter.com/#mobile_os-ww-monthly-201110-201209-bar
  9. 9. Top Mobile Browsershttp://gs.statcounter.com/#mobile_browser-ww-monthly-201110-201209-bar
  10. 10. Mobile HelpExamples
  11. 11. Apps v. Mobile Helpfrom http://www.noupe.com/how-tos/mobile-web-design-tips-and-best-practices.html
  12. 12. EPUB v. Mobile HelpEPUBs can be read on Mobile devices, butMobile Help is:• Easier to navigate• Easier/more robust search• All-in-one pane design• A “UA”/web experience, not a “book” experience
  13. 13. Mobile Help
  14. 14. Motorola Razr Mobile Help Razr Manual
  15. 15. iPhone 4 Mobile HelpiPhone Manual
  16. 16. T ips and BestPractices
  17. 17. Generic Mobile PersonaStart here, make more specific with scenarios:• Often distracted• Using one hand• “Fat finger”• Using device in varying situations• Want fast load times
  18. 18. General Best Practices• Keep it simple and prioritize content• Use vertical navigation• Be concise• Simplify navigation• Be “thumb friendly”From http://socialmedia.biz/2012/05/31/10-best-practices-for-your-mobile-website/and http://googlemobileads.blogspot.com/2011/11/gomo-ten-mobile-site-best-practices.html
  19. 19. A Note About Navigation…http://developer.android.com/design/patterns/navigation.htmlhttp://developer.apple.com/library/ios/#documentation/userexperience/conceptual/mobilehig/UIElementGuidelines/UIElementGuidelines.html
  20. 20. Tables of Contents• For mobile, keep TOCs to no more than 2 levels (2 taps).• Keep TOC entries shortSingle source management:• Output-specific TOCs or restructure TOCs for all outputs• Use Conditional Text features
  21. 21. Tables• Avoid tables with dense text.• Large tables make scrolling necessary. In EPUBs, there can be display issues.Single source management:• Use Conditional text features• Use Collapsible Text features• Consider reimagining tables
  22. 22. TerminologyDesktop terminology – such as “Click” – doesnot apply.Single source management:• Manage with Variables• Avoid using device-specific terminology when possibleTouch Gesture Reference Guide
  23. 23. Keep It ConciseContent – Some Topics or text may not be necessary for mobile. – Consider a fresh edit of content.Single source management:• Review and revise content. (+1 for translation, usability)• Use conditions and/or variables to manage content as needed.
  24. 24. MinimalismAccording to “The Nurnberg Funnel” – Minimalizing the obstructiveness to the learner of the material itself. – Allow learners to start immediately on meaningfully realistic tasks. – Reducing the amount of reading and other passive activity.Goals of minimalism:• Helping to make errors and error recovery less traumatic and more pedagogically productive.• Easy-to-scan
  25. 25. Images• Graphics should be used only as needed.• Images need to work across platforms. Recommendations: PNG for screen captures, JPG for photos, GIF for simple graphics.Single source management:• Use Conditional text features.
  26. 26. VideoApproximately one billion YouTube videos arestreamed on cell phones every day.Different Oss/devices need different videoformats.Single source management:• Link to videos rather than embed.• Use Conditional text features.
  27. 27. Indexes• Not necessarily needed in Mobile – Users more likely to use Search – “Fat Fingers” make them harder to useSingle source management:• HAT should provide ability to hide the Index.
  28. 28. AccessibilityFeatures built into devices, plus 3rd party apps.• We still need to do our part…Accessibility requirements:• Add Alternative Text for graphics and video• Add table captions and summaries• Avoid creating links that open in new windows.Accessibility can also refer to bandwidth restrictions or availability of customerservice.http://www.webdesignerdepot.com/2009/06/10-tips-to-create-a-more-usable-web/
  29. 29. Other Mobile T ips • Progressive information disclosure. Single source management: • Incorporate Collapsible text
  30. 30. Other Mobile T ips• Be creative with inline links.• Don’t place links too close together.Single source management:• Display some links as buttons in Mobile outputs.• Use conditions and/or variables.
  31. 31. Wrap-up
  32. 32. Remember• There are many options for the “Mobile Experience”• It is possible to single-source successfully to many devices — as well as desktops
  33. 33. References/Fur ther ReadingTen Best Practices for Your Mobile Website http://socialmedia.biz/2012/05/31/10-best-practices-for-your-mobile-website/Ten Mobile Site Best Practiceshttp://googlemobileads.blogspot.com/2011/11/gomo-ten-mobile-site-best-practices.htmlTouch Gesture Reference Guide by Craig Villamor, Dan Willis, and Luke Wroblewskihttp://www.lukew.com/ff/entry.asp?1071Mobile Help Best Practices: http://our.componentone.com/2012/01/24/mobile-help-best-practices-part-1/“Mobilizing Your Content” by Nicky Bleiel tcworld magazine Feb 2013Slides — Best Practices for Mobile Outputs, tekom 2012http://conferences.tekom.de/fileadmin/tx_doccon/slides/170_Best_Practices_for_Mobile_Outputs.pdfProgressive Disclosure on Wikipediahttp://en.wikipedia.org/wiki/Progressive_disclosureHow Many Formats Do I Need for HTML5 Video?http://blog.zencoder.com/2010/10/06/how-many-formats-do-i-need-for-html5-video/
  34. 34. References/Fur ther ReadingImage Format Considerationshttp://windowsphone.interoperabilitybridges.com/articles/chapter-5-image-format-considerations-in-migration-of-iphone-applications-to-windows-phone-7User Interface Guidelines for Mobile and Tablet Deviceshttp://www.simonwhatley.co.uk/user-interface-guidelines-for-mobile-and-tablet-devicesCarroll, John M. The Nurnberg Funnel: Designing Minimalist Instruction forPractical Computer Skill, MIT Press, 1990Welinske, Joe. Developing User Assistance for Mobile Apps, WritersUA, 2011STC Intercom Magazine, November 2011 issue Tech Comm on the Move:Mobile Communication Technologies and Strategieshttp://intercom.stc.org/magazine/november-2011/W3C Mobile Web Best Practices: http://www.w3.org/TR/mobile-bp/http://www.w3.org/TR/mobile-bp/#bpgroupplayoutHow Do Users Really Hold Mobile Devices?http://www.uxmatters.com/mt/archives/2013/02/how-do-users-really-hold-mobile-devices.php
  35. 35. Handy Stuf fList of emulators: – http://www.mobilexweb.com/emulatorsW3C mobileOK Checker: – http://validator.w3.org/mobile/Resize My Browser: – http://www.resizemybrowser.com/
  36. 36. Questions?Contact information:Nicky BleielComponentOnePittsburgh, PAnickyb@componentone.comwww.nickybleiel.comwww.doctohelp.com@nickybleiel

×