Blog / Growth

Optimising SEO guide for static site generators

The SEO guide for static site generators. Best practices, tips and ideas to help push your SaaS’ marketing site in the search ranking (free PDF checklist included).

Photo by Pankaj Patel on Unsplash

SEO often feel like black magic to (starting) SaaS founders, but it isn’t all too complicated réally. In this article, which includes a free PDF quick guide/checklist at the bottom, I explain the 10 steps your site benefits from immediately once you implemented them.

Let’s start with getting something straight first. The first step, before every other step, henceforth called step 0 is to create quality content.

Throughout this article you’ll find 💡, these are general tips to apply to your Static Site Generator of choice. Consult the official docs for specific implementation details.

0. Write quality content #

It all starts with quality content. Nothing you can do about this. Explore ideas, gather resources, read, write a draft, scrap half, rewrite the other half, have QA go over your draft, make changes, create assets to go with the article, get the final go and… publish! Indeed, writing quality content on your SaaS blog is no small feat. But the results are, over (a long!) time so worth it.

There are several factors to consider when determining what qualifies as high-quality content for SEO purposes.

Relevant to your audience #

The content should be relevant to the topic and your site’s target audience. It should provide value and address the needs and interests of the audience.

Original content #

Be original. Nothing copied or duplicated from other sources. Plagiarised or duplicate content can be penalised by search engines and can negatively impact the credibility and authority of your SaaS’ blog.

Excellent writing #

Have well-written and easy to read content, with a clear and logical structure. It should use proper grammar, spelling and punctuation. And of course no errors or tpyostypos.

Usefulness #

The content should be useful and provide value to your reader. It should be informative, insightful or entertaining in some way. Bonus points if it’s something your readers would be interested in sharing with their peers.

Quality beats quantity

Length #

The length of the content is not necessarily the most important factor, but in general, longer and more in-depth articles tend to perform better in terms of SEO. Because they are more comprehensive and can provide more value to your readers. This can lead to higher engagement metrics, like time on page and bounce rate, and signal to search engines that the content is, potentially, of high quality.

These are general guidelines, and the ideal length and depth of your content will depend on the specific topic and audience of your site. It is more important to focus on creating high-quality and useful content that meets the needs and interests of your audience, rather than simply aiming for a certain word count. Just do a quick search and you’ll find blogposts about the “ideal article word count”. Which signals it’s a tricky subject, but just remember: quality beats quantity.

1. Include relevant and unique page titles and meta descriptions #

Page titles, <title />, and meta descriptions, <meta name="description" content="content" /> should be added for every page. These should accurately reflect the content of the page and be written in a way that is both informative and compelling to your reader.

The length of meta titles and meta descriptions can have an impact on your search engine rankings and the click-through rate (CTR) of your pages in search results.

💡 If you use a reusable layout file, you can pull in the page’s title from the markdown’s Frontmatter to use.

---
title: My Page Title
date: 2023-01-12
---
<head>
  <title>{{ page.title }}</title>
  ...
</head>

Meta titles #

It is generally recommended to keep meta titles under 60 characters, as this is typically the maximum that will be displayed in search results. That being said, it is important to balance the length of your meta titles with the relevance and clarity of the information they contain. Aim for a meta title that accurately reflects the content of your page and is compelling to your reader.

Meta descriptions #

Meta descriptions do not directly impact your search engine rankings, but cán influence the CTR of your pages in search results. It is generally recommended to keep meta descriptions under 160 characters, as this is typically the maximum that will be displayed in search results. Just like with meta titles, it is important to balance the length of your meta descriptions with the relevance and clarity of the information they contain. Aim for a meta description that accurately reflects the content of your page, is informative and compelling to your reader and includes relevant keywords.

Check out this Google article, where they laid how snippets are created. You will notice they won’t always use the meta description of your page.

2. Use header tags appropriately #

Headers tags, like <h1 />, <h2 />, are important for the hierarchy of your content and make it easier for search engines to understand the structure of your pages.

This hierarchy is an important aspect of on-page SEO, as it helps search engines understand the structure and organisation of your content. What are some ways to use these heading correctly?

Preview of correctly using heading hierarchy

