On-page SEO, write up of my London Local Etsy Conference Talk
On 15th July I’m giving a talk on On-Page SEO at the Etsy London Local Etsy Conference and Workshop organised by the lovely London Local Team members.
I’ve put together a write-up of as well as all the resources from my talk so that everyone can access them post-conference.
What is SEO?
SEO means Search Engine Optimisation. Think of the Etsy Search or the Google Search (as well as Bing, but we’ll consider Google the main driving search engine) as Search Engines and how if you use the right tags in the right place on your Etsy listing, your listing will come up higher, maybe on the first page of a particular search. Equally, SEO is a series of techniques which can help your website appear higher in the list of results in a Google Search.
Although I’m going to be giving you tips on how you can optimise your website, unfortunately it’s not as easy as it is on Etsy, your website won’t appear as first result overnight, you need to put in the work on a daily basis.
On-Page SEO vs Off-Page SEO
In my talk I cover On-Page SEO, which are techniques focused on individual pages of your websites, both from the code and the content point of view.
Off-Page SEO instead is everything to do with how you publicise your website on other websites and social media, leaving a link which goes back to your website; other examples are when you leave a comment on another website or writing a guest article for a blog.
How Search Engines Work
Search Engines have a sophisticated computer programme called Crawler or Spider or User Agent which browses the web and discovers new pages, updated pages and dead pages.
When a Crawler visits a page, it will scan for all the links on that page to not only compile a list of all the links on the current website so it can visit them all, but also of external links to which the crawler will move onto next.
When on a page, it will also scan for all the words you’re using to determine the context of the page, what it is about but also archive the page and the words used in again a massive list.
When a user performs a search, a particular search word will be entered in a search bar; The Search Engine will then look into its records for all pages matching the search words. A sophisticated algorithm will score each page and decide which pages to display and in which order.
So what’s an Algorithm?
An algorithm in this case is a series of criteria which allow the Search Engine to decide if a page is more relevant than another when a search is performed. Algorithms are pretty much always secret.
On Etsy for example, the number of sales might help a listing rank higher than others: you might have 2 exact listings but one might be shown on page 1 and the other on page 20, just because the first has more sales. But many more criteria for Etsy ranking might still be a mystery.
It’s the same for Search Engine algorithms, although there are a few criteria which are well known or have been announced by Google and I will list them during my talk, but keep an ear out for updates from Google in the future.
Accessing and navigating your site
So you might start understanding how important it is for your website to be found and crawled to achieve higher ranking in searches.
A Robots.txt (automatically created on Shopify and Wix sites, install a plugin for WordPress if needed)file will contain instructions for User Agents in cases where you would like to exclude some pages from being crawled.
It’s very important instead to keep an updated XML Sitemap of your website. This is a list of all pages (with links) of your website. It looks a bit like a table of contents from a book. Wix and Shopify automatically create one; you will need to install a plugin (Google XML Sitemap for example) on WordPress. You can use an online tool like this https://www.xml-sitemaps.com/ to generate one if you maintain your own website.
Add a navigation to the beginning of your page. Use multiple navigations to describe different journeys on your website. For example, to provide a journey to a stockist, you might add one navigation on the footer with links to your line sheet and your terms and conditions.
Add breadcrumbs on your website. They show the trail of a page. For example:
Home -> Shop -> Category Name -> Product
If a visitor lands on your page from a google search and he likes your products, he might be wondering what other wonderful things you might sell of the same kind. He will look for the breadcrumb and maybe click on the Category Name link.
Giving options to your visitors is always a great idea from the User Experience point of view. Having a lot more pages on your website beyond your homepage is another good factor for crawlers.
Add an indication that there’s a “next” and a “previous” page in navigation (these might be instructions you can pass to whomever looks after the coding side of your website). These will give crawlers directions on how pages are related and therefore content as well as links of pages to move onto next.
<a href=”next.html” rel=”next”>Next Page<a/>
<a href=”prev.html” rel=”prev”>Prev Page<a/>
Before moving to further practical SEO techniques, I’d like to revisit a concept and maybe introduce one. Your focus keyword is the main keyword that describes your page, that you aim visitors would use to get to your website from a search. The focus keyword is page specific.
Long tail keywords
Some of you might be familiar with this concept, but it’s new to me. Long tail keywords are more specific keywords with less competition, therefore they are cheaper when you pay per clicks.
If you’ve used Google Adword Planner (or looked at keywords used by visitors on your Etsy store), you probably have been looking at suggested keywords with high volume of searches. Long tail keywords instead are the ones which will sit more towards the bottom and have a lot less clicks.
Customers who use a long tail keyword are more ready to make a purchase. Let me give you an example.
Let’s say you are looking for a present for your best friend. Your first search is “necklace”. You will see different styles of necklaces and maybe spot a rainbow one. You remember that your friend is really into rainbows, so your next search will be quite specific: “rainbow necklace” and you’re pretty close to buying a product, your next click might convert into a sale.
Even if you are receiving less clicks and visits from a search, a visit which converts to a sale is much more valuable to Search Engines.
Another SEO technique is to write as many pages as possible per long tail keyword. Google love websites with lots of content and lots of pages and lots of new and updated pages. so this is another reason to use long tail keywords.
Managing SEO content on website platforms
Most of the techniques I’ll be covering from now on, are catered for on Wix, WordPress and Shopify website already, but for WordPress I recommend installing YOAST yoast.com
Shopify SEO support
Shopify includes powerful SEO features in all plans, including:
- editable title tags, meta descriptions and URLs for your pages
- editable ALT tags for all images, customizable image file names
- automatically generated sitemap.xml and robots.txt files
- automatically generated canonical URL tags (to prevent duplicate content).
The basics of an HTML page
HTML is the language a web page is written in. It’s all under the hood, especially if you have a WordPress, Wix or Shopify website, so you don’t need to worry about knowing HTML, but it’s good to have a basic idea.
We’ll be inserting text in both the <head> tag part of the HTML page and the <body> tag, where al the content of the page will go.
Meta tags are HTML tags which sit in the <head> part of the HTML page. Your website platforms will ask you for this information without you having to edit the HTML yourself.
The Keywords Meta Tag is deprecated. Google has announced in 2009 it’s not using this meta tag as a criteria for ranking.
You will be using your Keywords across the page and in a few places:
- the <title> tag – it’s the official title for your page – 60 characters max. Use your focus keyword and a combination of other keywords while still describing the page
- the <meta name=”description” content =”…description text…” /> – a summary of the content of your page, in plain english, keep to 150 around characters
Please note the description you provide in your meta description page is only a suggestion and Google’s Algorithm might pick a different paragraph in the preview of search results, according to what the algorithm thinks it’s the part of the page which matches the search terms more closely.
Also please note those info are unique for each page you have.
Headings (page titles)
These are not massive ranking factors for Crawlers, but they help them as well as visitors understanding the content of the page. Users will use to scan the page and find the information they need, meaning they are more likely to stay on the page if the information they are looking for is clearly displayed.
Make sure you use your focus keyword in your first headings mainly as well as the other headings, but don’t be unnatural or forced.
Content is KING
It’s now time to move onto the actual content of your page. I can’t stress enough how, no matter how much you might follow the advice given so far, it’s the content of your page which is going to make your SEO to be successful. Without good content there’s no good SEO.
In an ideal SEO world, your website needs to be packed with useful content. So embrace the long tail keywords and start exploring as many themes and angles around your product.
In the example of jewellery, like in my case, if you offer necklaces on a cord instead or as well as on a chain, an angle you could cover is for example “Allergy free necklace“. This is never going to be the main focus representing your brand, but it’s a long tail keyword you could write articles about, describing the materials of your cord, where you source them, the benefits, add testimonials, quotes, etc. Remember, the more content the better!
If you have videos on your website, add a transcript, remember, Crawlers read text!
Write new content frequently, update old pages.
Avoid using sliders, they occupy space on your page and only 1% of visitors actually click on them.
Add many internal links, offer the users more avenues to explore your website, keep them on your website (avoid high bounce rate: them arriving on your website and leaving it immediately without browsing further).
When creating a new page make sure the URL of the page uses your focus keyword and a few other descriptive words or keywords.
If you migrate website platform, invest in content migration. If you don’t migrate the pages and keep them under the same URL as they were, you will loose all the ranking that those pages have gained so far.
When uploading an image there are a few very important SEO techniques you can apply. The smaller the image size, the quicker it will load, the quicker your page will load. But we’ll cover page speed later.
Pick a meaningful name for your file before you upload it. Use dash-separated words and use your focus keyword for example kodes-geometric-necklace-PRODUCTID-on-a-model.jpg.
Resize your image to the size it will be displayed as on your website. If it’s a photo used in a 200x200px square, save the photo to be exactly that size.
Or if you’re not sure, keep the file size to around 70kb in file size For actual dimensions, for a product photo you could try and resize it to be 800×600 in width and height, unless you are suing it for a hero/header image or it needs to be zoomed on.
Give your image a meaningful but concise description in the alt and title attribute (you’ll get asked for this information when uploading your image)
<img src=”http://my-website.com/image.jpg” alt=”A photo of my geometric necklace worn by a model” title=”A photo of my geometric necklace worn by a model” />
In Photoshop for example, when exporting for Web you will get this dialog. Reduce the quality to 70, make sure you pick JPG for the file format and “Convert to sRGB” so the image is optimised for screens, modify the Width and Height of the image as you please, while keeping an eye on the Expected File Size on the left hand bottom corner and on the visual quality of the image. Tweak the quality or the dimensions until you’re happy with a balance between the file size and the image quality.
Page speed counts in Ranking
A visitor waits up to 5 seconds on mobile while the page load, before moving on if the site is too slow and 3 seconds on desktop. So, ideally, this should be your aim for how quickly your website should load.
Google has announced speed of a page on mobile will become a ranking factor soon, so get ready! While speed of desktop pages has already been a ranking factor since 2010!
How can you check the speed of your website?
You can use a very useful online tool by Google, who more could you trust? https://developers.google.com/speed/pagespeed/insights/
The tool will asses your website and also show you a list of the things you are doing right and the ones you could improve on, plus resources to fix each issue you might have.
How can you improve the speed of your website?
The list is very technical (apart from couple of items you can take care of yourself:
- Smaller size & optimised images
- Prioritise visible content
These are most likely out of your hands, but you can pass this list on to a developer who could help at least on some of these and follow progress using the tool and assessing the page again to see how she gets on with the changes.
- Less HTTP requests
- Use CND
Each image or script file which your website will be LOADED on the page when a visitor comes to your page. The more requests, the slowest the loading will be. It is possible to therefore combine some of the requests
- Images Lazy Loading
This technique refers to the fact that you can set your website to only load the images which are visible in the available part of the screen. Any images positioned below, will only be loaded once the user scrolls to them. Remember: less file requests => quicker website => users stays & better ranking
- Set an expiry date or a maximum age in the HTTP headers for static resources
Caching means “remembering”: you can set your website to ask the visitor’s computer to remember the website status on their first visit and (if not too old, see expiry date) show them the cached version on the next visits. This means the page will be loaded quicker.
- Put JS just before the end of <body>
- Reduce or avoid Render-Blocking JS
- Create an AMP page (Accelerated Mobile Pages)
These are a summarised smaller version of your landing page. This is something you will need to ask a developer to make for you. We suspect Google will use them as ranking factor, so it’s something to bear in mind.
Structured data is extra data you can add to your website which google will display as part of the search results snippets, turning them into a rich snippet.
They will make your page stand out from other results, get more traffic and therefore improve ranking.
Structured data is another technical thing to implement on your website, but easy enough for any developer to implement, just forward the below resources to your developer.