typestar

article_page.html in HTML

An article page with social metadata, semantic structure and a figure.

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Why tokens per minute - typestar</title>
  <link rel="canonical" href="https://typestar.io/blog/tokens">
  <meta property="og:title" content="Why tokens per minute">
  <meta property="og:image" content="https://typestar.io/og/tokens.png">
  <meta property="og:type" content="article">
  <link rel="stylesheet" href="/app.css">
</head>
<body>
  <header>
    <a href="/">typestar</a>
  </header>

  <nav aria-label="Breadcrumb">
    <ol>
      <li><a href="/">Home</a></li>
      <li><a href="/blog">Blog</a></li>
      <li aria-current="page">Why tokens per minute</li>
    </ol>
  </nav>

  <main>
    <article>
      <h1>Why tokens per minute</h1>
      <p>
        By Rowan Vale, <time datetime="2026-07-29">29 July 2026</time>
      </p>

      <section>
        <h2>Words are the wrong unit</h2>
        <p>
          Prose typing tests divide characters by five and call the
          result a word. Code is mostly punctuation, so that number
          says very little about how fast you can write a function.
        </p>
      </section>

      <section>
        <h2>Counting tokens instead</h2>
        <p>
          A lexer already knows where each token ends. Count the
          tokens you finished and you measure the thing you care
          about: how quickly ideas reach the file.
        </p>
        <figure>
          <img src="/img/tpm.png" alt="Tokens per minute over six weeks"
               width="720" height="360">
          <figcaption>Six weeks of daily practice.</figcaption>
        </figure>
      </section>

      <aside>
        <h2>Try it</h2>
        <p><a href="/tours/python/basics">Python basics tour</a></p>
      </aside>

      <footer>
        <p>Filed under measurement</p>
      </footer>
    </article>
  </main>

  <footer>
    <p>Built in the open.</p>
  </footer>
</body>
</html>

How it works

  1. The head carries canonical and Open Graph tags for sharing.
  2. The article nests sections, a figure, an aside and its own footer.
  3. time gives the publication date in a machine-readable form.

The run, in numbers

Lines
71
Characters to type
1642
Tokens
359
Three-star pace
80 tpm

At the three-star pace of 80 tokens a minute, this run takes about 269 seconds.

Type this snippet

Step 1 of 1 in Encore, step 23 of 23 in Semantics & metadata.

← Previous