SEO for HTML Websites
The entire science behind SEO is mostly concentrated around WordPress Websites or, generally websites built using an admin panel. For this, SEO is simple. You can install a plugin and modify the page until the dot turns green. If you have a WordPress website make sure you check out Yoast Plugin – it will help you rank higher and improve the readability of your website!
However, not all websites are WordPress and the reason is simple. They don’t have to be WordPress for them to rank higher. If you want to read more about the advantages of having an HTML website you can check one of our recent article here.
Websites that don’t come with an admin panel imply modifying the code directly. Therefore, we find in this list HTML websites and AMP Websites. But how do we optimise for SEO without having a bubble that must turn green?
We build Mobile Websites for every single one of you, not only companies which have strong marketing teams. Therefore, it is only natural to show you how to effectively optimise your HTML Website for SEO.
URLs
The first impression Google has on your website is the name of the page you want to rank for. Hence, you need to be explicit right at the beginning. Changing URL’s is not a difficult task in HTML. Lets take a look at the example below
https://www.company.domain/products/mobile-website-templates.html
First we have the classical http or https (The Scheme) , and we strongly recommend using the secure version (HTTPS) and the Host, which is your company name and the domain (.com, .net etc.)
The last part of the URL is Called the Path and shows the name of the page you currently look at.
Now, on a WordPress website you can create your own path easily in the admin panel.
Due to the fact that you do not have an admin panel in HTML, you simply edit the name of the HTML file on your computer and upload it on your server!
Tip: Insert your main Keyword in the URL.
Ex: You have written an article about your latest trip to Paris and the tourist attractions. A SEO optimised URL will look like:
https://www.company.domain/paris-tourist-attractions.html
<HEAD> & <TITLE>
The usage of <Head> and <Title> tags are some of the most powerful tools in SEO because it helps Google correlate the URL with the actual content of the page.
Also make sure you use relevant keywords for your page!
<META> Tag
The <meta> tag goes in the <head> section of the HTML Website and can be used as a SEO Tool too!
Given the following situation: You have a new website without setting any <meta> tag to optimise for SEO. You only have the “viewport” and other mandatory website settings. When Google indexes your website and is ready to serve it to the potential users, it gathers some text from the page and displays it in search results.
However, that is not the best way to grab attention when there are tons of other websites that display a well thought line of text.
The best way to combat this situation is by adding a <meta> tag where you define the text that will appear in search results.
<head>
<meta charset=”UTF-8″>
<meta name=”description” content=”Free Web tutorials”>
<meta name=”keywords” content=”HTML,CSS,XML,JavaScript”>
<meta name=”author” content=”John Doe”>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
</head>
You can find more about this here: https://www.w3schools.com/tags/tag_meta.asp
Try to find the most suggestive keywords for the page you want to rank and don’t go crazy with the numbers. Keep it simple, short and professional. Moreover, when it comes to description, keep short, without extending it over 160 characters.
Content
First, the number of words suggested for one page or blog post should always be higher than 300 words. Pages that do not provide as much information tend to rank lower because Google doesn’t see it as valuable.
Secondly, you should always insert the keywords from your <meta> description and <title> in the actual body of the page. Make sure you put it at least twice in the text but not more than 4 times if the text is as short as 300 words.
Thirdly, make sure you use synonyms of the keywords. To better depict this we shall use a joke we have found online:
“A SEO expert walks into a bar…bars, beer garden, hangout, lounge, night club, mini bar, bar stool, tavern, pub, beer, wine, whiskey” – unknown author
Therefore, writing content for HTML is no different from writing content for a WordPress Website. The principles are the same!
Alt atribute & Image Optimisation
Bounce rate is a real obstacle and it must be defeated. Keeping the users engaged with pictures while also reading an amazing article can drastically reduce the bounce rate. Therefore, make sure you optimise the images before you upload them to your server. Not only it saves you space, but image optimisation helps your page load faster!
You can use this incredible tool -> www.tinypng.com
After you optimise your images, you should add the alt attribute to each one.
<img src=”smiley.gif” alt=”Smiley face”>
A bonus tip: Try using one of your keywords in one of the picture alt attribute. It will help with SEO big time!
Internal and External Links
When it comes to the homepage of your website, you will have internal links, in the menu or at least one on the actual page. You want people to reach the end goal of your website: make an appointment, buy your merch, subscribe to your newsletter and so on. Moreover, if you implement internal links on your website page, you show Google that your page is connected to the rest of your website.
However, when it comes to a blog, people tend to forget that there are tons of incredible resources and websites they can send their users too. Don’t be selfish because Google doesn’t like that either. Use external links and send the users to another website that may compliment your information, not be in competition with you.
This way Google will know that you are a trustworthy source. By linking to other websites the users will also trust you more. An information that is backed up by multiple and reliable sources is the best piece of information.
Code Optimisation
While we love to keep our code clean and readable for our customers, not all HTML websites are the same. Moreover, many of them can get quite messy including a lot of unnecessary lines of code. This is a big “No, No” for Google and for you too, because the unnecessary code will also load without any purpose.
The process of building a website is difficult and full of ups and downs. However, we do not want our customers to be stressed out by pointless code and incomplete features. This is our job and we take pride in creating the best mobile websites to work with.
Ending Words
Make sure you check out our store and ThemeForest Portfolio (link) and choose your favourite HTML mobile website. Start optimising it for SEO or contact our marketing team through Envato Studio (here) and let us do it for you!