Test Drive of Blog Features

Nov 30, 2026 - 5 min read

This post demonstrates the full range of the blog layout using real content. It is intentionally eclectic so you can see how text, imagery, and data elements sit together. If you want the short version, jump to the summary or visit my main site at alex-rivera.dev.

Quick note: everything you see here uses the same typography and spacing applied across the rest of the site, so it should mirror the production look and feel.

Hero visuals and captions

Mixed typography

Large statement

Designers, researchers, and engineers work better together when the narrative is as clear as the numbers.

Supporting paragraph

The blog template keeps paragraphs readable by balancing line length with generous spacing. Short lead-ins like this help set context before showing heavier content.

Small print

Fine details, legal disclaimers, or inline annotations can ride in small text without breaking the rhythm of the page.

Inline code like const focusArea = 'research'; stays readable without overwhelming the surrounding sentence.

Lists and highlights

• Bullet lists stay compact with consistent spacing.
• Numbered steps are equally supported.
• Inline links, like this stakeholder map template, remain easy to spot.

1. Align on the decision to be made.
2. Define success signals and guardrails.
3. Run a pilot, measure, then scale.

Embedded code snippet

const shareable = {
  title: metadata.title,
  url: metadata.alternates.canonical,
  tags: ['design', 'research', 'sample'],
}

Quick recap

• The layout supports images, headings, charts, and tables without breaking alignment.
• Links can point to external sites or internal anchors.
• Text scales from small print to bold statements.
• Lists, code, and quotes render cleanly alongside visuals.

Thanks for taking this test drive. If you spot anything else to showcase, feel free to add it.