Use h1 tags for the main heading of your page #

The h1 tag should be used for the main heading or title of your page. It should be at the top. There should only be one h1 tag per page, as it represents the most important heading on the page.

Use h2 tags for secondary headings #

The h2 tag should be used for secondary headings or subheadings within your page. These headings should be used to break up the content of your page into logical sections and to provide additional context and structure to your content.

Use h3 tags for tertiary headings #

The h3 tag should be used for tertiary headings or subheadings within your page. These headings should be used to break up the content of your page into smaller sections and to provide additional context and structure to your content.

Use headings appropriately #

It is important to use headings appropriately and to avoid using them simply for formatting purposes. Headings should be used to organise and structure your content, not to for visual treatments, like bold text or a larger font size.

Use headings consistently #

Help search engines understand the structure and organisation of your content, by using headings consistently throughout your site. Avoid skipping heading levels or using randomly adding headers, as this can make it difficult for search engines to understand the hierarchy of your content.

Correct use of headings can help improve the readability and SEO of your pages. It is important to use headings appropriately and consistently to help search engines understand the structure and organisation of your content.

3. Use descriptive and keyword-rich URLs #

Keyword-rich URLs can help search engines understand the content of your pages and may also improve the CTR from search results.

Table with good/bad urls

Use keywords in your URLs #

Including relevant keywords in your URLs can help search engines understand the content of your pages and can also improve the CTR of your pages in search results. Keep in mind that it is important to avoid keyword stuffing, as this can be viewed as spammy by search engines and can negatively impact your rankings.

Keep URLs short and concise #

Shorter URLs are generally easier to read and understand, both by users and search engines. Aim for URLs that are as short as possible while still accurately reflecting the content of your page.

Use hyphens to separate words #

Hyphens, to separate words in your URLs, can make them easier to read and understand, both by readers and search engines. Avoid using underscores or other characters to separate words, as these can be less effective at communicating the structure of your URLs.

Use lowercase letters #

It is generally recommended to use lowercase letters in your URLs, as some servers and systems may treat uppercase letters differently. Using lowercase letters can help ensure that your URLs are consistent and easy to understand.

Avoid using unnecessary words #

Keep URLs focused and concise. Avoid the use of unnecessary words or filler content. This can help ensure that your URLs accurately reflect the content of your pages and are easy to understand.

It’s worth noting that there is no “perfect” length for a SEO-optimised URL, as the ideal length will depend on the specific content of your page and the keywords you are targeting. However, shorter URLs are generally easier to read and understand, so it is generally a good idea to keep your URLs as concise as possible while still accurately reflecting the content of your page.

4. Use alt text to describe images #

As search engines are not able to see images the same way humans do, alt attributes, also known as “alt tags” or “alt descriptions”, can help them understand what the image is about.

The content of alt attributes is important for both SEO and accessibility. They are used to describe the content of images in HTML. They are also intended to provide a text alternative for visitors who are unable to view the images (for example, because they are using a screen reader or have a slow internet connection: more common than you would think!).

For SEO #

In terms of SEO, alt attributes can help search engines understand the content of images on your site. This can be particularly important for images that are important to the content of your pages, as it can help search engines understand the relevance of those images compared to the content of your site.

For accessibility #

In terms of accessibility, alt attributes are critical for users who are unable to see the images on your site. By providing a text alternative, alt attributes allow these users to understand the content of the images and to navigate your site more easily.

It is important to ensure that your alt attributes are descriptive, accurate, and relevant to the content of the images they describe. This can help improve the experience for both visitors and search engines.

5. Use internal linking #

Internal link building refers to the process of linking to other pages within your own site. This can help search engines understand the relationship between your pages and can also improve the user experience by helping users navigate your site more easily. Next to that it helps distribute link equity (ranking power) more evenly across your site.

💡 Most static site generators allow you to link to relative pages, like so: [Link Text](/relative/path/to/page). But check the docs of your SSG to see if there’s a helper method available that runs through a router of sorts. This way, if you or someone from your team adds a wrong path, the SSG will output an error so you can fix it.

Use descriptive and keyword-rich anchor texts #

