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.

Structured Content UX Ireland

1,103 views

Published on

An introduction to the basic principals of creating structured content. Presented at UX Ireland on Friday 11th November 2016.

Published in: Internet
  • Be the first to comment

Structured Content UX Ireland

  1. 1. STRUCTURED CONTENT Bonny Colville-Hyde UX IRELAND 2016
  2. 2. Hello I’ve 10 years of experience working in UX (usability, information architecture, research and content strategy) for diverse clients including global ecommerce sites, financial systems, medical software & charities. I’m now a Product Manager at Immediate Media, where I look after BikeRadar.com, Cyclingnews.com, HistoryExtra.com, Countryfile.com and a host of other passion- driven brand sites.
  3. 3. USER EXPERIENCE & DIGITAL CONTENT
  4. 4. USER EXPERIENCE Usability Information Architecture Interaction Design Content Strategy Visual Design Service Design
  5. 5. The problem with UX & content •  We forget that content matters most •  Without good quality, appropriate, findable content, digital services are not fit for purpose •  No matter how much stylish design patterns you layer on bad content, it stays bad content
  6. 6. “It’s pointless to design a user experience without a deep understanding of the content that will fuel that experience” - KRISTINA HALVORSON
  7. 7. Digital Content •  Digital media (images, videos, audio etc) •  Words! Written text is the MOST IMPORTANT part of the internet
  8. 8. Managing Content Audit Strategy CreationMaintenance Measurement
  9. 9. Beyond a ‘page’
  10. 10. CONTENT
  11. 11. STRUCTURED CONTENT: •  Organisation •  Labeling •  Relationships •  Data
  12. 12. WHAT IS STRUCTURED CONTENT?
  13. 13. CONTENT WHAT IS IT? HOW IS IT DESCRIBED? WHAT RELATIONSHIPS DOES IT HAVE? HOW WILL IT BE FOUND? WHERE DOES IT COME FROM?
  14. 14. Structured Content: •  High level: the site wide structure, how all the content is structured •  Grouped: How a group of content types are structured •  Specific: How a piece of content is structured
  15. 15. Findability Search Engines: •  Keywords •  Content Quality •  Data Site Navigation: •  Menus •  Filters •  On site search Other Content: •  Relationships •  Link Strategy •  Content Types Social Media: •  Titles •  Visual Assets •  Sharability
  16. 16. High level structure Site navigation: primary, secondary, supplementary
  17. 17. Grouped content structures Taxonomies: controlled vocabularies & labels Content types: relationships
  18. 18. ACTIVITY #1 We are going to create a list of CHEESES. Tell me a name of a cheese…
  19. 19. CHEDDAR BRIE MOZZARELLA CAMEMBERT RED LEICESTER PARMESAN STILTON ROQUEFORT WENSLEYDALE FETA GORGONZOLA EMMENTAL HALLOUMI GOUDA ARDRAHAN BURREN GOLD DUBLINER CHEESE
  20. 20. CHEESE CHEDDAR BRIEMOZZARELLA CAMEMBERTRED LEICESTER PARMESAN STILTON ROQUEFORT WENSLEYDALE FETA GORGONZOLA EMMENTAL HALLOUMI GOUDA ARDRAHAN BURREN GOLD DUBLINER BRITISH ITALIAN FRENCH DUTCH GREEK IRISH CYPRIOT
  21. 21. CHEESE CHEDDAR BRIE MOZZARELLA CAMEMBERT RED LEICESTER PARMESAN STILTON ROQUEFORT WENSLEYDALE FETA GORGONZOLA EMMENTAL HALLOUMI GOUDA ARDRAHAN BURREN GOLD DUBLINER HARD CHEESE SOFT CHEESESEMI SOFT CHEESE
  22. 22. CHEESE CHEDDAR BRIE MOZZARELLA CAMEMBERTRED LEICESTER PARMESAN STILTON ROQUEFORT WENSLEYDALE FETA GORGONZOLA EMMENTAL HALLOUMI GOUDA ARDRAHAN BURREN GOLD DUBLINER CHEESES I LIKE CHEESES I DON’T LIKE CHEESES I’VE NOT TRIED CHEESES I’VE NOT YET RATED
  23. 23. TAXONOMIES
  24. 24. Taxonomy Term list: A standardised, controlled list of terms or tags that are used consistently Hierarchy: A structured taxonomy of terms that have a structural relationship with each other (e.g: Parent --- Child) Thesaurus: Maps relationships between items to help systems understand how they relate
  25. 25. CYAN Controlled Vocabularies Controlling vocabularies used in taxonomy term lists helps us avoid poor experiences, such as: Sprawling terminology Reduced findability Miss-match with user’s language BRIGHT BLUE 0 Results Wellingtons Gum boots AZURE
  26. 26. CHEESE LOCATION CONTINENT COUNTRY TYPE HARD SEMI SOFT SOFT BLUE MILK TYPE COW SHEEP GOAT BUFFALO PASTURISED UNPASTURISED
  27. 27. ACTIVITY #2 We have a lot of different content about cheeses. What sort of content types might these be? How might these content types relate to each other?
  28. 28. REVIEW NEWS PRESS RELEASE PRODUCT RECIPE CASE STUDY TRAVEL GUIDE DIET CONTENT TYPES
  29. 29. Content Models 1. Create a set of ‘things’ associated with the domain (get a domain expert to work with you) 2. Join the ‘things’ together based on their relationships e.g: RECIPE <- - - -> INGREDIENT Making a simple content model
  30. 30. REVIEW NEWS STORY PRESS RELEASE PRODUCT RECIPE CASE STUDY TRAVEL GUIDE DIET CONTENT TYPES THIS IS A SIMPLE CONTENT MODEL
  31. 31. Sample Site Map 1 PRODUCTS RECIPES A – Z CONTINENT COUNTRY TYPE MILK EASY INTERMEDIATE EXPERIENCED HOME
  32. 32. Sample Site Map 2
  33. 33. Page stacks suck PRODUCTS CHEESES ? ? ?
  34. 34. Faceted Navigation FIXED: e.g: •  Geographic •  Alphabetical These are closely linked to you domain and established conventions AMBIGUOUS: e.g: •  Task-based •  Audience type These are closely linked to your specific audience’s mental model
  35. 35. Faceted Navigation: AUDIENCE SUBJECT PRODUCT FORMAT e.g: ‘Beginner’ e.g: ‘How to guide’ e.g: ‘Brand’ ‘Price’ ‘Features’ e.g: ‘Video’
  36. 36. In Summary You need to plan: How to group content together How to label those groups How to navigate those groups
  37. 37. Un-Structured Content Page driven: TITLE BODY COPY BODY COPY BODY COPY BODY COPY BODY COPY BODY COPY BODY COPY BODY COPY BODY COPY BODY COPY. BODY COPY BODY COPY.
  38. 38. Structured Content Data driven: TITLE META DATA RELATIONSHIPS TYPE INTRO SUMMARY BODY COPY BODY COPY BODY COPY BODY COPY BODY COPY BODY COPY. AUTHOR
  39. 39. Specific content structure Data: Information about content Specific template requirements: purpose and requirements
  40. 40. WORKING WITH REAL CONTENT
  41. 41. ACTIVITY #3 Identifying Content Structures 1. Look for components that could have relationships with other content e.g: STAR RATINGS 2. Create a list of all the components that you could standardise across all reviews ALL REVIEWS HAVE THESE ‘THINGS’: • STAR RATINGS: with a value between 0 stars and 5 stars • • • •
  42. 42. ACTIVITY #3 Making Content Findable 1. Choose a ‘thing’ from your list and explore how it could make the review more findable 2. Sketch out how users could use an interface to find content with this ‘thing’ Filter reviews by STAR RATINGS:
  43. 43. HELPING MACHINES UNDERSTAND CONTENT
  44. 44. Metadata & Microdata Metadata and Microdata help search engines, APIs, feeds and content management systems make sense of content and improve its findability They use controlled vocabularies to ensure they are consistent.
  45. 45. METADATA
  46. 46. Metadata
  47. 47. Metadata BEDROOM SHED
  48. 48. Metadata •  Data about data •  Essential for findability: it makes content understandable to search engines and content management systems •  Describes relationships between content through taxonomies and content types
  49. 49. MICRODATA
  50. 50. Microdata •  Stores data about content in context: specific pieces of information are given a structure so machines can take more meaning from them •  Different standardised schemas exist e.g: RDF, Schema.org, Dublin Core etc
  51. 51. Schema.org Enables you to tag specific things within HTML to give more context. “Itemscope”: Broadly identifies the theme of the thing “Itemprop”: Provides the detail about the thing
  52. 52. A simple author bio: Aoife Glass Women’s Editor, BikeRadar I’m a mountain biker at heart, also drawn to the open road. I likes big long adventures in the mountains. Usually to be found in the Mendip Hills or the Somerset Levels in the UK. I’m passionate about women's cycling at all levels.
  53. 53. <section itemscope itemtype="http://schema.org/Person"> <span itemprop="name">Aoife Glass</span>, <span itemprop="jobTitle">Womens Editor</span> <span itemprop="affiliation">BikeRadar</span>. I’m a mountain biker at heart, also drawn to the open road. I likes big long adventures in the mountains. Usually to be found in the Mendip Hills or the Somerset Levels in the UK. I’m passionate about women's cycling at all levels. </section> Add microdata:
  54. 54. What Google understands: https://search.google.com/structured-data/testing-tool/u/0/ https://developers.google.com/search/docs/guides/mark-up-content
  55. 55. To Close: Structured content makes content more findable which is essential to any user experience. It blends multiple disciplines including IA, content strategy, usability and SEO is something UX PR actioners should absolutely care about ;-)
  56. 56. Useful Tools Trim: Content audit tool coming soon Gettrim.co | @Trimvincible Gather Content: Fabulous content workflow tool Gathercontent.com | @GatherContent Hemmingway App: Lovely tool to test your content readability Hemmingwayapp.com Google: Structured Data test tool https://search.google.com/structured-data/ testing-tool/u/0/
  57. 57. Glossary Content Modelling: The process of mapping the relationships between pieces of content or information. A content model can include high level relationships within a domain and more detailed relationships between pieces of content. Structuring Content: The process of taking content and breaking it into parts to make it more findable and reusable for humans and machines. Data Modelling: The process of modeling a database inline with the type of queries it will need to handle.This is done by a developer.
  58. 58. Service Oriented Architecture: A development architecture that separates data, processes/tasks and interfaces to make it more flexible. A service or API (Application Programing Interface) acts as a middleman that processes requests from the editorial interface and user interface with the information stored in databases. Content Management System: A system that enables a group of people to manage content in a fairly straightforward way. Each CMS has its own way of dealing with content types and favours a specific one, e.g:‘Posts’ in WordPress. Some CMS platforms are much more flexible than others, for instance Sitecore will enable you to build anything but it comes with the challenge that it has to be built, whereas WordPress is restrictive but is ready to go, out-of-the-box. Glossary
  59. 59. Metadata: Data about data. Metadata describes information about the content, such as structural information like author, publishing date, ID, or taxonomy items in a format either defined by the CMS, or a universal schema, or a mix of both. Metadata is used to find content based on specific queries, so tools like search rely heavily on it. Glossary Taxonomy: In the context of creating and managing digital content a taxonomy is a controlled vocabulary that is used consistently to describe pieces of content. A taxonomy can have a hierarchical element to it, to describe the relationship between different taxonomy items.
  60. 60. Planning Pages Page Tables can be used to specify content requirements at the page level. These were originally created by Brain Traffic. TITLE: MAIN CONTENT PRIORITY: SECONDARY CONTENT PRIORITY: PAGE OBJECTIVE:

×