In late 2016, Gartner predicted that 30 percent of web browsing sessions could be achieved with no display by 2020. Even though there’s recent signs to suggest that the 2020 picture may be more complex than these broad-strokes projections imply, we are already seeing the impact that voice search, artificial intelligence, and smart software agents like Alexa and Google Assistant are creating about the way information can be consumed and found on the web.
In their latest book, Designing Connected Content, Carrie Hane and Mike Atherton define structured content as content that is”planned, developed, and connected out an interface so that it’s prepared for any interface” A structured content design strategy frames content resources–such as recipes, articles, product descriptions, how-tos, profiles, etc.–not as pages to be found and read, but as packages composed of small chunks of content information that relate to one another in meaningful ways.

The City of Seattle website‘s “Pay My Ticket” page, showing four methods to pay a parking ticket in a simple, all-text layout.

This”featured snippet” view is possible because the content writer, allrecipes.com, has broken this recipe into the smallest meaningful chunks suitable with this subject matter and audience, then expressed advice about these chunks and the relationships between them at a machine-readable manner. In this example, allrecipes.com has used both semantic HTML and connected data to make this content not merely a webpage, but in addition legible, accessible data that can be correctly interpreted, adapted, and remixed by algorithms and intelligent agents. Let us look at each one of these components in turn to learn how they work collectively across inference contexts, and indexing, aggregation.

    The City of Seattle’s”Pay My Ticket” page, though it lacks the polished visual style of Boston’s website, also communicates parking ticket options clearly to human visitors:
    Linked data expands the basic capabilities of semantic HTML by describing not just what kind of item a page component is (“Pay My Ticket” is an

    ), but in addition the real-world concept that item represents: this

    signifies a”pay activity,” which inherits the structural characteristics of”trade actions” (the market of goods and services for money) and”activities” (actions carried out by an agent upon an item ). Data generates a more nuanced description of the association between page components, and it provides the structural and technical advice that algorithms need to bring data together.
    Despite the simplicity of the City of Seattle parking ticket page, it ensures that the integrity of its material across contexts because it is composed. “Pay My Ticket” is a level-one going (

    ), and also every one of the choices below it are level-two key words (

    ), which signify they are inferior to the level-one component.
    These kinds of interactions that are fast, but are only one part of a much bigger problem: linked data is key to preserving the integrity of articles online. The associations I have used as examples, such as the hospitals, government agencies, and colleges I have consulted for years, do not measure the success of their communications efforts in page views or ad clicks. Success for these means connecting community members, constituents, and patients with precise information about the business and services. This definition of achievement easily applies to virtually any type of company working to further its business goals on the web.

    The City of Seattle website’s “Pay My Ticket” page, with the HTML heading elements outlined and labeled for illustration.

    Design practices that build bridges between consumer requirements and technology requirements to meet business goals are crucial to making this vision a reality. Content strategists, information architects, programmers, and expertise designers all have a role to play in designing and providing content options that are successful structured.
    In this example, we could see that Google is able to find lots of connections to Dr. Donion in its standard index outcomes, but it is not able to”understand” the data about those sources well enough to demonstrate an aggregated outcome. In this case, that the Knowledge Graph knows Dr. Donion is a Kaiser Permanente physician, but it pulls in the wrong place and the wrong physician’s title in its endeavor to build a Knowledge Graph display.
    The rising prevalence of voice for a manner of access to data makes supplying structured content even more important. Software agents that are intelligent and voice are not freeing users they are changing user behavior. Based on LSA Insider, there are numerous critical differences between voice queries and typed queries. Voice questions tend to be:
    In a content that was structured layout process, the connections between material chunks are explicitly defined and clarified. This makes the relationships between them and the content chunks legible to algorithms. Algorithms can then interpret a content bundle as the”page” I am looking for–or remix and accommodate that same content to give me a list of directions, the amount of celebrities on a critique, the amount of time left until an office shuts, and some number of additional concise answers to certain questions.
    These components, when designed communicate relationships and information hierarchy visually to algorithms, and semantically to viewers. This structure allows Google Assistant to reasonably stipulate the text from these

    headings represents payment options under the

    going”Pay My Ticket.”
    Google Structured Data Testing tool showing the markup for a bouillabaisse recipe website on the left half of the screen and the structured data attributes and values for structured content on the right half of the screen.
    The exact same allrecipes.com page viewed in Google’s Structured Data Testing Tool. The values that are machine-readable are shown by the pane on the right.

    In order to tailor results to such queries, software agents have begun using the data that was related in their disposal to assemble a succinct response and subsequently inferring purpose.
    Structured content is currently a mainstay of various types of information about the internet. Recipe listings, for example, have been predicated on structured articles for years. While I hunt, for example,”bouillabaisse recipe” on Google, I am provided with a standard list of links to recipes, in Addition to an overview of recipe measures, a picture, and a set of tags describing one example recipe:

    Google Structured Data Testing tool, showing the markup for Dr. Ruhlman's profile page on the left half of the screen, and the structured data attributes and values for the structured content on that page on the right half of the screen.
    A combined HTML code editor and preview window showing markup and results for heading, ordered list, and list item HTML tags.

    While this use of semantic HTML presents distinct benefits over the”page screen” styling we found on the City of Boston’s site, the Seattle page also shows a weakness that is typical of guide approaches to semantic HTML. You’ll notice that, in the Google Assistant outcomes, the”Pay by Phone” option we saw on the webpage was not listed. This irregularity in semantic structure could be what is causing this option to be omitted by Google Assistant from its results.
    These outcomes are not only aggregated from sources, but are translated and remixed to provide a response. Getting directions, placing a phone call, and accessing Dr. Ruhlman’s profile site on swedish.org are at the tips of my fingers.

    The model of then anticipating users parse and to detect these pages to answer questions and building pages in the pre-voice age, is becoming inadequate for successful communication. From participating in patterns of information discovery and hunting, it precludes associations. And it might lead software representatives to make inferences based on information routing clients to rivals who communicate more effectively.

    None of the links provided in the Google Assistant results take me straight to the”How to Purchase a Parking Ticket” webpage, nor do the descriptions clearly allow me to know I am on the right track. (I did not ask about requesting a hearing.) This is because the content on the Town of Boston parking ticket page is designed to convey content relationships visually but is not structured in a manner which also conveys those relationships to algorithms that are curious.

    The Company case for structured content design

    Say, for example, that I would like to collect more info about two recommendations I’ve been given for orthopedic surgeons.

    In addition to locating and excerpting info, such as recipe measures or parking ticket payment options, search and applications representative calculations now aggregate content from multiple sources using linked data.

    Because individuals know what lists and headings look like and mean HTML is both semantic and presentational, and they can be recognized by algorithms as elements with defined relationships.
    You’ll also notice that although Dr. Stacey Donion is an exact match in all the listed search results–which are numerous enough to meet with the first results page–we are revealed a”did you mean” link for another doctor. Multicare linked profiles to get their doctors and does, nevertheless, provide semantic.

    As a person reading this page, I understand what my options are for payingI can pay online, in person, over the telephone, or by mail. If I request Google Assistant how to pay a parking ticket in Boston, however, things get a bit confusing:

    The Google Assistant hunt that is equivalent , however, offers a much more useful effect than we see Boston. In cases like this, the Google Assistant result links directly to the”Pay My Ticket” page and lists a number of ways I will pay my ticket: online, by mail, and in person.

    Google Assistant app on iPhone with the results of a “what time does Doc Dr Stacey donion office close” query. The results displayed include a card with “8AM–5PM” and the label “MulitCare Neuroscience Center, Monday hours,” as well as links to call the office, search on Google, get directions, or visit a website.
    The City of Boston website's “How to Pay a Parking Ticket” page, showing a tabbed view of ways to pay and instructions for the first of those ways, paying online.

    Getting started: that and how

    HTML markup which focuses just on the presentational facets of a”webpage” may look perfectly fine to an individual reader but be completely illegible to an algorithm. If I want to find advice about how to pay a parking ticket, a connection from the home page takes me directly to the”How to Pay a Parking Ticket” display (scrolled to reveal detail):

    In this example, Dr. Ruhlman’s profile has been marked up with microdata based on the schema.org vocabulary. Schema.org is a collaborative effort backed by Google, Yahoo, Bing, and Yandex that aims to create a frequent language for electronic resources on the internet. This content that is ordered foundation provides the exact foundation on which content relationships can be constructed. The Knowledge Graph information box, for instance, comprises Google reviews, which aren’t part of Dr. Ruhlman’s profile, but that have been aggregated into this overview.
    Though each of these elements would look the exact same to a human the machine interpreting it reads an enormous difference. Even though WYSIWYG text entry fields can theoretically encourage semantic HTML that they fall prey into the idiosyncrasies of the very well-intentioned content writers. By making meaningful content structure that a core element of a website’s content management system, organizations may create semantically correct HTML every time, for every component. This is the base which makes it feasible to capitalize on the rich relationship descriptions given by data.
    MultiCare Neuroscience Center, you will remember, is where Dr. Donlon–the neuroscientist Google thinks I may be searching for, not the orthopedic surgeon I am actually searching for–clinics.
    By conveying clearly in an electronic context that now includes inference and aggregation, organizations are effectively able to consult with their users where users really are, make it on an internet search engine results page, a web site, or even a voice-controlled digital assistant. They’re also able to maintain control over their messages’ truth by ensuring the correct content are available and hauled across contexts.

