<?xml version="1.0" encoding="utf-8"?>
<feed xmlns="http://www.w3.org/2005/Atom" xml:lang="en">
  
  <title>Small Static</title>
  <subtitle>Notes on running a small static blog: writing in Markdown, publishing with git, and keeping a site fast and easy to find.</subtitle>
  <link href="https://fengyiqicoder.github.io/eleventy-ai-starter/feed.xml" rel="self" />
  <link href="https://fengyiqicoder.github.io/eleventy-ai-starter/" />
  <updated>2026-10-14T00:00:00Z</updated>
  <id>https://fengyiqicoder.github.io/eleventy-ai-starter/</id>
  <author>
    <name>Your Name</name>
  </author>
  <entry>
    <title>Keeping a small site fast and easy to find</title>
    <link href="https://fengyiqicoder.github.io/eleventy-ai-starter/posts/fast-and-findable/" />
    <updated>2026-10-14T00:00:00Z</updated>
    <id>https://fengyiqicoder.github.io/eleventy-ai-starter/posts/fast-and-findable/</id>
    <content type="html">&lt;p&gt;A static site starts out fast. It stays fast if you avoid adding weight you do not need, and it gets found if you publish a few small files that machines know how to read. This post is the checklist I use.&lt;/p&gt;
&lt;h2&gt;Set a page weight budget&lt;/h2&gt;
&lt;p&gt;Decide how heavy a page is allowed to be and check it now and then. For a text blog, 100 KB for the HTML, CSS and fonts together is generous. This site inlines its CSS, uses the reader&#39;s system fonts, and ships no JavaScript of its own, so a post is about 15 KB before images.&lt;/p&gt;
&lt;p&gt;The usual causes of a slow blog are easy to spot:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;Web fonts.&lt;/strong&gt; Each weight and style is another file. If you want a custom font, host one variable font file yourself and preload it. Or use the system font stack and skip the download.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Large images.&lt;/strong&gt; Resize them before you commit them. Add &lt;code&gt;width&lt;/code&gt; and &lt;code&gt;height&lt;/code&gt; so the page does not jump while they load, and &lt;code&gt;loading=&amp;quot;lazy&amp;quot;&lt;/code&gt; for anything below the first screen.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Third-party scripts.&lt;/strong&gt; Analytics, embeds and chat widgets often weigh more than the rest of the page. Load the ones you keep with &lt;code&gt;async&lt;/code&gt; so they never block the text.&lt;/li&gt;
&lt;/ul&gt;
&lt;h2&gt;Make it readable without effort&lt;/h2&gt;
&lt;p&gt;Speed is not only bytes. A line length of 60 to 75 characters, a font size of at least 17 pixels and enough contrast between text and background make a page faster to read. Support dark mode with the &lt;code&gt;prefers-color-scheme&lt;/code&gt; media query, so the site follows the reader&#39;s system setting with no toggle to build.&lt;/p&gt;
&lt;h2&gt;Publish files that machines read&lt;/h2&gt;
&lt;p&gt;A few small files do most of the work of being found:&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;A sitemap.&lt;/strong&gt; &lt;code&gt;sitemap.xml&lt;/code&gt; lists every page with its address and date. Search engines use it to find new posts sooner. Submit it once in Google Search Console and Bing Webmaster Tools.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;A feed.&lt;/strong&gt; An Atom or RSS feed at &lt;code&gt;feed.xml&lt;/code&gt; lets readers follow the blog in a feed reader. It is still how many people keep up with small sites, and it costs nothing to generate.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Good titles and descriptions.&lt;/strong&gt; Each page needs a unique &lt;code&gt;&amp;lt;title&amp;gt;&lt;/code&gt; and a &lt;code&gt;meta&lt;/code&gt; description of one or two sentences. These are what people see in search results, so write them for people.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;llms.txt.&lt;/strong&gt; This is a newer convention: a Markdown file at the root of the site that lists the pages with a short summary of each, for AI tools that read the web. Its companion, &lt;code&gt;llms-full.txt&lt;/code&gt;, holds the full text of every page in one file. This starter writes both at every build from the finished HTML, so they never fall out of date.&lt;/p&gt;
&lt;h2&gt;Let readers ask&lt;/h2&gt;
&lt;p&gt;&lt;code&gt;llms-full.txt&lt;/code&gt; has a second use. The Ask button on this site sends a reader&#39;s question, together with the matching parts of that file, to a language model and shows the answer with links to the posts it came from. It is one script tag loaded with &lt;code&gt;async&lt;/code&gt;, so it does not slow the first paint, and it only fetches the text when someone opens the box.&lt;/p&gt;
&lt;h2&gt;Check it now and then&lt;/h2&gt;
&lt;p&gt;Run Lighthouse in Chrome&#39;s developer tools on your home page and one post every few months. It measures speed, accessibility, best practices and search basics, and it tells you exactly what to fix. A small static blog should score at or near 100 in all four without special tricks.&lt;/p&gt;
</content>
  </entry>
  <entry>
    <title>Writing in Markdown, publishing with git</title>
    <link href="https://fengyiqicoder.github.io/eleventy-ai-starter/posts/markdown-and-git/" />
    <updated>2026-09-23T00:00:00Z</updated>
    <id>https://fengyiqicoder.github.io/eleventy-ai-starter/posts/markdown-and-git/</id>
    <content type="html">&lt;p&gt;The workflow for this blog fits on an index card: write a Markdown file, commit it, push it. A build server does the rest. Here is what each step looks like in practice, and the few habits that keep it smooth.&lt;/p&gt;
