Professionals run a checklist before every launch.

Before a launch, professionals work through a checklist, top to bottom, so nothing slips through. Most of it is in the head: charset first, the viewport, a unique title and description, a canonical link, Open Graph tags, an icon and a theme colour.

Then the body. One <h1> and a clear outline. The hero has fetchpriority="high", the pictures further down are lazy, and every picture has alt, width and height.

Last come the extras: structured data that matches the page, widgets built from HTML, and lang and dir set right. Tick every item, and your page is ready for the world.

<!doctype html>
<html lang="en-GB">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Pocket Garden | Plant care app</title>
    <meta name="description" content="Pocket Garden reminds you when to water, feed and repot every plant you own.">
    <link rel="canonical" href="https://example.com/">
    <meta property="og:title" content="Pocket Garden">
    <link rel="icon" href="logo.svg" type="image/svg+xml">
  </head>
  <body>
    <h1>Pocket Garden</h1>
    <img src="tree.svg" alt="A fig tree with a watering reminder" width="800" height="600" fetchpriority="high">
  </body>
</html>

Run the checklist on every page, not only the home page.