Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

The UX of Content

1,234 views

Published on

Within the UX ecosystem, content plays an important role. Or rather, it should - after all, it's the primary way that our customers understand our instructions, shop for our products and services, and interact with our brands. So why don't we apply writing principles to our content with the same stringency that we test the rest of our UX? Anyone developing content for a content management system, from the lowly blog to enterprise-level systems, needs an understanding of how to create content for modular content environments. This presentation covers some of the most pertinent editorial principles and technical standards that all content practitioners should know, and explains when it's important to uphold the rules and when to break them.

Published in: Marketing, Design
  • Hey guys! Who wants to chat with me? More photos with me here 👉 http://www.bit.ly/katekoxx
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Hello! Get Your Professional Job-Winning Resume Here - Check our website! https://vk.cc/818RFv
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

The UX of Content

  1. 1. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reservedScroll @ScrollUK @rahelab The UX of Content Delivering better user experiences Photo credit: Rahel Anne Bailie
  2. 2. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab RAHEL ANNE BAILIE Chief Knowledge Officer Scroll (UK)
  3. 3. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved Clumsiest person ever
  4. 4. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved Cursed by technology
  5. 5. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab
  6. 6. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved Point taken: Without content, the UX falls flat
  7. 7. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved Content completes the UX
  8. 8. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved What do UX designers do?
  9. 9. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab User Experience Honeycomb – Peter Morville
  10. 10. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved Similar for content designers
  11. 11. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab Content Strategy Honeycomb – Rahel Anne Bailie Relevant Timely Accurate Informative Standards- based Engaging Value
  12. 12. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab gov.uk/service-manual/the-team/content-designer.html Content designers must be able to: •identify user needs– based on: •legacy content •source material provided by policy colleagues •feedback from users and stakeholders •analytics data both from the site and from search engines •understand and incorporate the results of user testing •gain an in-depth knowledge of a wide range of subjects – so they can make informed decisions about the best way to present information to users •develop content plans and strategies – high-level plans showing how the identified user needs will be met •write great content – in plain English, optimised for the web and according to house style •edit content – making sure the site remains accurate, relevant, current and optimised both for users and search engines •review the work of other editors – to make sure consistency and excellence is maintained across the site •communicate the principles of good content design to others in the organisation •make tough decisions and work hard for the user – grappling with complicated legislation and turning it into clear, clean, crisp web content (that still has enough depth to be useful) •work with developers and designers to create better solutions – for example, writing logic and content for smart answers •publish content – using various systems •advocate for the user and act as a guardian for the site – pushing back on change requests that don’t contribute to meeting user needs and incorporating change requests that do •build positive relationships with others inside the team and in the wider organisation •innovate and anticipate – excellent content designers are excited about the possibilities of web content and contributing to the digital sector’s future
  13. 13. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab Add value through content7
  14. 14. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab From: Elcom-Tech.com
  15. 15. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved What does content UX look like? Or sound like? Or read like?
  16. 16. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab Content must be relevant1
  17. 17. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab
  18. 18. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab
  19. 19. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab 19 replies, no answer
  20. 20. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab Developer ECM – Web Content Digital Content Assistant – Year FTC
  21. 21. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved Relevance Satisfaction (Useful)
  22. 22. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab Content must be accurate2
  23. 23. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab From: Citymapper
  24. 24. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab
  25. 25. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved Content accuracy Trust (Credible)
  26. 26. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab Content must be informative3
  27. 27. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab
  28. 28. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab Betfair World Series of Poker Series of Poker Series and Ep
  29. 29. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab
  30. 30. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab
  31. 31. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved Informative Engagement (Useful)
  32. 32. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab Content must be timely4
  33. 33. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab
  34. 34. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab
  35. 35. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved Timeliness Empowered (Usable)
  36. 36. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab Content must be engaging5
  37. 37. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab
  38. 38. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab
  39. 39. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved Engagement Respect (Desirable)
  40. 40. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab Content must use standards6
  41. 41. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab To display content in ways helpful to users, it must: • Converge (show content from multiple sources) • Integrate (embed data into content) • Syndicate (send content out on demand) To do that, content needs these technical qualities: • Structured to a standard (for re-use and automated delivery) • Well-formed (using recognised schema) • Semantic (for filtering, processing, findability) • Editorial rigour (consistent vocabulary, genre-appropriate) The effect on user experience
  42. 42. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved Heads: Editorial standards
  43. 43. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab Writing for humans – schemas and patterns Basic conventions – editorial patterns: • Titles are for sections; subtitles are for subsections • Contextual introductions • Lists for like items; numbered lists for steps • Tables to present data • Headings on tables; captions on images Use the conventions specific to content types – common ones: • News releases • Tasks • Recipes Helps with comprehension; makes content accessible to everyone
  44. 44. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab Writing for humans – minimalism Method of writing that supports “skip, skim, and scan” of content: • Action-oriented: assume users are on a mission • Anchored in the task domain: write discrete topics for known user activities • Support errors: know where users fumble, and address the issues up front • Support multiple uses: reduce “noise” and support users as they “read to do” • Readers use content out of sequence Gives users just-in-time information, reduces interference with the user’s sense-making process; doesn’t try to prevent all mistakes but does help users who make mistakes
  45. 45. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab Writing for humans - plain language Basic principles: • Use active voice – makes meaning more clear • Use first-person, informal address • Compose short sentences with simple structures • Limit sentences to a single concept • Use common words, and fewer words when possible • Keep your message brief and focused • Adopt a conversational tone Keeps it simple without dumbing it down; allows readers to scan for the information they want
  46. 46. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab Writing for humans - controlled language Disciplined use of word forms: • Remove homonyms • Remove synonyms • Remove polysemous words Controlled grammatical constructions: • Use active voice to be clear about assignment • Simple syntax (avoid extraneous phrases) • Clear modifiers (placement and word usage) • Parallelism (for clarity of meaning) • Use schema consistently (eg: list features in the same order) • Avoid idiom, pronouns Creates clarity and precision; allows for content re-use
  47. 47. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab Writing for humans – translation-readiness Translation readiness eases translation and costs, but primary reason is about reader clarity: • Consistency and clarity reduce the cognitive load for everyone • Users expect good brands to have good content in their language • Many readers have to read in their second or third language • Some readers will use machine translation or dictionaries • Break up sentences more than usual • Minimise text, and use present tense • Avoid noun strings, hard-to-translate sentence constructs (passive voice, gerunds), and abbreviations (such as e.g. or i.e.) • Avoid jargon, idiom, and other culturally-specific terms • Use terms and phrases consistently Can reach more of your audience, even if content is never translated
  48. 48. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab Writing for humans – accessibility It’s the right thing to do; aside from that: • Helps people using adaptive technology (screen readers, weighted font for dyslexia, for example) • Helps people with low literacy skills, dyslexia, and similar issues • Helps machines read content (good for SEO) Accessibility issues are handled in different ways: • By the Web CMS and other output mechanisms (example: no blinking, or alternatives to Flash elements, fonts for dyslexia) • Technology and authoring: (example: alt text musts be provided, and provisioned in the CMS • Authoring (example: breaking up text with headings) Accessibility guidelines is a legal issue; and mitigates risk of lawsuits
  49. 49. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab Writing for humans – content re-use Create content “building blocks”: • Consistent tone and voice • Consistent vocabulary • Complimentary grammatical structures • Understanding of the re-use contexts • Tagged with “attributes” to allow automated re-use • Semantically structured to facilitate machine understanding Content components can be assembled in multiple ways and used in multiple contexts
  50. 50. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved Tails: Technical standards
  51. 51. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab Writing for computers – content types Most content types have associated standards: • Copywriting – displayed text and its metadata • Taxonomy – the terminology, navigation terms • Images – captions, call-outs, and the metadata • Infographics – titling, captions, call-outs, and the metadata • Videos – titling, captioning, transcription, and the metadata • Podcasts – titling, transcription, and the metadata • Transactional copy – navigation text, interface text, labels, error messages, help messages, administrative messages
  52. 52. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab moz.com/blog/101-google-answer-boxes-a-journey-into-the-knowledge-graph
  53. 53. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab Writing for computers - findability Standards and structure: • Title tags and URLs • Concise opening sentence with keywords • Closed tag pairs on paragraphs, lists, and so on • Semantic tags on as many elements as possible • Microformats • Call-to-action links • Compressed images • Possibly video moz.com/ugc/google-s-direct-answers-how-to-keep-visitors-coming-to-your-site
  54. 54. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved Standards Efficiency (Accessible)
  55. 55. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab Add value through content7
  56. 56. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved Match content to reading habits
  57. 57. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.aacc.edu/tutoring/file/skimming.pdf Reading habits Skip, skim, and scan
  58. 58. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.cisco.com/en/US/docs/routers/access/800/850/software/configuration/guide/routconf.pdf
  59. 59. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.gov.uk/guidance/style-guide/a-to-z-of-gov-uk-style Reading habits Skip, skim, and scan Use standard editorial conventions
  60. 60. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab houseandgarden.co.uk
  61. 61. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.youtube.com/watch?v=EtHNDAoQLSQ Reading habits Skip, skim, and scan Use predictable editorial conventions Let users read before “interrupting” with links
  62. 62. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab xe.com
  63. 63. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab boxesandarrows.com/implementing-a-pattern-library-in-the-real-world-a-yahoo-case-study/ Reading habits Skip, skim, and scan Use predictable editorial conventions Let users read before “interrupting” with links Provide predictable content
  64. 64. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab foodnetwork.com
  65. 65. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.w3.org/TR/UNDERSTANDING-WCAG20/minimize-error-reversible.html Reading habits Skip, skim, and scan Use predictable editorial conventions Let users read before “interrupting” with links Provide predictable content Explain through feedback
  66. 66. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab three.co.uk
  67. 67. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved Content can drive value in multiple ways
  68. 68. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab www.scroll.co.uk © 2015 Scroll LLP All rights reserved Content is at the heart of UX
  69. 69. www.scroll.co.uk © 2015 Scroll LLP All rights reserved @ScrollUK @rahelab London, UK By email: rahel.bailie@scroll.co.uk info@scroll.co.uk Twitter: @ScrollUK / @rahelab By telephone: UK +44 (0)7869 643 685 Speaking and workshops: bailie.com Scroll

×