Behind the Scenes
December 2025 · Vincent Verdet

How This Blog Is Built:
AI-Enabled Static HTML

Zero CMS, Zero Database, Maximum Control

6 min read

Introduction

This blog runs on pure static HTML files. No WordPress. No Hugo. No build pipeline. Just HTML, CSS, a JSON file for metadata, and a handful of JavaScript for comments. A year ago, this approach would have been dismissed as impractical. Today, AI-assisted development makes it not just viable—but arguably superior.

When I set out to create "Architecting Tomorrow," I faced the same decision every technical blogger encounters: which platform? WordPress is the obvious choice with its massive ecosystem, but I dreaded navigating its admin interface and fighting templates to match my vision. Hugo and other static site generators offered more control, but still meant learning templating languages and wrestling with configuration files.

Then I realised something: AI had changed the equation entirely. The reason we use CMSs and static site generators is to avoid the tedium of hand-coding HTML. But what if that tedium simply… disappeared?

Key Takeaway

AI-assisted development enables a new architecture for content creation: pure static HTML with professional design, comprehensive SEO, and print optimization—generated in minutes, managed via a simple JSON metadata layer, deployed in seconds, maintained with zero infrastructure overhead.

The Traditional Options

Before exploring the AI-enabled approach, let's acknowledge why the traditional options exist and their genuine trade-offs.

1 WordPress

Strengths

Massive ecosystem, thousands of themes and plugins, visual editing, familiar to content teams, extensive documentation and community support.

Pain Points

Database dependency, security maintenance burden, plugin compatibility issues, performance overhead, template customisation requires PHP knowledge, fighting the Gutenberg editor to get layouts right.

Best For

Multi-author publications, content teams without technical skills, sites needing dynamic features like user accounts or e-commerce.

2 Static Site Generators (Hugo, Jekyll, Astro)

Strengths

No database, excellent performance, version control friendly, Markdown content, pre-built themes, secure by default.

Pain Points

Learning curve for templating languages, theme customisation still requires significant effort, build pipeline complexity, debugging template issues can be frustrating.

Best For

Developer blogs with simple layouts, documentation sites, projects where Markdown workflow is preferred.

3 Pure Static HTML (Pre-AI)

Strengths

Complete control, no dependencies, maximum performance, no abstraction layers, what you write is what you get.

Pain Points

Tedious to create, consistency across pages is manual, SEO meta tags require copy-paste vigilance, print styles are an afterthought, no reasonable person would choose this.

Best For

Previously: almost no one. The effort-to-output ratio made it impractical for anything beyond a single landing page.

The common thread across all traditional options is friction. WordPress hides complexity behind a UI that becomes its own obstacle. Static site generators trade UI friction for configuration friction. Pure HTML traded all friction for unbearable tedium.

AI changes this equation by eliminating the tedium while preserving the control.

The AI-Enabled Architecture

This blog consists of static HTML files served directly from Cloudflare Pages. Each article is a self-contained HTML document that shares a common CSS stylesheet. A JSON file tracks metadata and publishing status. Creating a new article takes minutes, not hours.

The Stack

Content Layer

Format

Pure HTML files with shared CSS

Generation

Claude AI with custom skill

Metadata Layer

Storage

JSON metadata file

Management

AI-generated Article Manager

Hosting

Platform

Cloudflare Pages

Deployment

Git push → Live in seconds

The Key Innovation: AI Skills

The magic happens through what Claude calls "skills"—structured instruction sets that guide AI to produce consistent, high-quality outputs. For this blog, I've created a professional-article skill that encapsulates everything needed to generate publication-ready content.

1
Design System

Colour palette, typography scales, spacing grid, and component patterns are defined once and applied consistently. The deep blue palette, Inter font, and 8px spacing grid create visual coherence across all articles without manual enforcement.

2
Component Library

Reusable patterns for common content types: intro boxes, key takeaways, level cards, benefit blocks, impact cards, numbered lists, and call-to-action boxes. Each component is semantically structured and visually consistent.