The anchor text is the visible text of a link. It can provide context and help signal the relevance of the linked page to search engines. Use descriptive and keyword-rich anchor text to help search engines understand the content of the linked page and to improve the user experience.

Not all pages on your site are equally valuable or relevant, so it is important to focus your internal linking efforts on the most important and useful pages. This can help search engines understand the hierarchy and structure of your site and may also improve the overall user experience.

A logical and consistent link structure can help search engines understand the relationship between your pages and can also make it easier for users to navigate your site. This can include using clear and descriptive URLs and linking to pages in a logical order.

Use a sitemap #

A sitemap is a list of all the pages on your site and can help search engines discover and crawl your pages more efficiently. It can also be useful for users who are trying to find specific pages on your site.

It is important to track the effectiveness of your internal link-building efforts and to identify areas for improvement. This can include monitoring the number and quality of internal links to each page, as well as the traffic and engagement metrics of those pages.

6. Use schema markup to provide additional context #

Schema markup can help your pages stand out in search results and may also provide readers with more information about your content.

Schema markup is a type of structured data that can be added to the HTML of your web pages to provide additional context and meaning to the content on your site. It is used to help search engines understand the content of your pages and to display your pages more prominently in search results. Check for example: the “published” timestamp at the bottom of this article, and see how it has a itemprop="datePublished" added to it. This tells search engines that this timestamp is the published date of this article.

There are many different types of schema markup that can be used, including product schema for e-commerce sites, event schema for event listings, and article schema for news articles. By using schema markup, you can help your pages stand out in search results and provide users with more information about your content.

To add schema markup to your pages, you can use the JSON-LD format, which involves adding a script tag to the head or body of your HTML. You can then include the schema markup within the script tag in the form of a JSON object.

Tools can help you ensure that your schema markup is properly formatted and that it is providing the intended information to search engines:

A great reference is schema.org. Check also this great article by Ahrefs about Schema markup.

7. Ensure that your site is mobile-friendly and loads quickly #

Speed is increasingly important for search engine rankings. There are several factors to consider when optimising a static site for mobile usage:

Page speed #

Mobile users tend to have a lower tolerance for slow-loading pages, so it is important to ensure that your static site loads quickly on mobile devices. You can use tools like Google PageSpeed Insights to analyse the speed of your site and see what needs improvement.

Responsive design #

Make sure that your static site is designed to be responsive and adjusts to the size and orientation of the user’s device. This can be achieved through the use of responsive design techniques, such as fluid grids and media queries. This 2011(!) article from Smashing Magazine is a solid primer.

Optimise images #

Large or poorly optimized images can slow down your site’s loading time on mobile devices, so it is important to ensure that your images are properly optimized for the web. You can use tools like Kraken.io or TinyPNG to compress and optimize your images.

Minimise JavaScript #

While JavaScript can be useful for adding interactivity to your site, it can also increase the loading time of your pages on mobile devices. Consider whether the use of JavaScript is absolutely necessary and rethink your code to use alternative techniques (such as CSS) whenever possible.

Also consider using Progressive Enhancement. This technique ensures your site is usuable without JavaScript, but when enabled might just work a tad bit better. A good example of this is Spinal’s docs’ navigation on smaller screen. It expands/collapses on smaller screens without JavaScript enabled, but when JavScript is enabled it just works a bit nicer by adding a transition.

Accessibility #

It is important to ensure that your static site is accessible to users with disabilities, including those who may be using assistive technologies like screen readers. There are several tools and resources available to help you test the accessibility of your site, including the WebAIM WAVE Tool.

8. Add a sitemap #

A sitemap is typically an XML file that lists all the URLs on your site, along with additional metadata about each URL (like the date it was last modified and the frequency with which it is updated). The purpose of a sitemap is to help search engines discover and crawl all of the pages on your site more efficiently.

There are also HTML sitemaps, which are essentially lists of links to the pages on your site that are intended to be accessed by your visitors. These can be helpful for visitors who are trying to find specific pages on your site or who want to explore the content on your site more thoroughly.

To create a sitemap for sites generated with Jekyll, 11ty, or Astro, you can use a plugin or tool specifically designed for generating sitemaps for these tools.

