seo coding

Considering SEO is so closely entangled in the development of your website and its pages, it’s no wonder why to ask if coding is a required skill to do Search Engine Optimization well.

More often than not, doing SEO does not require coding knowledge. However, there is some basic HTML & CSS code that you may come across, and knowing some basic knowledge about the HTML and CSS programming languages can help you do SEO more effectively.

The majority of work in SEO (~80%) is either researching what content to write about or actually writing the content. The other part (~20%) is actually putting the content into the website. This includes constructing and publishing blog posts or laying out and making landing pages. In most cases, this is usually done with some kind of visual builder not requiring you to know any code.

In fact, in the workplace it’s common for Search Engine Optimizers to closely work with web developers who understand the website platforms and the coding side a lot more, enabling them to worry about the technical side. I know this because I am that web developer, helping my SEO specialist co-workers out with their projects.

Code you might run into

As mentioned before you may run into some HTML and CSS code, so here’s what you can expect.

Links

<a href="https://www.google.ca">Link Text</a>

Above is the code for a basic text link. That ends up looking like this.

<a href="https://www.google.ca" target="_blank" rel="nofollow">Link Text</a>

That’s a more complex link with more going on that you surely will end up coming across at some point.

As you can see, the href attribute is where the URL the link is going to.

The target attributed in the lengthier link code above refers to whether or not the link opens in a new tab or not. By default, links open in the same tab, Add target="_blank" to it, and it will open in a new tab.

It’s common SEO and User Experience practice for links that go to other websites open in a new tab, while same-site links open in the same tab.

Finally, there is the rel="nofollow". As you probably know Google’s algorithm looks at the number of links pointing towards your website as a ranking factor. When you add the nofollow attribute to a link you are effectively telling Google not to count it as a “vote” for that domain, not giving it any additional authority.

Headings

You should know the importance of using headings in SEO. They provide structure for the content that Google can understand, and they make the user experience better by creating a hierarchy of information.

In WordPress it lays out the 6 different types in a user-friendly way, but you will eventually come to need to understand the code that creates them, like when you’re looking over a website to see if its SEO-friendly or not without having access to the backend.

different headings in wordpress

The code for the first 3 of the heading elements are:

<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>

And so on.

Headings are pretty self-explanatory to code, but in terms of usage its important to know when to use each one and for what.

  1. Each page should have only one H1 heading. This H1 should describe what the entire page is about. For example, if you had an about page on your website then the H1 should be something like “About” or “About Us”. Your about page should not have something like “We like to work and play hard” because then Google would assume that page is specifically about “Working and playing hard” – not about your company.
  2. H2 headings for primary topics under the topic of the H1
  3. H3’s for sub-topics of the H2’s
  4. H4’s for sub-topics of the H3’s

Lastly, H5’s and H6’s are not used often as content doesn’t tend to get that deep into the headings hierarchy. H5’s and H6’s are commonly used as decorative headings placed above other primary headings. As a general rule of thumb, the H5 and H6 headings don’t get much use so you don’t have to worry about them, especially in your SEO efforts.

Inline styling

You’ll see this one a lot, but most likely have to do it very little. A website’s style (colors, fonts, font sizes) is all done by using CSS. CSS is usually compiled up into many large CSS files that load in that make your website the way it looks.

Sometimes when developers get lazy, they will add inline CSS styling. This means that it’s valid CSS code, (to style something) but without opening and adding it to the file it should be in. So instead of putting it in a separate file, they put the code inline of the actual element, whether it be a paragraph, heading, or image.

Inline styling looks like this:

<h2 style="font-size: 30px; color: red;">My red heading</h2>

As you can see, we have an <h2> heading element being directly styled for font-size and color.

You’ll want to avoid inline styling as much as possible, but having it going to be the end of the world either, as it makes set up faster.

Inline styling is basically just adding regular CSS but inside the style attribute to an element. With CSS you can change many things like color, font size, line height, letter spacing, font, and decoration (like strikethrough or underline) – and that’s just some of the text-based CSS properties. There are tons of CSS properties and you can find the full list on W3 Schools website.

Google Analytics snippet

The last bit of code you may come across is the Google Analytics snippet. When you plan to do SEO on a website, its important to first start the tracking of your website traffic so you know if you’re getting results.

After making a property in Google analytics, it will give you a tracking snippet to add to your website so it can begin collecting data.

The snippet itself is HTML and JavaScript code, here’s what it roughly looks like:

<! – Global site tag (gtag.js) - Google Analytics – >
<script async src="https://www.googletagmanager.com/gtag/js?id=G-RKCJ8TRVJFDDK8"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'G-RFJ8Y7EMGV8');
</script>

This snippet isn’t meant to be edited or even understood at all, where the code comes in is knowing where to put it.

The snippet has to be put in the <head> of your website pages. If you’re using WordPress, this means adding it to the header.php file.

Every website is setup using this html code:

<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>

</body>
</html>

The head section is where a lot of settings, data, and files are set and loaded, the body section is all the content on your website goes (even the actual website header).

This is why you add the snippet in the head portion of your website, so it can load the tracking files.

For more information on setting up your snippet, see the how-to article by Google.

Is SEO a technical job in general?

Overall, SEO is not a technical job. It’s mostly content writing, researching what to write about, and analytics. However, there are times where SEO can challenge the technical side of you beyond the small bits of code previously mentioned.

Here are some technical tasks that may have to do while doing SEO for a website:

  • Website speed optimization
  • Setting up TXT records in the domain registrar for adding Google Search Console
  • Fixing robots.txt errors
  • FIxing common errors brought up by popular SEO tools like SemRush

These kinds of technical tasks don’t come up every day, but they are things you are sure to run into doing SEO on a website.

In summary, you don’t need to be a web developer to do SEO effectively, but having one around does help!