<p>With the advent of real-time marketing technologies and design methodologies like atomic design, web pages are no longer just “pages” – they are collections of modular, dynamic data that can be rearranged according to the context of the user.</p>
<p>To provide optimized user experiences, marketers and publishers need to enrich websites with additional structure (taxonomy and metadata). By adding metadata, content becomes machine-understandable, which leads to better interoperability, SEO, and accessibility.</p>
<p>Structured content is also one of the foundations of real-time personalization; By tagging and describing content with metadata, personalization engines like Acquia Lift can provide more relevant content to individual users.</p>
<p>In this webinar, we will discuss:</p>
<ul>
<li>How to further enrich your Drupal website with structure</li>
<li>Taxonomy best practices for dynamic content and how to configure auto-tagging in your Drupal site</li>
<li>How to leverage Microdata and the schema.org vocabulary to improve SEO through rich results</li>
<li>How to improve the social shareability of your content through the use of Twitter Cards and OpenGraph tags</li>
<li>Why Drupal 8 is the best CMS platform for managing structured content</li>
</ul>
2. Dave Sawyer
Senior Solutions Architect
FFW
dave.sawyer@ffwagency.com
About me:
@cmsdave
cmsdave
FFWagency.com @FFWglobal
3. > Full-service digital agency
> World’s largest Drupal agency
> 450 employees worldwide
> Portfolio includes Pfizer, NBC,
Stanford University, City of
Copenhagen, and General Electric
> http://ffwagency.com
> https://www.drupal.org/ffw
About FFW
4. Agenda.Today
1. What is “Structured Content“?
2. Benefits
3. Structured Data Markup and Schema.org
4. Drupal Implementation (D7 and D8)
6. Recommended Tools
7. Workflow and Auto-Tagging
7. Social Sharing
8. Why Drupal is the Best CMS for Structured Content
FFWagency.com @FFWglobal
13. Structured Content Optimization
Making content understandable
to search engines and other
systems through increased
metadata and adherence to
open data standards.
20. Reusable
Structured content can be
repurposed according to the
context of the channel or user.
Efficiencies and cost savings can be achieved
as more and more content components are
reused.
21. Shareable
Content that enriched with metadata
formats (such as OpenGraph) conveys
more context and looks better in
previews on social platforms.
22. Translatable
Content that has been broken out into
fields and that is presented with semantic
structure is easier to translate and
maintain for a global audience.
26. Structured Data Markup
• Structured data markup refers to a text-based
organization of data that is included in a file and
served from the web.
• It describes things on the web, along with their
properties.
• Uses the schema.org vocabulary
FFWagency.com @FFWglobal
27. Schema.org
• An open community effort to promote standard
structured data in a variety of online applications
• Schema.org provides a vocabulary to describe things
such as Products, Places, Persons, Organizations,
Events, etc.
• Schema.org vocabulary can be used with several
different encodings
FFWagency.com @FFWglobal
29. Microdata
• Approach: exposing additional data directly within
HTML markup
• Uses HTML attributes itemscope and itemprop
• https://www.w3.org/TR/microdata/
FFWagency.com @FFWglobal
30. Simple Microdata Example
<div itemscope itemtype="http://schema.org/Movie">
<h1 itemprop="name">Avatar</h1>
<span>Director: <span itemprop="director">James Cameron</span>
(born August 16, 1954)</span>
<span itemprop="genre">Science fiction</span>
<a href="../movies/avatar-theatrical-trailer.html"
itemprop="trailer">Trailer</a>
</div>
FFWagency.com @FFWglobal
31. RDFa
• Similar approach to Microdata: data embedded in
HTML markup
• Uses property and typeof attributes
• Default format for Drupal 7 and 8
• https://rdfa.info/
FFWagency.com @FFWglobal
33. JSON-LD
• JavaScript Object Notation for Linked Data
• Uses JavaScript instead of HTML attributes
• Not as easy for humans to read but provides
separation between layout and data structure.
• Google’s recommended format
• http://json-ld.org/
FFWagency.com @FFWglobal
37. Under the hood: RDF
• Resource Description Framework
• W3C standard for data modeling and sharing
• Built-into Drupal 7 and 8
• Enables semantically enriched output for Drupal sites in the form of
RDFa.
• Great video overview:
The Semantic Web and Drupal by Lin Clark
https://www.youtube.com/watch?v=xcPf4PeF57Y
FFWagency.com @FFWglobal
38. High Level Approach
1. Create a structured content type in Drupal
2. Identify which schema from schema.org is associated
with your content type
(e.g. Person, Event, Product, etc.)
3. Create a mapping of fields on your content type to
properties from the schema
(e.g. a Job Title field on a Person content type would map to the jobTitle
property on the Person schema)
FFWagency.com @FFWglobal
41. Drupal 7 module
• Schema.org Module
• Enable the collections
of schemas available at
schema.org on your
Drupal 7 site.
• https://www.drupal.org
/project/schemaorg
FFWagency.com @FFWglobal
42. D7 Approach
• Schema.org module adds a “Schema.org settings” panel to
the node edit form where you define the schema type.
Autocomplete of types.
• Provides a UI to map fields on your content types to
schema.org properties.
• Great video walk-through by Stephane Corlosquet!
Using Schema.org in Drupal 7 and RDFa:
https://vimeo.com/29821887
FFWagency.com @FFWglobal
43. Drupal 8
• Schema.org
configuration tool
(RDF UI) module
• Specify mappings between content
types and fields with types and
properties of Schema.org
• Mappings will be embedded in HTML
as RDFa, to provide semantically rich
data.
FFWagency.com @FFWglobal
https://www.drupal.org/project/rdfui
44. D8 Approach
• Similar to D7 approach, provides a UI to map fields on your
content types to properties on a schema
• Also provides a simple way to create a new content type
based on a schema.org schema.
• Helpful video walk-through by Sachini Herath:
https://www.youtube.com/watch?v=l31MlxOCG-4
FFWagency.com @FFWglobal
46. Structured Data Testing Tool
• Provides a variety of ways to develop, test, and modify your
structured markup.
• Prototype and make on-the-fly adjustments.
• https://search.google.com/structured-data/testing-tool
Reference: https://developers.google.com/search/docs/guides/prototype
FFWagency.com @FFWglobal
49. Structured Data Markup Helper
• Shows you how to update your site so that Google and
other systems can understand the data it contains.
• https://www.google.com/webmasters/markup-helper/
Reference: https://support.google.com/webmasters/answer/3069489?topic=3070267
FFWagency.com @FFWglobal
53. Auto-tagging with Drupal
• Automatic tagging (or suggestion of
tagging) based on analyizing
content and metadata
FFWagency.com @FFWglobal
54. Two types of auto-tagging
• Third-party system that parses and analyzes the
content then returns structured content metadata
such as categories (e.g. Thomson Reuters Open
Calais™)
• CMS-driven: based on criteria within the CMS or
content workflow, tags are automatically applied
FFWagency.com @FFWglobal
55. Auto-tagging:
Example Use Cases
1. Combined criteria
• Different team members tagging content with different vocabularies
• Auto-tagging applies when criteria is met across vocabularies or field values
2. Imported Content
Tags are automatically applied when content is imported or ingested via feeds.
3. Workflow or Event-based
Example: When editor places a reference to content, a rule fires and tags the content
as “featured”
4. Time-based
FFWagency.com @FFWglobal
57. Drupal 7 Auto-Tagging
• Many contrib modules for different approaches
• Comparison wiki page:
https://groups.drupal.org/node/38290/
FFWagency.com @FFWglobal
58. Example Approach for D7 #1
• Taxonomy Autotagger module
https://www.drupal.org/project/autotag
• Allows a vocabulary to be searched against for suggestions of
terms related to the content of a node.
• Additional option is provided on a content type configuration page
to specify which text fields should be searched for terms in
specified vocabularies, and which field should then be populated
with the results.
FFWagency.com @FFWglobal
59. Example Approach for D7 #2
• Rules Autotag module
https://www.drupal.org/project/rules_autotag
• Light-weight approach for auto-tagging full-text content by
matching taxonomy terms
• Extracts terms from a given text which match a given
vocabulary
FFWagency.com @FFWglobal
60. Drupal 8 Auto-Tagging
• Not many contrib options yet.
• D8 solution may require custom module(s)
FFWagency.com @FFWglobal
61. Example Approach for D8
• Suggested Terms module
https://www.drupal.org/project/suggestedterms
• Provides "suggested terms" for free-tagging Taxonomy fields
based on terms already submitted.
• Replaces the description field on free-tagging fields with a
clickable list of previously entered terms.
FFWagency.com @FFWglobal
62. Use of multiple vocabularies
• Best practice is to use multiple taxonomy
vocabularies to describe various aspects of the
content
• What the content is about AND who it is
intended for
• Public-facing tags – e.g. Topic tags
• Private/Internal tags – e.g. Audience/Persona tags
FFWagency.com @FFWglobal
64. Social Sharing
• Improve the social “shareability” of your content
through the use of Twitter Cards and OpenGraph
tags
• Make your Drupal content look great when shared
on social media
• Create a documented guidelines for your content
contributors and editors
FFWagency.com @FFWglobal
66. Twitter Card Metatags Example
<html>
<head>
<title>Small Island Developing States Photo Submission</title>
<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="@flickr" />
<meta name="twitter:title" content="Small Island Developing States Photo
Submission" />
<meta name="twitter:description" content="View the album on Flickr." />
<meta name="twitter:image"
content="https://farm6.staticflickr.com/5510/14338202952_93595258ff_z.jpg" />
</head>
…
FFWagency.com @FFWglobal
67. Drupal Implementation (D7 and D8)
• Metatag module
https://www.drupal.org/project/metatag
• Module provides access to numerous types of metatags
• For social optimization, enable and configure the use of
Twitter Card tags and OpenGraph tags.
• Further reading from FFW blog:
https://ffwagency.com/blog/integrating-twitter-cards-and-facebook-
opengraph
FFWagency.com @FFWglobal
75. Why Drupal is the best CMS
for Structured Content
1. Separation Structure and Presentation
2. Excellent tools for managing fielded entites
3. Powerful taxonomy and tagging
4. Native RDF and contrib options for Schema.org
5. Full-featured metatag controls
FFWagency.com @FFWglobal