Colophon | Dr. Michael E. Cotterell

On this page: Overview

Design Philosophy

Principles

This website is designed around the principles of speed, semantic clarity, resilience, and universal accessibility. It adheres to an unbloated, content-as-data architecture that delivers zero-client-overhead static HTML while maintaining responsive, elegant typography in both light and dark reading environments.

Typography & Typefaces

Type System

The typographic system pairs an expressive, modern serif typeface for headings and editorial titles with a clean, highly legible neo-grotesque sans-serif for body copy and navigational interfaces.

Source Serif 4Headings & Display

Designed by Frank Grießhammer (Adobe Type). An open-source transitional serif typeface engineered for clarity across digital displays and print.

Academic Research & Open ScienceAa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz0 1 2 3 4 5 6 7 8 9 & § ¶ “ ” ‘ ’

InterBody & User Interface

Designed by Rasmus Andersson. A meticulously crafted variable typeface featuring tall x-height for readability on computer screens and mobile devices.

Computer Systems, Compilers & EducationAa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz0 1 2 3 4 5 6 7 8 9 ( ) [ ] { } → ← •

System Monospace StackCode & Technical Metadata

ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace — Zero font network transfer, native rendering across all operating systems.

Algorithms, Systems & Data StructuresAa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz0 1 2 3 4 5 6 7 8 9 { } [ ] < > => -> !== === $ _ ~ ^ | &

Visual styles are managed via pure semantic CSS custom properties. Color combinations strictly satisfy WCAG 2.1 Level AAA contrast standards (≥ 7.0:1 for normal body text, ≥ 4.5:1 for large text, and ≥ 3.0:1 for UI borders and focus rings) across both light and dark themes.

UGA Bulldog Crimson#ba0c2fPrimary Accent

Spring Emerald (Dark)#34d3999.0:1 AAA on #161b22

Deep Charcoal (Light Text)#18181b17.5:1 AAA on white

Obsidian Slate (Dark BG)#0d1117Deep Dark Base

Key Accessibility Features

Bypass Blocks: Keyboard-focusable <a href="#main-content" class="skip-link"> allows keyboard and screen reader users to skip repeated navigation directly to primary content.
Motion Preferences: Full support for @media (prefers-reduced-motion: reduce), disabling animations and transitions for users with vestibular sensitivities.
Descriptive Link Context: Interactive links and buttons carry explicit, contextual aria-label tags indicating destination and external tab targets.
Semantic Structure: Strict single <h1> hierarchy with contiguous descending heading levels and semantic HTML5 sectioning elements.

Technology Stack & Software

Architecture

Built with an ultra-lean static architecture that eliminates client-side JavaScript bundle overhead for reading and navigating content.

Component	Technology	Version	Role & Details
Framework	Astro	v7.2.7	Static Site Generation (SSG) with zero-JS output by default
Language	TypeScript	v6.0.3	Strict type safety across build-time data pipelines
Diagnostics	@astrojs/check	v0.9.10	Automated type checking and template diagnostics
Content Layer	Astro Content Collections	Astro Modern Content Layer Astro's high-performance content subsystem configured via `src/content.config.ts` using arbitrary loaders (such as `glob`) and strict runtime Zod schema validation. Astro Content Docs	`src/content.config.ts` with `glob` loader & Zod schemas
Data Architecture	Content-as-Data	Content-as-Data (JSON) A decoupled architecture where structured academic information (courses, publications, grants, student mentorship) is stored in typed, version-controlled JSON files separated from presentation markup. JSON Specification	Structured schemas in `src/data/*.json` (teaching, pubs, research, service)
Styling	Vanilla CSS & Custom Properties	CSS3 & Design Tokens Modern Vanilla CSS utilizing native Custom Properties (variables), grid/flexbox layouts, fluid typography, and reduced-motion media queries without runtime CSS-in-JS or external frameworks. MDN CSS Reference	Zero CSS runtime libraries, pure CSS Design Tokens
Feeds & Discovery	@astrojs/rss & @astrojs/sitemap	v4.0 / v3.7	Automated RSS 2.0 and XML sitemap generation
Reverse Proxy	Traefik Proxy	Traefik Edge Router A cloud-native reverse proxy and ingress controller at the network edge handling traffic routing, TLS termination, automatic Let's Encrypt certificates, and HTTP/2 multiplexing. Traefik Docs	Automated domain routing and Let's Encrypt SSL/TLS certificate renewal
Containerization	Docker Compose	Docker Compose Orchestration A declarative container orchestration tool for defining multi-container environments, managing isolated networks, persistent volumes, and reliable zero-downtime service restarts. Docker Compose Docs	Multi-container production stack orchestration

Machine-Readable & Agentic Endpoints

In addition to human-friendly HTML pages, this site provides dedicated machine-readable endpoints for AI assistants, LLMs, and feed readers:

/llms.txt

Conforming to llmstxt.org v2, providing a concise markdown overview of publications, courses, research initiatives, and curated links for LLM agents.

/llms-full.txt

Complete build-time compiled markdown context incorporating full publication abstracts, grant details, service appointments, and article digests.

/rss.xml

Standard RSS 2.0 feed of articles, essays, and updates for feed readers and syndication services.

/sitemap-index.xml

Standard search engine XML sitemap index referencing all canonical site routes.

Hosting, Infrastructure & Licensing

Deployment

Hosting: Self-hosted on dedicated Linux infrastructure with static file serving via Traefik and Docker Compose with automatic domain routing and certificate renewal for maximum performance, digital sovereignty, and privacy.

Content License: All text and original content are licensed under the Creative Commons Attribution 4.0 International (CC BY 4.0) license unless otherwise noted.