3
SEO Framework

Every article automatically includes comprehensive meta tags, Open Graph data, Twitter Cards, and JSON-LD structured data. FAQ schemas enable AI Overview extraction. Speakable specifications support voice assistants.

4
Print Optimization

Print styles are baked into the template: 80% scaling for A4, forced background colours, page break controls, and grid layout preservation. Articles print professionally without additional effort.

5
Guardrails

The skill includes guardrails: proper HTML entity encoding, consistent heading hierarchy, required accessibility attributes, and validation checklists. Quality is embedded in the process, not enforced after the fact.

The Metadata Layer

Static HTML files are self-contained, but managing a growing collection of articles requires some form of index. Rather than a database, this blog uses a simple JSON file that serves as the single source of truth for article metadata.

This approach gives me the benefits of structured data—easy querying, consistent format, version control diffs—without any of the overhead of a database. The metadata file is human-readable, git-friendly, and trivially portable.

The Article Manager

Managing JSON by hand would be tedious, which is where AI-generated tooling comes in. I asked Claude to build an Article Manager—a browser-based tool for managing the metadata file visually.

WYSIWYG Editing

Add, edit, reorder, and delete articles through a visual interface. No need to manually edit JSON syntax or worry about trailing commas.

Drag-and-Drop Ordering

Reorder articles by dragging them into the desired sequence. The order in the JSON determines display order on the landing page.

Status Management

Toggle articles between draft and published states with a single click. Drafts remain in the system but don't appear publicly.

JSON Export

Generate properly formatted JSON output ready to copy into the repository. The tool handles encoding, escaping, and formatting automatically.

The Article Manager itself is a single HTML file—built by AI, requiring no backend, running entirely in the browser. It's the same pattern as the blog itself: AI generates the tool, I use the tool, no infrastructure required.

Meta-Pattern

This is AI-assisted development applied recursively: AI builds the blog articles, and AI builds the tools to manage those articles. The tooling evolves as needs emerge, generated on demand rather than selected from a marketplace.

The Creation Workflow

Creating a new article follows a predictable pattern that takes advantage of AI's strengths while maintaining human creative control.

Phase 1: Ideation 5–10 min

  1. Define the Concept: I describe the article topic, target audience, and key points I want to cover. This is a conversation, not a specification document.
  2. Outline Collaboration: Claude proposes a structure based on the skill's patterns. I refine, add sections, or redirect focus. The structure emerges through dialogue.
  3. Identify Components: Based on the content type, we select appropriate components: level cards for frameworks, benefit blocks for comparisons, impact cards for strategic implications.

Phase 2: Generation 10–20 min

  1. Content Creation: Claude generates the full HTML article following the skill's design system, SEO requirements, and component patterns. The output is immediately usable.
  2. Iterative Refinement: I review, request adjustments to tone, expand certain sections, or restructure arguments. Each iteration takes seconds.
  3. Quality Checks: The skill's built-in checklist ensures nothing is missed: meta tags, structured data, reading time, footer links, print styles.

Phase 3: Publication 2–5 min

  1. Asset Preparation: I source a hero image, typically from Pexels, following the established naming convention and aspect ratio.
  2. Metadata Update: Using the Article Manager, I add the new article entry with slug, title, excerpt, and set status to "draft" initially, then "published" when ready.
  3. Git Commit: The HTML file, image, updated metadata, and any sitemap changes are committed to the repository.
  4. Automatic Deployment: Cloudflare Pages detects the push and deploys globally within seconds. No build step, no pipeline, no waiting.
Total Time

From concept to live article: typically 20–40 minutes. The AI handles structure, formatting, SEO, and consistency. The Article Manager handles metadata. I focus on ideas, arguments, and voice.

Why This Architecture Works

The static HTML approach succeeds because AI eliminates the reasons we avoided it before.

Tedium Eliminated

