The business case for structured content design

Stacey Donion, the hunt for a second recommendation, MD, provides a very different encounter. Like the City of Boston site over, Dr. Donion’s profile on the Kaiser Permanente website is perfectly intelligible to a sighted human reader. However, since its markup is presentational, its material is almost invisible to software agents.
Though each of those elements would look the same into a human producing this page, a difference is read by the machine distributing it. Even though HTML can be theoretically supported by WYSIWYG text entry fields, in practice they all too often fall prey into the idiosyncrasies of the very content authors. By making content structure that is meaningful that a core part of a site’s content management system, organizations may produce correct HTML for each component, every time. This is the base which makes it feasible to capitalize on the rich relationship descriptions given by connected data.

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.
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.
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.
  • More;
  • more likely to ask who, what, and where;
  • more conversational;
  • and much more specific.

This statement was intended to help designers, strategists, and businesses get ready for the growth of mobile. It continues to ring true for its age of data that is connected. With the prevalence of inquiries that are voice-based and supporters, an organization’s site is less and less likely to become a potential customer’s first experience with content that is rich. Such as hours, locating location information, telephone numbers, and evaluations –this participation might be a user interaction with an information resource.

While this usage of semantic HTML offers distinct advantages over the”page display” styling we found on the Town of Boston’s site, the Seattle page also shows a weakness that’s typical of guide approaches to semantic HTML. You will notice that, at the Google Assistant results, the”Pay by Phone” option we found on the webpage was not listed. This irregularity in structure may be what’s causing this option to be omitted by Google Assistant .
Not one of the links supplied in this Google Assistant results take me directly to the”How to Pay a Parking Ticket” webpage, nor do the descriptions definitely allow me to know I’m on the right track. (I didn’t inquire about requesting a hearing) This is because the content on the Town of Boston parking ticket page is styled to communicate content relationships visually to individual readers but is not structured semantically in a way which also communicates those connections to algorithms that are curious.

The role of structured articles