&lt;h2&gt;One file per post&lt;/h2&gt;
&lt;p&gt;Each post is a file in &lt;code&gt;src/posts/&lt;/code&gt;. The file name becomes the address, so &lt;code&gt;markdown-and-git.md&lt;/code&gt; is published at &lt;code&gt;/posts/markdown-and-git/&lt;/code&gt;. Pick the name with care, because changing it later breaks links.&lt;/p&gt;
&lt;p&gt;At the top of the file is a short block called front matter:&lt;/p&gt;
&lt;pre&gt;&lt;code class=&quot;language-yaml&quot;&gt;---
title: Writing in Markdown, publishing with git
description: How a post goes from a text file to the live site.
date: 2026-09-23
tags: [writing, workflow]
---
&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;The title and description show up in the post list, in search results and in the feed. The date sets the order. Tags group posts on the tags page. Everything below the second &lt;code&gt;---&lt;/code&gt; is the post itself.&lt;/p&gt;
&lt;h2&gt;Drafts&lt;/h2&gt;
&lt;p&gt;A draft is a post that is not ready to be seen. The simplest way to keep one is a git branch: write on a branch called &lt;code&gt;draft-whatever&lt;/code&gt;, and merge it when it is done. The live site is built from the main branch only, so nothing leaks.&lt;/p&gt;
&lt;p&gt;If you prefer to keep drafts next to the finished posts, add &lt;code&gt;draft: true&lt;/code&gt; to the front matter and tell Eleventy to skip those files in production. Either way works. The branch is harder to publish by mistake.&lt;/p&gt;
&lt;h2&gt;Images&lt;/h2&gt;
&lt;p&gt;Put images next to the post or in one &lt;code&gt;images&lt;/code&gt; folder, and keep them small. A photo straight from a phone is often 4 MB. Resized to 1600 pixels wide and saved as WebP or a compressed JPEG, it is closer to 200 KB and looks the same on screen. Always write alt text that says what the image shows, not what it is called.&lt;/p&gt;
&lt;h2&gt;Publishing&lt;/h2&gt;
&lt;p&gt;When the post is ready, commit it and push:&lt;/p&gt;
&lt;pre&gt;&lt;code class=&quot;language-sh&quot;&gt;git add src/posts/markdown-and-git.md
git commit -m &amp;quot;Post: writing in Markdown&amp;quot;
git push
&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;The push starts a build on the host. On GitHub Pages that is a workflow file in &lt;code&gt;.github/workflows/&lt;/code&gt;. Netlify, Vercel and Cloudflare Pages watch the repository and build on their own. A minute later the post is live.&lt;/p&gt;
&lt;h2&gt;Fixing a typo from a phone&lt;/h2&gt;
&lt;p&gt;Because the posts are text files on GitHub, you can edit one in the GitHub web editor or app, commit there, and the same build runs. This is the feature I did not expect to use and now use every week.&lt;/p&gt;
&lt;h2&gt;Keep the habits small&lt;/h2&gt;
&lt;p&gt;Write the description before the post; it forces you to know what the post is about. Read the post once in the browser before you push, since Markdown hides some mistakes until it is rendered. And commit often. A git history is the best undo button a writer has ever had.&lt;/p&gt;
</content>
  </entry>
  <entry>
    <title>Why I moved my blog to a static site</title>
    <link href="https://fengyiqicoder.github.io/eleventy-ai-starter/posts/why-static/" />
    <updated>2026-09-02T00:00:00Z</updated>
    <id>https://fengyiqicoder.github.io/eleventy-ai-starter/posts/why-static/</id>
    <content type="html">&lt;p&gt;For six years my blog ran on a hosted CMS. It worked, mostly. Then the bill went up, a plugin I relied on stopped getting updates, and I spent a Sunday restoring the database after a bad upgrade. That was the week I started moving it to a static site.&lt;/p&gt;