AI generates the repetitive structure: meta tags, semantic HTML, consistent classes, proper encoding. What took hours now takes seconds.

Consistency Embedded

The skill ensures every article follows the design system. No drift, no "I'll fix it later," no manual enforcement needed.

SEO by Default

Structured data, Open Graph, Twitter Cards, and FAQ schemas are generated automatically. SEO isn't an afterthought—it's built into the template.

Zero Infrastructure

No database to backup, no CMS to update, no plugins to patch. Static files on a CDN. The attack surface is essentially nil.

The Comments Question

The obvious objection to static HTML is interactivity. How do you handle comments without a backend?

Giscus solves this elegantly by leveraging GitHub Discussions. Each article's comments live in a Discussion thread in the blog's repository. Readers authenticate via GitHub—a reasonable requirement for a technical audience—and comments are stored in a system I already use for version control. Zero additional infrastructure, professional commenting experience, and built-in spam resistance through GitHub's authentication.

Bonus

Because comments live in GitHub Discussions, they're searchable, exportable, and backed up alongside the content. No database migrations, no platform lock-in, no comment data hostage situations.

The Broader Lesson

This blog's architecture isn't just a technical curiosity. It represents a pattern that applies far beyond personal publishing.

AI Changes Build vs Buy Calculations

For years, the conventional wisdom was clear: use WordPress because building a blog from scratch is impractical. That wisdom was correct—until AI made the "from scratch" part nearly effortless.

This is the Re-Use Before Build principle in action. I'm re-using web standards (HTML, CSS, JavaScript) and existing platforms (Cloudflare Pages, Giscus, GitHub) while AI handles the custom generation layer. No vendor lock-in, no template constraints, no fighting abstractions.

Tools on Demand

The Article Manager exemplifies a new pattern: instead of searching for the perfect tool, describe what you need and have AI build it. The tool doesn't need to be perfect or feature-complete—it needs to solve your specific problem. When requirements change, regenerate or extend the tool.

This is profoundly different from traditional software selection. There's no evaluation matrix, no vendor demos, no license negotiations. Just a conversation that produces a working solution.

What This Enables

Rapid Experimentation

Want to try a new component pattern? Update the skill, regenerate articles if needed. Want to add structured data for a new schema type? It's a template change, not a platform migration.

Complete Ownership

Every file is mine. Every style decision is mine. If Cloudflare Pages disappeared tomorrow, I could host these files anywhere. No export process, no data transformation, no compatibility worries.

Focus on Content

The infrastructure is invisible. I spend zero time on platform maintenance, plugin updates, or template debugging. All creative energy goes into ideas and writing.

Should You Do This?

This architecture isn't for everyone. It requires comfort with AI-assisted development, willingness to work in HTML (even if AI generates it), and a technical audience that won't balk at GitHub-authenticated comments.

Consider This Approach If:

  1. You Value Control: You want complete ownership of your content and presentation without platform constraints or template limitations.
  2. You're Already Using AI: You're comfortable with AI-assisted development and understand how to guide AI toward consistent outputs.
  3. Performance Matters: Static HTML is as fast as it gets. No database queries, no server-side rendering, just files on a CDN.
  4. You Prefer Simplicity: The appeal of "just files" resonates with you. No admin panels, no plugin ecosystem, no update notifications.

Stick With Traditional Options If:

  1. You Have Non-Technical Co-Authors: If others need to contribute content without AI assistance, a visual editor is probably necessary.
  2. You Need Dynamic Features: User accounts, e-commerce, membership areas—these require backend infrastructure.
  3. You Want Established Workflows: WordPress and similar platforms have mature editorial workflows, scheduling, and collaboration features.

The Meta Point

This article exists because AI made it trivial to create. The Article Manager exists because AI made it trivial to build. The blog exists because AI made the architecture viable. The future of content creation isn't about choosing between platforms—it's about having AI generate exactly what you need, from articles to the tools that manage them.

Comments

Have you tried AI-assisted blogging? Share your architecture decisions and experiences.