Jekyll has a plugin called “Jekyll Sitemap Generator”. 11ty allows you to create an XML sitemap by adding a specific template to your site. For Astro you can use Astro Sitemap that can generate an XML sitemap for your site.

Check the documentation of your SSG of choice on the details.

Alternatively, you can use a standalone sitemap generator tool to create a sitemap. These tools crawl your site and generate a sitemap based on the URLs they find. There are several sitemap generator tools available online, including XML-Sitemaps.com or the XML Sitemap Generator from Screaming Frogs.

9. Monitor your search engine rankings and traffic #

To understand the effectiveness of your SEO efforts and identify areas for improvement be sure to monitor all important metrics.

There are several tools that can be used to monitor search engine rankings and traffic, including:

Google Search Console #

Google Search Console is a free tool by Google that allows you to track your site’s performance in search results and identify issues that may be affecting your visibility. It also provides data on the keywords that are driving traffic to your site and the countries where your traffic is coming from.

Ahrefs #

Ahrefs is a paid tool that offers a wide range of SEO and marketing features, including the ability to track your search engine rankings and traffic. It is known for its extensive backlink data, which can be useful for identifying link-building opportunities and analysing the link profiles of your competitors. Ahrefs also provides data on the keywords that are driving traffic to your site and the search queries that are bringing users to your pages.

Ahrefs is a powerful tool that can be useful for tracking your search engine performance and identifying opportunities to improve your SEO efforts.

Tip: Ahrefs comes with pretty good free plan.

SEMrush #

Semrush is a paid tool that offers a wide range of SEO and marketing features, including the ability to track your search engine rankings and traffic. It also provides data on your competitors’ performance and allows you to identify opportunities to improve your own site’s visibility in search results.

These are just a few of the many tools that are available for monitoring search engine rankings and traffic.

There are a lot resources available for you to learn more about SEO.

Blogs #

There are many SEO-focused blogs that provide regular updates and insights on the latest trends and best practices in the industry. Some popular SEO blogs to follow include Search Engine Land, Moz, Backlinkto, and Quick Sprout.

Twitter accounts #

Following SEO experts and industry leaders on Twitter can be a great way to stay up-to-date on the latest trends and insights in the industry. Some popular SEO accounts to follow include mattcutts, randfish, amandanat and dannysullivan.

YouTube #

There are many YouTube channels that provide educational videos and tutorials on SEO topics. Some popular channels to check out include Backlinko, Ahrefs, and SEMrush.

Books #

There are many books available that cover a wide range of SEO topics, from the basics to advanced strategies. Some popular books to consider include “The Art of SEO” by Eric Enge, Stephan Spencer, and Jessie Stricchiola, and “SEO 2020” by Adam Clarke.

Online communities #

There are many online communities and forums dedicated to SEO, where professionals can share insights and ask questions. Some popular communities to check out include the Google Webmaster Central forum and the SEO subreddit.

Google’s resources #

Google has many resources available for learning more about SEO, including the Google Search Central Blog, which provides updates and insights on the latest search algorithms and best practices. Google also has a Webmaster Academy, which offers a series of online courses and tutorials on SEO and webmaster-related topics.

Takeaway #

The number one takeaway from this article would be the importance of creating high-quality and useful content that is relevant, original, well-written, useful, and valuable to your target audience. This is the foundation of good SEO and is essential for attracting and retaining visitors to your site.

The next important bit is to ensure that your site is well-designed, user-friendly, and optimised for search engines. This can include things like ensuring that your site is mobile-friendly, using proper headings and tags, and optimizing your site’s URLs and metadata.

Have questions on certain aspects written in this guide? Something unclear? Or maybe you want a second pair of eyes on your SaaS site’s content? Feel free to email support.

Free SEO guide for SSG PDF #

Like to have a concise checklist with all above info in one handy checklist? Download this PDF. Easy to keep at hand or to share with your team.

Written by July Forand

Published: (updated: )

Get all Spinal content in your inbox

Every first Thursday of the month, we'll send the latest about Spinal in your inbox. From product updates, articles and a little peek behind the scene of building a SaaS in 2024.

Get all the latest every first Thursday of the month. No spam. Unsubscribe at any time.