The role of structured articles

Google Assistant app on iPhone with the results of a “what time does dr. ruhlman office close” query. The results displayed include a card with “8:30AM–5:00PM” and the label, “Dr. Ruhlman Scott MD, Tuesday hours,” as well as links to call the office, search on Google, get directions, and visit a website. Additionally, there are four buttons labeled with the words “directions,” “phone number,” and “address,” and a thumbs-up emoji.
Google Assistant app on iPhone with the results of a “how do I pay a parking ticket in Boston” query, showing results only weakly related to the intended content.
  • Content Modelling: A Master Skill,” Rachel Lovinger
  • While I ask Google Assistant what time Dr. Donion’s office closes, the outcome is not just less helpful but actually points me in the wrong direction. Rather than a selection of actions I’m presented with the hours of operation and contact info to MultiCare Neuroscience Center.
    This statement was intended to aid designers, strategists, and companies prepare for the growth of mobile. It continues to ring true for its age of data that is linked. With the increasing prevalence of supporters and queries that are voice-based, the website of an organization is less inclined to become a possible visitor’s first encounter with content that is abundant and less. In many instances — such as hours locating location information, telephone numbers, and ratings –this participation may be a user interaction with an information source.
    There’s not enough evidence within this small sample to encourage a wide claim that algorithms have”cognitive” prejudice, but even if we allow for possibly confounding variables, we can see the compounding issues we risk by dismissing structured content. Regardless, the Kaiser Permanente outcome we are given above for Dr. Donion is to get the wrong physician. Furthermore, in the Google Assistant voice hunt, the interaction format doesn’t confirm whether we intended Dr. Donlon; it only provides us with her facility’s contact info. In these cases, providing transparent, machine-readable content may only work to our benefit.

    Google Assistant app on iPhone with the results of a “how do I pay a parking ticket in Seattle” query, showing nearly the same results as on the desktop web page referenced above.

    Semantic HTML is markup that communicates information about the connections between document components, as opposed to just describing how they should look on screen. Semantic elements such as heading tags and list tags, for instance, imply that the text they enclose is a heading (

    ) for the set of list items (

  • ) in the ordered list (
      ) that follows.
      In addition to the indexing function that search engines perform, clever brokers and AI-powered search algorithms are bringing in the mainstream of obtaining information: inference and aggregation, additional modes. Consequently, design campaigns that focus on producing visually effective pages are no longer sufficient to ensure the integrity or accuracy of content. Instead, by focusing on providing access to data in a structured, systematic manner that is legible to both humans and machines, content publishers can ensure that their content is equally accurate and accessible in those new contexts, whether they’re producing chatbots or tapping into AI directly. In this article, we’ll look at effect and the forms of material that is structured, and we’ll close with a set of resources which could help you to get started with a structured content approach to information design.

      Program agent search and semantic HTML

      Linked data and content aggregation

      It’s likely that during repeated exposure to the search term”Dr. Stacey Donion,” Google Assistant fine-tuned the answers it provided. The initial result, nevertheless, suggests that smart brokers may be at least partially susceptible to the exact same accessibility heuristic which affects humans, wherein the information that’s easiest to remember frequently seems the most appropriate.

      Voice queries and content inference

      Google search results page for Dr. Donion, showing a list of standard links for Dr. Donion, and a 'Did you mean: Dr Stacy Donlon MD' link at the top. There is a Google info box, as with the previous search results page example. But in this case the box does not display information about the doctor we searched for, Dr. Donion, but rather for 'Kaiser Permanente Orthopedics: Morris Joseph MD.'
      The City of Seattle website’s 'Pay My Ticket' page, with two HTML heading elements outlined and labeled for illustration, and an open inspector panel, where we can see that the headings look the same to viewers but are marked up differently in the code.

      The hunt for another recommendation, Stacey Donion, MD, provides a different experience. Like the Town of Boston site over, Dr. Donion’s profile about the Kaiser Permanente site is perfectly intelligible to a sighted individual reader. However, because its markup is presentational, its material is virtually imperceptible to software agents.

      If we conduct Dr. Ruhlman’s Swedish Hospital profile site via Google’s Structured Data Testing Tool, we could observe that articles about him is structured as small, discrete elements, each of which can be marked up with descriptive types and characteristics that convey both the significance of these attributes’ values and how they fit together as a whole–all in a machine-readable format.

      Google search results page for Scott Ruhlman, MD, showing a list of standard links and an info box with an image, a map, ratings, an address, and reviews information.

      Practitioners from throughout the design community have shared a wealth of tools lately on creating material systems which work for algorithms and humans alike. To learn more about executing a structured content strategy for your company, these books and articles are a great place to start:

      Google search results info box for Dr. Ruhlman, showing an photo; a map; ratings; an address; reviews; buttons to ask a question, leave a review, and add a photo; and other people searched for.