In late 2016, Gartner predicted that 30 percent of web browsing sessions would be achieved with no display by 2020. Earlier the same year, Comscore had predicted that half of all searches are voice hunts by 2020. Though there’s recent signs to imply that the 2020 picture may be more complicated than these broad-strokes projections imply, we’re already seeing the effect that voice hunt, artificial intelligence, and smart software agents such as Alexa and Google Assistant are producing on the way data can be found and consumed on the internet.

    Linked data and content aggregation

    The prevalence of voice for a mode of access to information makes supplying structured content even more important. Smart software agents and voice are not solely freeing users from their keyboards, they are changing user behavior. According to LSA Insider, there are several critical differences between voice queries and typed questions. Voice questions tend to be:
    MultiCare Neuroscience Center, you’ll recall, is where Dr. Donlon–the neuroscientist Google believes I might be looking for, not the surgeon I’m actually looking for–practices. Dr. Donlon’s profile site, much like Dr. Ruhlman’s, is semantically structured and marked up with connected data.

    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.

    Semantic HTML is about the meaningful relationships between document elements, as opposed to simply describing how they should look on screen.

    Voice queries and content inference

    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.
    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.

    By conveying in a context that includes inference and aggregation, associations are able to consult with their customers where users are, be it on a website, a search engine results page, or even a voice-controlled digital helper. They’re also able to maintain control over their messages’ truth by ensuring the proper content communicated and are available across contexts.
    This”featured snippet” perspective is possible because the content writer,, has broken this recipe into the smallest meaningful chunks suitable for this subject matter and audience, and then expressed information about those chunks as well as the connections between them in a machine-readable manner. In this instance, has utilized both semantic HTML and linked data to make this content not merely a page, but in addition legible, accessible data that can be accurately interpreted, adapted, and remixed by calculations and intelligent agents. Let’s look to see how they work across indexing, aggregation, and inference contexts.
    In this example, we can see that Google can find plenty of links to Dr. Donion in its standard index results, but it isn’t able to”know” the data about those sources well enough to present an aggregated result. In this case, the Knowledge Graph understands Dr. Donion is a Kaiser Permanente physician, but it pulls at the wrong location and the incorrect physician’s name in its endeavor to construct a Knowledge Graph screen.
    While I inquire Google Assistant what time Dr. Donion’s office closes, the result is not only less useful but actually points me in the wrong direction. Instead of a targeted selection of focused activities to follow up on my query, I’m presented .

    Software agent search and semantic HTML

    Design practices which build bridges between user requirements and technology requirements to meet business goals are critical to making this vision a reality. Content strategists, information architects, developers, and experience designers all have a role to play in delivering and designing content solutions that are effective structured.

    A combined HTML code editor and preview window showing markup and results for heading, ordered list, and list item HTML tags.

    The pane on the right indicates the values that are machine-readable.

    Along with finding and excerpting info, for example recipe measures or parking ticket payment options, search and applications agent algorithms also now aggregate content from multiple sources by using linked data.
    As it’s composed of structured content that is marked up 36,, despite the simplicity of the Town of Seattle parking ticket page, it effectively ensures the integrity of its content across contexts. “Pay My Ticket” is a level-one going (

    ), and every one of the options below it’s level-two key words (

    ), which signify that they are subordinate to the level-one component.
    Such interactions that are fast, however, are just one small piece of a bigger issue: connected data is increasingly key to maintaining the integrity of articles online. The organizations I’ve used as examples, such as the hospitals, government agencies, and schools I’ve consulted with for decades, do not measure the success of their communications efforts in page views or ad clicks. Success for these means linking constituents, patients, and community members with services and information regarding the business. This definition of achievement easily applies to any sort of company working to further its business goals on the web.

  • Designing Connected Content, Carrie Hane and Mike Atherton
  • In this example, Dr. Ruhlman’s profile is marked up with microdata depending on the language. This base that is structured content provides the foundation on. The Knowledge Graph info box, for instance, comprises Google reviews, which are not part of Dr. Ruhlman’s profile, but which have been aggregated into this review.

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

    Content is already a mainstay of various kinds of information on the internet. Listings, for instance, have been predicated on articles for several years. When I search, as an Example,”bouillabaisse recipe” on Google, I am provided with a standard list of links to recipes, in Addition to an Summary of recipe measures, an image, and a pair of tags describing one example recipe:

    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.'

    In a design process, the relationships between content chunks are explicitly defined and described. This makes the material chunks and the relationships between them legible to calculations. Algorithms can then interpret a content bundle as the”page” I’m looking for–or remix and adapt the exact same content to provide me a list of directions, the number of celebrities on a critique, the period of time left before an office closes, and some variety of additional concise answers to specific questions.

    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.

    If we run Dr. Ruhlman’s Swedish Hospital profile site via Google’s Structured Data Testing Tool, we could see that articles about him is structured as small, different elements, each of which is marked up using descriptive types and characteristics that convey the meaning of these attributes’ values and the way they fit together as a whole–all in a machine-readable format.
    Practitioners from throughout the design community have shared a wealth of resources lately on creating content systems that work for algorithms and humans alike. To Find out More about implementing a content that is structured approach for your company, articles and these books are a Terrific place to start:
    In its simplest form, connected data is”a set of best practices for connecting structured data online .” Linked data expands the basic capabilities of semantic HTML by describing not only what sort of item a page element is (“Pay My Ticket” is an

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

    signifies a”pay action,” which inherits the structural characteristics of”trade activities” (the market of goods and services for cash ) and”actions” (actions carried out by an agent upon an item ). Linked data creates a richer, more nuanced description of the association between page components, and it supplies the structural and conceptual information that calculations need to bring data together from disparate sources.
    You’ll also observe that although Dr. Stacey Donion is an exact match in all of the listed search results–which can be a lot of enough to fill the first results page–we are shown a”did you mean” link for another physician. Multicare related profiles that are data-rich to get their doctors and does provide semantic.
    Say that I would like to collect information about two recommendations I have been given for surgeons.
    HTML markup which focuses just on the presentational aspects of a”webpage” may look perfectly fine to a human reader however be completely illegible to an algorithm. Take, as an instance, the City of Boston website, redesigned a few years back in collaboration with top-tier design and development partners. If I want to find advice about how to pay a parking ticket, then a connection in the home page takes me straight to the”How to Pay a Parking Ticket” display (scrolled to reveal detail):

    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.

    To be able to tailor results to these questions, software agents have begun using the data that was linked at their disposal and subsequently inferring purpose. When I inquire Google Assistant what time Dr. Ruhlman’s workplace closes, for instance, it responds,”Dr. Ruhlman’s office shuts at 5 p.m.,” and displays this effect:

    In addition to the indexing purpose that conventional search engines perform, smart agents and AI-powered search calculations are bringing into the mainstream additional modes of obtaining advice: inference and aggregation. As a result, design efforts that focus on creating pages are no longer sufficient to ensure the integrity or accuracy of content. Rather, by focusing on providing access to data within a structured, systematic way that’s legible to both humans and machines, content publishers can ensure that their content is both accessible and accurate in these new contexts, whether or not they’re creating chatbots or tapping into AI directly. In this article, we’ll look at the forms and effect of material, and we are going to close with a set of tools which could help you to get started using a content approach to information design.
    I readily understand what my choices are for paying, as a person reading this page I will pay online, in person, by mail, or over the telephone. If I ask Google Assistant how to pay a parking ticket however, things get a bit confusing:
    There is insufficient evidence within this little sample to encourage a broad claim that calculations have”cognitive” bias, but even when we allow for potentially confounding variables, we can observe the compounding issues we risk by dismissing structured content. “Donlon,” for instance, may well be much more common name than”Donion” and can be readily mistyped onto a QWERTY keyboard. No matter the Kaiser Permanente result we’re given previously for Dr. Donion is for the wrong doctor. Furthermore, from the Google Assistant voice hunt, the discussion format doesn’t confirm if we meant Dr. Donlon; it only provides us with her centre’s contact information. In these scenarios, providing transparent content can work to our advantage.
    These results aren’t only aggregated from sources, but are interpreted and remixed to provide a customized answer. Getting directions, placing a telephone call, and accessing Dr. Ruhlman’s profile page on are at the ends of my fingers.

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

    These elements, when designed well, convey relationships and information hierarchy visually to viewers, and semantically to algorithms. This structure allows Google Assistant to reasonably stipulate the text from those

    headings signifies payment options beneath the

    heading”Pay My Ticket.”
    HTML structured in this manner is both presentational and semantic because people know what lists and headings look like and mean, and algorithms can comprehend them as components with defined, interpretable relationships.
    Than we see with Boston the Google Assistant hunt offers a much more useful result. In this case, the Google Assistant direct links right to the”Pay My Ticket” page and lists a number of ways I can pay my ticket: on line, by email, and also in person.
    The model of building pages and then expecting users parse and to detect those pages to answer queries , though time-tested in the age that is pre-voice, is becoming inadequate for successful communication. From engaging in patterns of information discovery and seeking, it precludes organizations. And it might lead software representatives to make inferences based on inadequate or erroneous informationrouting customers to rivals who communicate efficiently.

    The City of Seattle’s”Pay My Ticket” page, though it lacks the polished visual design of Boston’s site, also communicates parking ticket payment options obviously to individual people:

    Getting started: who and how

    To be fair, following trials of the search did create the generic (and partially incorrect) practice location for Dr. Donion (“Kaiser Permanente Orthopedics: Morris Joseph MD”). It is possible that through repeated exposure to the research phrase”Dr. Stacey Donion,” Google Assistant fine-tuned the responses it provided. The initial result, nevertheless, suggests that smart brokers may be at least partly susceptible to the same accessibility heuristic that affects individuals, wherein the information that’s simplest to recall often seems the most correct.