Our On-Page SEO Guidelines

Published on: August 15, 2022

This is a reference document that provides a checklist of on-page SEO guidelines to follow for new content posts.

Titles

Page and post titles should be capitalized and ideally contain the “target” keyword of the article.

This Is An Acceptable Title

Slugs

Permalink slug naming format should be lowercase alphanumeric with dashes.

this-is-an-acceptable-slug

This-Is-not-an-Acceptable-slug

Headings

By default the H1 heading is pulled from markdown title. Further sectioning of content should follow best practices using ordered headings.

Keep headings relevant to the subsequent content.

- Heading 1
    - Heading 2
        - Heading 3
    - Heading 2
        - Heading 3
            - Heading 4

Paragraphs

Keep paragraphs to a reasonable size, around 4 to 6 sentences each. Large sections of content if possible should be broken into sub-headings for readability and organization.

Images

Served images in an optimized manner. Images should be resized to fit the baseline required resolution and no higher.

All images should have an ALT tag describing the image for accessibility.

• Prefer PNG Images where possible.
• JPEG is suitable for complex images with many colors.

Pictures

Images should be served in format with a srcset containing an optimized WebP version of the image. The following shortcode will automatically optimize images into the WebP format and display correctly.

{{</* picture src="path/to/image.png" alt="This is a photo of..." */>}}

Figures

Figures can be used when a picture or group of pictures require a caption. The following shortcode will generate a figure using nested picture shortcodes.

{{</* figure class="optional-class" figcaption="Our Figure Caption" */>}}
    {{</* picture src="path/to/image.png" alt="This is a photo off..." */>}}
{{</*/ figure */>}}

Emphasis

Italics, Strong, Underline, Strikethrough should be used sparingly. Ideally you would use these to highlight specific keywords within the content of importance. For large scale styling of a sentence or paragraph opt to use CSS styling instead.

Keyword Density

The importance of this has diminished over the years, however the content should still reference the target keyword/topic throughout the article and its headings where naturally possible.

Readability

WIP

Metadata

Each post or page should have correctly formatted metadata for search engine and social media sharing readability.

Meta descriptions should contain no more than 155 characters and summarize the content of the article.

Opengraph

Opengraph descriptions follow the above format of 155 character limit.

Social Media

Facebook and Twitter have different requirements for designating optional cover images.

• Facebook uses the opengraph data format and images should have a minimum size of 1200x630px
• Twitter allows defining a separate image and should have a minimum size of 1024x512px

Both can be set in the frontmatter of the markdown.

HTML Semantics

Prefer HTML5 semantic tags where possible. In nearly all cases you will find a tag that best represents the content. Reserve <div> usage only where no appropriate HTML5 tag is possible or grouping elements for complex CSS styling is required.

When writing CSS target elements over needing to write a class.

Refer to https://developer.mozilla.org/en-US/docs/Web/HTML/Element for a list of elements.