Chapter 64: Structured Data & Schema.org

Article & BlogPosting Schema

Structure news stories, technical blogs, and editorial articles using Schema.org Article, NewsArticle, and BlogPosting types to qualify for Google Top Stories and rich SERP carousels.

LEARNING OBJECTIVES ⌵

Understand the inheritance hierarchy between Thing $\rightarrow$ CreativeWork $\rightarrow$ Article $\rightarrow$ NewsArticle / BlogPosting.
Master all Google-required and recommended properties for Article rich results eligibility.
Structure high-resolution, multi-aspect-ratio image arrays (16:9, 4:3, 1:1) compliant with Google Discover standards.
Implement ISO 8601 timestamps with explicit time zone offsets for datePublished and dateModified.
Structure complex nested author (Person) and publisher (Organization with Logo) entity relationships.

🎬 INTERACTIVE VISUAL PIPELINE Core Architecture Simulation

🌐

1. Input

Directives & Tags

⚙️

2. Parse

Tokenizer & AST

🌳

3. Layout

Box Model & Flow

🎨

4. Render

GPU Paint & Composite

PHASE 1: INPUT & DIRECTIVES

Browser receives declarative markup stream, parsing tag tokens and initializing component state.

📖 The Mental Model & Story (Intuitive Foundation)

Think of a bustling digital newsstand or morning newspaper front page. When a breaking story occurs, an editor doesn't just print raw text into a sea of indistinguishable gray paragraphs.

Instead, the editor creates a structured layout:

A bold, punchy Headline (capturing attention in under 110 characters).
A high-resolution Hero Photograph (cropped for banners and thumbnails).
The Byline specifying the journalist's name and credentials.
The exact Timestamp when the story broke and when it was last updated.
The Masthead identifying the publisher (e.g., The New York Times, Reuters).

+-------------------------------------------------------------------------------+
|                       GOOGLE TOP STORIES / NEWS CAROUSEL                      |
|                                                                               |
|  +------------------------+  +------------------------+  +-----------------+  |
|  | [16:9 Image Thumbnail] |  | [16:9 Image Thumbnail] |  | [Image Thumb]   |  |
|  | Tech Giants Announce...|  | Breakthrough in Quantum|  | New Open Source |  |
|  | The Tech Journal • 2h  |  | Science Daily • 4h     |  | Dev Weekly • 6h |  |
|  +------------------------+  +------------------------+  +-----------------+  |
+-------------------------------------------------------------------------------+

When Googlebot crawls an article, it doesn't want to guess which <h1> is the actual article title, which image is the hero versus an advertisement, or whether a date string is in US (MM/DD/YYYY) or European (DD/MM/YYYY) format.

By delivering an Article or BlogPosting JSON-LD schema, you hand Google the structured masthead on a silver platter, qualifying your content for the coveted Top Stories Carousel, Google Discover, and rich news cards.

Technical Deep Dive & Specifications

Schema.org Article Hierarchy

In Schema.org, articles inherit properties down a clear subclass tree:

Thing
 └── CreativeWork
      └── Article
           ├── NewsArticle       (Fact-based news reporting by recognized media)
           ├── BlogPosting       (Blog posts, engineering blogs, personal articles)
           ├── TechArticle       (API docs, technical deep dives, tutorials)
           └── ScholarlyArticle  (Academic papers, peer-reviewed research)

Google Article Rich Results: Property Matrix

