Share



SEO Tips & Tools for Programming Blogs and Bloggers in 2018


Spider web represents blog SEO optimization techniques

I’ve noticed that many programming blogs I read don’t implement certain simple SEO techniques, and bloggers could be missing valuable traffic opportunities. I will describe a couple of search engine optimization tips which can improve your technical blog’s SEO ranking and search results position in 2018. I will cover topics like Google’s Featured Snippets, best rendering speed tips and social media meta tags.

I use jekyll based pixyll template for this blog but most of the tips should be applicable to all custom blog engines. If you use Medium as your only blogging platform (protip: you probably shouldn’t) none of these tips will be applicable.

Here’s what you can do:

Add Open Graph and Twitter meta tags to improve social sharing

Social media sharing is one of the top sources of traffic to my blog. You can affect how your post looks when shared on social media sites by using so-called “Open Graph meta tags”. Which of these Twitter cards would you rather click?

Bloger's post shared on Twitter without correct SEO meta tags

Blogger's post shared on Twitter without correct meta tags

Blogger's post shared on Twitter with correct SEO meta tags

Blogger's post shared on Twitter with correct meta tags

Currently my blog uses the following meta tags:

<meta property="og:locale" content="...">
<meta property="og:type" content="...">
<meta property="og:title" content="...">
<meta property="og:description" content="">
<meta property="og:url" content="...">
<meta property="og:site_name" content="...">
<meta property="og:image" content="...">
<meta property="og:image:width" content="...">
<meta property="og:image:height" content="...">
<meta property="article:published_time" content="..." />

<meta name="twitter:card" content="...">
<meta name="twitter:image" content="...">
<meta name="twitter:site" content="..." />
<meta name="twitter:creator" content="..." />
<meta name="twitter:title" content="..." />
<meta name="twitter:description" content="..." />
<meta name="twitter:url" content="..." />

The best way to check how your page will display on social media sites is to use these tools:

Twitter Card Validator

Facebook Open Graph debugger

As I mentioned adding Structured Data enables your website to appear in Google’s featured snippet top search result:

Add Structured Data appear Google featured snippets

Featured Snippet thanks to Structured Data

This is a schema.org BlogPosting entry scaffold I use for this blog:

<script type="application/ld+json">
  {
    "@context": "http://schema.org",
    "@type": "BlogPosting",
    "mainEntityOfPage": {
      "@type":"WebPage",
      "@id":"..."
    },
    "headline": "...",
    "image": {
      "@type": "ImageObject",
      "url": "...",
      "height": 640,
      "width": 1024
    },
    "datePublished": "...",
    "dateModified": "...",
    "author": {
      "@type": "Person",
      "name": "..."
    },
    "publisher": {
      "@type": "...",
      "name": "...",
      "logo": {
        "@type": "ImageObject",
        "url": "...",
        "width": 600,
        "height": 60
      }
    },
    "description": "...",
    "keywords": "..."
  }
</script>
A sample structured data for a blog post. Publisher logo must have 60x600 size.

Remember that adding Structured Data does not guarantee that your website will be featured. It has to be in top 10 results for a given search phrase (but not necessarily first). All you can do is double check if Structured Data entry is correct using this tool and make sure that all other mobile and SEO optimisations are in place. So far I managed to see a featured snippet for only one of my blog posts using a bit clunky keywords. But I see a decent traffic coming from googleapis.com/auth/chrome-content-suggestions source and it means that users see and arrive to my website via Chrome’s suggested articles section.

Optimise rendering speed and “mobile friendliness”

In 2016 Google announced its “Mobile-first” approach to ranking pages. How fast page loads and feels for mobile users is a crucial ranking signal which should be optimised. These are some great tools allowing you to detect your website’s mobile shortcomings:

Google Page Speed Insights

Mobile-Friendly Test

Web Page Test

Here are a couple of optimizations I successfully applied to this blog:

Leverage browser caching with assets preprocessor

Google’s speed test will not be satisfied as long as you don’t cache your static assets for at least 8 days. To avoid problems with client browsers keeping outdated resources you should use the assets preprocessor. For this blog, I am using jekyll-assets to add digest tags to all the resources. Whenever an asset changes its digest tag in URL is modified so I can cache everything without worrying that outdated version is ever served.

One problem is that you cannot cache external resources like Disqus JavaScript library of Google Analytics itself. There are some hacky ways to overcome it. You could periodically download up-to-date files to your server using scheduled tasks, and add caching headers but I did not try to do it yet.

I use Cloudflare to configure browser caching headers.

Optimize and resize images

This one is quite easy to fix. Just process all your images with compressor.io. Also, make sure they are only as big as needed to display properly in all resolutions. I’ve only just recently removed a 6000x4000 sized image from landing page of Abot - Anonymous feedback bot for Slack.

Reconsider website dependencies

For me an interesting side effect of playing with those optimization tools was that I started thinking more about the code I embed on my websites. Do I really need a fancy live chat support on a landing page when a standard contact form would do? Do I need an interactive like/follow button embedding KBs of spyware my visitors will probably block anyway? Maybe I could just add an icon linking to my account/fan page instead?

It is entirely up to you but spoiling your website mobile friendliness and SEO ranking for a couple of bells and whistles could not be the best tradeoff.

Check the optimization results

Google speed ranking on mobile Google speed ranking on desktop

After a couple of SEO optimizations Google speed ranking is finally green.

As you can see this blog is quite swifty according to Google speed test. When I started SEO and rendering speed oriented optimization it was around 70.

Double check your spelling

I’ve recently discovered that I had a typo in the heading of one of my landing pages. It must have been killing my SEO for months. I highly encourage to double check all your writing with Grammarly.

Use SSL for your blog

There is no excuse on why a technical blog (or any website) in 2018 should not have an SSL support. Since 2014 HTTPS is a ranking signal for the Googlebot. You can check out my other blog posts for tips on how to setup a free wildcard SSL with Cloudflare and serve all browser assets via HTTPS using a simple SSL proxy.

Don’t trust Google Analytics traffic stats

Maybe it’s not standard search engine optimization tip but worth mentioning anyway. Google Analytics is amazing. Only terribly inaccurate:

Google Analytics stats

CloudFlare stats

Google Analytics report ~500% less traffic than Cloudflare

I was surprised to see how much both figures differ. I am targeting tech-savvy users in my blog posts so it probably increases the ratio of ad/tracking blockers enabled, but still, 500% difference is huge. If you make any business decisions based on Google Analytics data remember to take it into account. You can add Cloudflare to your website for free. Contrary to Google Analytics it works by proxying all the traffic through their servers so is impossible to block.

Summary of SEO tips for bloggers

Some people say that there is no such thing as search engine optimization techniques. You just need to create a valuable content. But why not help this valuable content get discovered by optimizing it?

I hope you did not know at least one of those SEO techniques and will notice a traffic increase after applying it to your website. Let me know if I got something wrong or you know other ways to improve a programming blog’s SEO ranking.

BTW I am giving away the template of this blog. It includes all the SEO optimizations described above and more: jekyll SEO template - the best alternative to blogging on Medium.

Pawel Urbanek Full Stack Ruby on Rails developer avatar

My project Abot - Anonymous Feedback Bot for Slack has recently received a major update. I invite you to check it out.

I'm not giving away a free ebook, but you're still welcome to subscribe.

Back to top