&lt;h2&gt;What &amp;quot;static&amp;quot; means here&lt;/h2&gt;
&lt;p&gt;A static site is a folder of finished HTML files. A program called a static site generator builds that folder from your writing, once, on your own machine or on a build server. When a reader asks for a page, the host sends the file that is already there. Nothing is assembled per visit, so there is nothing to crash per visit.&lt;/p&gt;
&lt;p&gt;The generator I use is Eleventy. Others like Hugo, Jekyll and Astro work the same way. The choice matters less than people think. What matters is that the output is plain files you can move anywhere.&lt;/p&gt;
&lt;h2&gt;What I gained&lt;/h2&gt;
&lt;p&gt;&lt;strong&gt;It costs nothing to host.&lt;/strong&gt; GitHub Pages, Netlify, Cloudflare Pages and Vercel all serve a small static site for free. My old host charged twelve dollars a month for the same traffic.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;It is fast without trying.&lt;/strong&gt; There is no database query and no server-side rendering between the reader and the page. The home page of this blog is under 20 KB, and it loads in well under a second on a slow phone connection.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;There is less to attack.&lt;/strong&gt; No login page, no admin panel, no plugin with a known hole. The worst thing someone can do is read the posts, which is the point.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;The writing is mine.&lt;/strong&gt; Every post is a Markdown file in a git repository. I can read them with any text editor, search them with &lt;code&gt;grep&lt;/code&gt;, and keep them long after any particular tool is gone.&lt;/p&gt;
&lt;h2&gt;What I gave up&lt;/h2&gt;
&lt;p&gt;Some things need extra work on a static site. Comments need a third-party service or a mailing address. Search needs an index built at build time. A contact form needs a form service. None of these were hard to add, but they are not free in the way a CMS makes them feel free.&lt;/p&gt;
&lt;p&gt;The other cost is the build step. You change a file, then the site has to be rebuilt and uploaded. In practice a push to GitHub does both in under a minute, so I no longer notice it.&lt;/p&gt;
&lt;h2&gt;Would I do it again&lt;/h2&gt;
&lt;p&gt;Yes. The site has been on a static host for over a year. It has not gone down, it has not needed an update, and it has not cost anything. The time I used to spend on maintenance now goes into writing, which was the reason I had a blog in the first place.&lt;/p&gt;
</content>
  </entry>
</feed>