The introductory paragraph above features a drop-cap: the “H” in “Hello” is huge. The behavior of drop-caps is a bit customizable. So if, for instance, I know that the first paragraph of this article is just a single sentence and the drop-cap would look silly, I can disable it. Besides “off,” the available options for drop-caps are init, section, and all, for one or both of the two cases where drop-caps may be added. The very first paragraph of the article is the init case. We’ll see the other later. First…

This is a section heading.

It’s indicated with two pound signs in Markdown, but gets rendered as an h2 element once it gets transformed into HTML. h1 is reserved for the article title and shouldn’t be used in the document body. Fun fact: apparently including plenty of h2s in your document is important for SEO? Or maybe my information is out of date. Maybe none of that matters anymore in the age of AI and we’ve given up on making our stuff appear on Google. I’m not totally sure where I heard that h2 thing anyways.

There are further levels of headings:

This is a level 3 heading. It’s an h3 element.

This is a level 4 heading. It contains bold text.

This is a level 5 heading. It contains italic text.

All these lower-level heading types appear in the body font, Roboto, rather than the title font, Lato. Which reminds me: I should test formatting in my section headings as well. Here we go:

This is another section heading. It contains code, italics, and bold type. Besides which, it’s just very long.

Links are important elements of the World Wide Web. The last word in this sentence is a link to my Bluesky. Links come in all sorts of different lengths. This entire sentence links to my GitHub.

You can also link to different locations within the same document. This sentence contains a link to the first section of this page. This sentence has a footnote.¹

Next up is a block quote. This particular quote is from YouTube video essayist Noah Caldwell-Gervais, chosen for no other reason than I had it written down in my Supernote and it was close to hand.

This is the power of the road narrative in American culture, its deepest and and least-articulated appeal: that there is peace in the journey because the destination might be illusory. I really do love this country, but what I love most about it are always the things that it’s told me it wanted to be, and so much more rarely what it is in practice.

The element above is an hr, or “horizontal rule.” It can be used to divide sections of text from each other without using a heading.

You’ll notice this section also began with a drop-cap. This is the section case for the drop-cap rule. When this rule is active, paragraphs immediately after a section break get a drop-cap. This might be standard practice, but I specifically observed this behavior on The Verge. As best I can tell, features on that website get a drop-cap at the beginning and after section breaks, but not after section headings.

Now let’s test different kinds of list!

First: an unordered list.

Some of my priorities for this Jekyll theme are:

• Magazine-like appearance
• Good for short posts and for very long ones
• Short URLs, long article titles
  • I like very short, memorable URLs
  • Having shorter URLs means the header bar above can contain a largeish breadcrumb trail
    • Having a largeish breadcrumb trail means the breadcrumbs can double as a page title

Second: an ordered list.

I’ve got a project I’ve been thinking about a lot lately. I want to procedurally generate a pretty 3D mountain scene with WebGPU. This scene will include some features:

1. Mountain
   • Generated with diffusion-limited aggregation? Can it be made compute-shader-friendly?
2. Trees
   • Lots of previous work on this
   • This looks promising
   • So does this
3. Grass
4. Water?
5. Glacier?

Third: a checklist!

Here are some content elements I’ve tested so far:

• Headers
• Lists
  • Unordered
  • Ordered
  • Check (this list)
• Code blocks (coming next!)
• Tables

Did you know I write code for a living?

It’s true! And I might want to write about it. And when I write about it, I’m likely to want to add snippets of code to my post. Theoretically, I should be able to get syntax highlighting for multiple different languages in my code blocks. So let’s test that too. Here’s some example TypeScript code:

class Vector2<T = number> {
  constructor(public x: T, public y: T) {}

  add(other: Vector2<T>): Vector2<T> {
    return new Vector2(this.x + other.x, this.y + other.y);
  }
}

And here’s some Rust code:

use std::ops::Add;

#[derive(Clone, Copy)]
pub struct Vec2<T: Copy> {
  x: T,
  y: T,
}

impl<T> Vec2<T> {
  pub fn new(x: T, y: T) -> Self {
    Self { x, y }
  }
}

impl<T: Add> Add for Vec2<T> {
  type Output = Vec2<T::Output>;

  fn add(self, rhs: Self) -> Self::Output {
    Vec2 {
      x: self.x + rhs.x,
      y: self.y + rhs.y,
    }
  }
}

Lastly, tables!