SEO in One Post

Feb 10, 2021 • posted by Michael Hartl

Michael Hartl here from the Rails Tutorial and Learn Enough. Is it really possible to learn everything you need to know about so-called search-engine optimization in a single blog post? Read on to find out…

Ever since mighty Google came on the scene, every skilled website creator has had to know something about ranking well in search-engine results. Generally known as search-engine optimization, or SEO for short, this subject is generally considered to be fairly big and complex, with entire books and even companies dedicated to it. The core of SEO is actually quite small, though—(almost) simple enough to fit in a single tweet (Figure 1).

images/figures/seo_tweet
Figure 1: SEO in one tweet.

Because of Twitter’s (at the time) 140-character limit, I couldn’t literally fit all of SEO into a single tweet, but it’s only a slight exaggeration, and you can fit nearly all of it into one post. In line with the Pareto Principle (also known as the 80/20 Rule), you can get most of the benefits of SEO with a tiny fraction of the effort.

Two (easy?) steps

One of the reasons SEO books can run into the hundreds of pages is that they need to cover a lot of subjects, including HTML, web publishing, and website hosting. When you follow the Learn Enough tutorials, though, all the necessary subjects are automatically included. As a result, one post with two steps is all you really need.

Let’s recap the two steps from Figure 1:

  1. Get the title, meta, and heading tags right.
  2. Make something people want to link to.

Step 2 is up to you: undeniably a challenge, and beyond the scope of this post.

Luckily, with the right knowledge, Step 1 is relatively easy. And nearly all of it is included in Learn Enough CSS & Layout to Be Dangerous and its prerequisites, especially Learn Enough HTML to Be Dangerous. In fact, this post is adapted from an aside box called “SEO in one box” from Chapter 10 of Learn Enough CSS & Layout to Be Dangerous.

images/figures/learn_enough_results

All of the HTML tags needed for a website with good SEO are discussed in Learn Enough HTML and Learn Enough CSS & Layout. The most important is probably the title tag (covered in LE CSS Section 10.3.1), which should contain a descriptive title that naturally contains the words you want to target. The next important tags are meta tags (LE CSS Section 10.3.2), which contain “meta” information that isn’t displayed to users but is readable by search engines. Finally, the page’s heading or “h” tags are important, especially the two top-level headings h1 and h2 (LE HTML Section 2.1).

Targeting the Tau

As a concrete example, let’s consider a math essay I published in 2010 that has become somewhat famous (some would say infamous) among math/science/computer nerds. The name of the essay is The Tau Manifesto,1 and its subject is pi (the ratio of a circle’s circumference to its diameter) vs. tau (the ratio of a circle’s circumference to its radius). It also has an associated holiday, Tau Day, observed each year on June 28 (6/28 in the American calendar system).

In order to rank high on search terms like “pi is wrong”, “tau day”, “the tau manifesto”, and “michael hartl”, a good title might look something like this:

<title>
  Tau Day | No, really, pi is wrong:
  The Tau Manifesto by Michael Hartl
</title>

Next, we could add a meta tag with a more detailed description:

<meta name="description"
      content="The Tau Manifesto is dedicated to one of the most important
               numbers in mathematics…">

Finally, we could add could add h1 and h2 tags with text similar to the title:

<h1>
  No, really, pi is wrong
  The Tau Manifesto
</h1>
<h2>by Michael Hartl</h2>

(In the real site, there is a span tag to allow for styling the parts of the title differently, and the author attribution is an h3 for reasons I don’t recall. The principles, however, are the same.)

Putting everything together would give something like the HTML skeleton in Listing 1.

Listing 1: An HTML skeleton for The Tau Manifesto.
<!DOCTYPE html>
<html>
  <head>
    <title>
      Tau Day | No, really, pi is wrong: The Tau Manifesto by Michael Hartl
    </title>
    <meta name="description"
          content="The Tau Manifesto is dedicated to one of the most important
                   numbers in mathematics…">
  </head>
  <body>
    <h1>
      No, really, pi is wrong
      The Tau Manifesto
    </h1>
    <h2>by Michael Hartl</h2>
    .
    .
    .
  </body>
</html>
images/figures/tau_day

As noted before, making something people want to link to is up to you. Fortunately, The Tau Manifesto struck a chord (even literally), leading to a lot of inbound links. Together with its good HTML structure, this lead to ranking on the first page of Google results not only for things like “tau day” and “pi is wrong”, but even for the Greek letter “tau” itself.2

Domain keywords

If you have the luxury of tailoring your domain name to the keywords you’re targeting, an exact domain match can also help a lot. This step isn’t always possible, but when it is it can work exceptionally well, as it did with, e.g., the Rails Tutorial. And even if you don’t have an exact domain match, you can still get a lot of value out of “pretty URLs” (LE CSS Section 6.4) that include the keywords you’re targeting, such as learnenough.com/css-and-layout. Everything you need to get started with custom domains is covered in the free Learn Enough tutorial Learn Enough Custom Domains to Be Dangerous.

Off to the races

Everything in this post, although tailored a bit to search engines, is completely honest: there’s nothing in the HTML that’s not related to our site’s mission, and keywords aren’t repeated to excess. This philosophy applies even more to the main content of the page—if you’re actually writing about the subject whose keywords you’re targeting, the right word usage will emerge organically, so don’t worry about the details of your page copy. Indeed, search engines typically punish attempts to artificially manipulate the results, so any such efforts are likely to backfire.

Finally, when it comes to getting inbound links, quality content is king. Attempts to game search engines (with reciprocal link exchanges, link farms, etc.) are punished even more severely than attempts to manipulate the page copy, so don’t even try it.

images/figures/racecar

SEO isn’t exactly rocket science. Using only the techniques in this post, we’ve made sites with highly ranked search results for the English words “softcover” and “coveralls”, the phrase “learn enough”, the competitive search term “rails tutorial”, the phrase “pi is wrong”, and (as already noted) even a letter in the Greek alphabet. With some work and a little luck (and maybe the Learn Enough All Access Subscription), you too could be off to the SEO races.3 Good luck!

The Learn Enough All Access Subscription includes access to all the Learn Enough tutorial courses. 7-day free trial, 100% money-back guarantee.

1. Essay titles typically get typeset using quotes, as in “The Tau Manifesto”, but that never felt substantial enough, so I generally set The Tau Manifesto in italics.
2. The Tau Manifesto used to rank even higher, but a film called TAU came out and knocked it down a few notches. But it’s on the first page of results for a letter in the Greek alphabet—that’s still pretty impressive!
3. Racecar image downloaded from Wikimedia on 2018-03-27. Copyright © 2017 by Morio and used unaltered under the terms of the Creative Commons Attribution-ShareAlike 4.0 Unported license.