Web Development

Information, articles, and guides on web technologies and website development using HTML, CSS, JavaScript, and Eleventy.

Automatic Page Hierarchy with the Eleventy Navigation Plugin

Automatic generation of page hierarchies based on the directory tree to enable breadcrumbs via the Eleventy Navigation plugin.

Creating a List of Direct Child Pages in Eleventy

Rendering a list of the current page’s subpages in Eleventy using a Liquid template, a WebC component, or an Eleventy Shortcode.

Developing and Maintaining Websites with Eleventy

Information on developing, editing, and publishing a website using the static site generator Eleventy.

HTML Plugins for Eleventy

Eleventy plugins for adding tables of contents, syntax highlighting, and external link attributes to HTML templates.

Markdown Is a Mess

An analysis of why Markdown’s architectural limitations and fragile syntax make it unsuitable for complex or feature-rich documents.

Notes on HTML and CSS

Solutions for CSS margin collapsing, rendering text glyphs instead of graphic emojis, using spaces in generated text, and expandable tables of contents.

Using Eleventy and PHP Together

Using Eleventy to generate PHP files, enabling dynamic contact forms and server-side processing on static websites.

Using Markdown with Eleventy

Recommendations for writing Markdown documents and extending Eleventy’s built-in Markdown support by advanced configuration and plugins.