--- title: "alexfeel.info: This Site as an Engineering Project" description: "alexfeel.info — the site you are reading — is a project in its own right: a custom design system on Hugo and Tailwind v4, a full machine-readable layer for AI agents, per-page Open Graph cards composed at build time, an enforced single-source identity record, a bank of validators that gates every deploy, and a 404 page running a real o200k tokenizer in the browser." date: "2024-03-18T07:00:00Z" last_updated: "2026-08-28" build_time: "2026-08-28T03:11:43Z" project_name: "alexfeel.info" project_description: "This site, as a project: a custom editorial design system on Hugo and Tailwind v4, a full machine-readable layer for AI agents (Markdown twins, llms.txt, a one-fetch profile document), build-time Open Graph card composition, an enforced single-source identity record, a bank of validators gating every deploy — and a 404 page that runs a real o200k tokenizer in the browser." status: "Active" project_group: "sites-digital-products" period_from: "2024-03-18" project_url: "https://www.alexfeel.info/" related_skills: ["hugo","web-fundamentals","seo","python","cloudflare","quality-assurance","artificial-intelligence"] related_projects: ["hugo-artifacts","motionbuscardbot-site","agile-uni-site"] keywords: ["Personal Website","Hugo","Tailwind CSS","Design System","Agent Readiness","llms.txt","Markdown Twins","Structured Data","Open Graph","PWA","Cloudflare Pages","Build Validation","Tokenizer","Static Site Engineering"] license: "https://creativecommons.org/licenses/by/4.0/" canonical: "https://www.alexfeel.info/projects/alexfeel-info/" --- ## Overview The page you are reading is served by a project of mine. alexfeel.info is not a themed template with content poured in — it is a hand-built product: its own design system, its own module ecosystem, a machine-readable layer designed for AI agents as first-class readers, and a verification culture that treats a personal website with the seriousness of a production service. It exists because a site that claims its owner builds reliable platforms should itself be evidence. ## The Design System The visual language — an editorial system of paper, ink, and rules — is authored from scratch: OKLCH color tokens with a class-based dark theme, Tailwind CSS v4 in its CSS-first form with no config file, self-hosted variable fonts, and a token architecture in which every component, from cards to callouts to the search palette, resolves the same custom properties. One invariant governs it all: a reusable artifact renders identically on every page it appears on, with theme and a per-section accent as the only sanctioned variations. ## Built for Machine Readers The site assumes its next visitor may be an AI agent, and treats that as a design requirement rather than an afterthought: - **Every content page ships a Markdown twin** — the same substance, fetchable as clean Markdown — plus `llms.txt` and a complete link index, so an agent can read the site without scraping HTML. - **One document answers the whole profile question.** A single fetch returns who I am, every skill with its dates, every role, every project, and how to reach me — assembled at build time from the same sources the pages render from, so it cannot drift. - **Each page carries a "use this page with an agent" menu** — copy the twin, open it in an assistant, or hand the live URL to the reader of your choice. - **Structured data is engineered, not sprinkled.** One SEO module owns the entire head surface, section-aware JSON-LD connects posts to their author's profile page, and every page receives its own Open Graph card composed at build time from the page's already-resolved title and description — so a card and its meta tags cannot disagree. ## The Verification Culture The site's claims about its owner are held together by machinery, not discipline alone. Every atomic fact — name, title, location, availability, channels — lives once in an identity record, and enforced contracts fail the build if any surface stops agreeing with it. A bank of validators gates every build: two walk the generated output (structured data, heading outlines, canonical facts, the URL manifest), and the rest hold the source tree itself to its contracts — identity facts, width discipline, font metrics, icon optics, retired template calls, the build-time environment table. A separate pull-request gate compares the freshly built site against the live production manifest, so a page can never disappear without its redirect. After each deploy, a live verifier reads the edge and confirms production actually serves the newest build. When something breaks here, it breaks loudly, before anyone sees it. ## The 404 Worth Visiting The [404 page](/404.html) runs a real tokenizer: the full o200k vocabulary, executing byte-pair encoding in the browser, tokenizing the path you mistyped and rendering an inference panel over it. The artifact is generated by a script that re-encodes a battery of paths against the reference tokenizer and refuses to ship unless the outputs match exactly. It is a joke with a working ML pipeline behind it — and somewhere on the site, a small easter egg wanders as well. ## Infrastructure Cloudflare Pages serves the site; consent management runs at the edge, so the pages themselves contact no third-party origin — fonts, icons, and scripts are all self-hosted. The site is an installable PWA with a deliberately conservative service worker that never serves stale HTML. The Hugo modules behind the major surfaces — SEO, Open Graph composition, agent readiness, search, URL retirement, images — are my own [Hugo Artifacts](/projects/hugo-artifacts/) library, built for reuse and shared with my other sites, including the [Motion Bus Card Bot site](/projects/motionbuscardbot-site/). ## Site index - [llms.txt](https://www.alexfeel.info/llms.txt) - [Complete index](https://www.alexfeel.info/llms-index.txt)