Property	Type	Google Requirement	Technical Rules & Best Practices
`headline`	`Text`	Required	The title of the article. Do not exceed 110 characters. Should match the visual `<h1>`.
`image`	`URL` or `ImageObject` or `Array`	Required	Array of high-res image URLs (min 1200px width). Must provide 16x9, 4x3, and 1x1 aspect ratios.
`datePublished`	`DateTime` (ISO 8601)	Required	The initial publication date in `YYYY-MM-DDTHH:mm:ssZ` or with timezone offset (`+05:30`).
`dateModified`	`DateTime` (ISO 8601)	Recommended	Date of the latest update. If updated, must be equal to or newer than `datePublished`.
`author`	`Person` or `Organization` or `Array`	Required	Author(s) of the piece. Google strongly recommends nested `Person` objects with `name` and `url`.
`publisher`	`Organization`	Recommended	The publishing entity. Must include `name` and nested `logo` (`ImageObject`).
`mainEntityOfPage`	`URL` or `WebPage`	Recommended	Canonical URL of the page (`https://example.com/blog/article-slug`).
`description`	`Text`	Recommended	Summary or abstract of the article (typically 120–160 characters).

Google Discover & Image Aspect Ratio Rules

Google guidelines specify that to qualify for Google Discover large image cards:

High-resolution images must be at least 1200px wide.
Must have the max-image-preview:large robots meta tag enabled.
For best multi-device SERP rendering, provide images in three standard aspect ratios:
- 16:9 (e.g., $1920 \times 1080\text{px}$)
- 4:3 (e.g., $1600 \times 1200\text{px}$)
- 1:1 (e.g., $1200 \times 1200\text{px}$)

+-------------------------------------------------------------------------------+
|                      MULTI-ASPECT RATIO IMAGE STRATEGY                        |
|                                                                               |
|     16:9 Aspect Ratio              4:3 Aspect Ratio           1:1 Aspect Ratio|
|  +----------------------+      +--------------------+      +---------------+  |
|  |                      |      |                    |      |               |  |
|  |     1920 x 1080      |      |    1600 x 1200     |      |  1200 x 1200  |  |
|  |                      |      |                    |      |               |  |
|  +----------------------+      +--------------------+      +---------------+  |
|    (Top Stories / Desktop)       (Tablet / Feeds)            (Mobile Thumbs)  |
+-------------------------------------------------------------------------------+

💻 Interactive Code Playground

Starter Code

Line-by-Line Code Breakdown

Line 8 ("@type": "BlogPosting"): Categorizes the document as a blog article, inheriting all properties of Article and CreativeWork.
Line 9–12 ("mainEntityOfPage"): Unambiguously ties the structured metadata to the canonical URL of this specific webpage.
Line 13 ("headline"): Contains the article's primary title in under 110 characters, perfectly matching the visual <h1>.
Line 15–19 ("image"): Provides an array of three URLs representing the exact image in 16:9, 4:3, and 1:1 aspect ratios to satisfy Google Discover and Top Stories guidelines.
Line 20–21 ("datePublished", "dateModified"): Complete ISO 8601 datetime strings including the +00:00 UTC offset.
Line 22–27 ("author"): Declares the author as a nested Person entity complete with name, jobTitle, and author profile url.
Line 28–37 ("publisher"): Defines the publishing Organization and provides a nested ImageObject for the logo with explicit dimensions.

Expected Browser Render Output

SYS: ACTIVE

HULL: 98%

CORE: STABLE

NET: ONLINE

HTML STARSHIP CODE TERMINAL playground.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Building Distributed Cache Systems - Cloud Engineering Blog</title>
  
  
  <script type="application/ld+json">
  {
    "@context": "https://schema.org",
    "@type": "BlogPosting",
    "mainEntityOfPage": {
      "@type": "WebPage",
      "@id": "https://engineering.example.com/posts/distributed-caching"
    },
    "headline": "Building Resilient Distributed Cache Architectures with Redis and Go",
    "description": "A comprehensive deep dive into cache invalidation, write-through strategies, and high-availability clustering.",
    "image": [
      "https://engineering.example.com/images/16x9/distributed-cache.jpg",
      "https://engineering.example.com/images/4x3/distributed-cache.jpg",
      "https://engineering.example.com/images/1x1/distributed-cache.jpg"
    ],
    "datePublished": "2026-06-10T09:00:00+00:00",
    "dateModified": "2026-06-12T14:45:00+00:00",
    "author": {
      "@type": "Person",
      "name": "Alex Chen",
      "jobTitle": "Staff Infrastructure Engineer",
      "url": "https://engineering.example.com/authors/alex-chen"
    },
    "publisher": {
      "@type": "Organization",
      "name": "Cloud Engineering Press",
      "url": "https://engineering.example.com",
      "logo": {
        "@type": "ImageObject",
        "url": "https://engineering.example.com/assets/logo.png",
        "width": 600,
        "height": 60
      }
    }
  }
  </script>
</head>
<body>
  <article>
    <header>
      <h1>Building Resilient Distributed Cache Architectures with Redis and Go</h1>
      <p>By <a href="/authors/alex-chen">Alex Chen</a> | Staff Infrastructure Engineer</p>
      <p>
        Published: <time datetime="2026-06-10T09:00:00Z">June 10, 2026</time> | 
        Updated: <time datetime="2026-06-12T14:45:00Z">June 12, 2026</time>
      </p>
    </header>
    
    <figure>
      <img src="https://engineering.example.com/images/16x9/distributed-cache.jpg" alt="Redis cluster topology diagram" width="1200" height="675">
      <figcaption>Figure 1: Master-Replica distributed cache topology</figcaption>
    </figure>

<section>
      <p>
        A comprehensive deep dive into cache invalidation, write-through strategies, and high-availability clustering.
      </p>
    </section>
  </article>
</body>
</html>

LIVE RENDER & DIAGNOSTICS CORE TEMP: 45°C

INSPECTING DOM: VALID

TAGS: SCANNING...

Building Resilient Distributed Cache Architectures with Redis and Go
By Alex Chen | Staff Infrastructure Engineer
Published: June 10, 2026 | Updated: June 12, 2026

[Redis cluster topology diagram image]
Figure 1: Master-Replica distributed cache topology

A comprehensive deep dive into cache invalidation, write-through strategies, and high-availability clustering.

🏋️ Hands-On Exercise

🎯 The Challenge: Build Multi-Author NewsArticle Schema

Instructions:

You are building an editorial news template for an investigative report co-authored by two journalists.
In the <head>, create a <script type="application/ld+json"> tag.
Use the @type: "NewsArticle".
Include the following fields:
- headline: "Autonomous AI Agents Achieve Zero-Day Vulnerability Discovery"
- description: "Security researchers document the first automated end-to-end exploit detection pipeline."
- datePublished: "2026-09-01T08:00:00-04:00"
- dateModified: "2026-09-01T11:30:00-04:00"
- author: An array containing two Person objects:
  1. Name: "Sarah Connor", URL: "https://cybernews.example.com/authors/s-connor"
  2. Name: "Marcus Wright", URL: "https://cybernews.example.com/authors/m-wright"
- publisher: Organization named "CyberNews Global" with logo URL "https://cybernews.example.com/logo.png".
- image: Array with at least one image URL ("https://cybernews.example.com/images/ai-security-16x9.jpg").

🏁 Starter Code Sandbox

SYS: ACTIVE

HULL: 98%

CORE: STABLE

NET: ONLINE

STARTER CODE SANDBOX exercise.html

LIVE RENDER & DIAGNOSTICS CORE TEMP: 45°C

INSPECTING DOM: VALID

TAGS: SCANNING...

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Autonomous AI Agents Achieve Zero-Day Vulnerability Discovery</title>

  <script type="application/ld+json">
  {
    "@context": "https://schema.org",
    "@type": "NewsArticle",
    "headline": "Autonomous AI Agents Achieve Zero-Day Vulnerability Discovery",
    "description": "Security researchers document the first automated end-to-end exploit detection pipeline.",
    "image": [
      "https://cybernews.example.com/images/ai-security-16x9.jpg"
    ],
    "datePublished": "2026-09-01T08:00:00-04:00",
    "dateModified": "2026-09-01T11:30:00-04:00",
    "author": [
      {
        "@type": "Person",
        "name": "Sarah Connor",
        "url": "https://cybernews.example.com/authors/s-connor"
      },
      {
        "@type": "Person",
        "name": "Marcus Wright",
        "url": "https://cybernews.example.com/authors/m-wright"
      }
    ],
    "publisher": {
      "@type": "Organization",
      "name": "CyberNews Global",
      "logo": {
        "@type": "ImageObject",
        "url": "https://cybernews.example.com/logo.png"
      }
    }
  }
  </script>
</head>
<body>
  <article>
    <h1>Autonomous AI Agents Achieve Zero-Day Vulnerability Discovery</h1>
    <p>By Sarah Connor and Marcus Wright</p>
    <p>Published: September 1, 2026</p>
  </article>
</body>
</html>

Why this works:

Using an array for author cleanly maps multi-author bylines into Google's Knowledge Graph, attributing authority to both individuals.
datePublished and dateModified use standard ISO 8601 with explicit -04:00 Eastern Daylight Time offsets.
@type: "NewsArticle" tells search engines this is journalism rather than evergreen tutorial content.

⚠️ Common Pitfalls

Omitting Timezone in Dates: Writing "datePublished": "2026-09-01" without time and timezone offset. Google prefers full ISO timestamps (2026-09-01T08:00:00Z or +00:00) for news and fresh indexing.
Author as a Plain String: Specifying "author": "John Doe" instead of an object "author": { "@type": "Person", "name": "John Doe" }. While legacy parsers accepted strings, Google's modern Rich Results validator flags strings as warnings or errors.
dateModified Older Than datePublished: If a script or CMS miscalculates and emits a dateModified that precedes datePublished, crawlers flag the metadata as logically corrupted.

💡 Pro Tips

Keep headline under 110 Characters: Google truncates headlines exceeding 110 characters in Top Stories carousel cards. Ensure your CMS enforces a strict character limit on the schema headline.
Link Author Profile URLs to E-E-A-T Hubs: In "author", always provide a "url" pointing to a dedicated author biography page containing professional credentials, social profiles (sameAs), and verified publications.

📌 Key Takeaways

Article, NewsArticle, and BlogPosting schemas power Google Top Stories, Google Discover, and news rich snippets.
Key required fields: headline (max 110 chars), image (min 1200px wide, multi-aspect ratios), datePublished (ISO 8601), and author (Person entity).
Always provide three image aspect ratios: 16:9, 4:3, and 1:1 for cross-device responsiveness in SERPs.
Multiple authors are expressed as an array of nested Person objects.
dateModified must be updated whenever meaningful editorial changes are made.
--

⭐ LEARN: HTML 🌟 ⚔️ QUIZ BATTLE ARENA // ACTIVE

? Question 1 / 3

Which of the following is the recommended format for the `author` property in Google Article structured data?

Topic: HTML Fundamentals

? Question 2 / 3

To qualify for large image previews in Google Discover, what is the minimum recommended width for the article image?

Topic: HTML Fundamentals

? Question 3 / 3

Which ISO 8601 timestamp correctly includes an explicit timezone offset for publication date?

Topic: HTML Fundamentals

👨‍🚀 CADET FLIGHT DOSSIER

CADET EXPLORER

📖 The Mental Model & Story (Intuitive Foundation)

Technical Deep Dive & Specifications

Schema.org Article Hierarchy

Google Article Rich Results: Property Matrix

Google Discover & Image Aspect Ratio Rules

💻 Interactive Code Playground

Starter Code

Line-by-Line Code Breakdown

Expected Browser Render Output

🏋️ Hands-On Exercise

🎯 The Challenge: Build Multi-Author NewsArticle Schema

🏁 Starter Code Sandbox

⚠️ Common Pitfalls

💡 Pro Tips

📌 Key Takeaways

Which of the following is the recommended format for the author property in Google Article structured data?

To qualify for large image previews in Google Discover, what is the minimum recommended width for the article image?

Which ISO 8601 timestamp correctly includes an explicit timezone offset for publication date?

Which of the following is the recommended format for the `author` property in Google Article structured data?