Technical SEO: a specialism in its own right
Web developers are often not sufficiently aware of SEO guidelines. We particularly find that front-end developers tend to add a lot of […]
Web developers are often not sufficiently aware of SEO guidelines. We particularly find front-end developers adding too many JavaScript and CSS files that are far too large. Not to mention images. Back-end developers are not off the hook either when it comes to neglecting caching and hosting performance. Technical SEO encompasses the full scope of web design, and thanks to our efforts, agencies are improving the quality of their websites.
Optimise images automatically
On 95% of websites, we find that images are poorly optimised. You cannot expect a client to take every detail into account, so the web developer must address this. When an image is uploaded, it must automatically be saved in multiple versions. The HTML code must display images in fixed sizes. Even with a responsive web design, there are solutions for this in the form of a <picture> tag. The browser then selects the relevant image itself, which makes a huge difference to loading times.
Setting up lazy loading
By default, when you open a web page, everything is loaded in sequence. With lazy loading, an image is only loaded when you scroll to that part of the web page. Simply add the attribute `loading=lazy` to each image and you’re all set. Attractive web designs often feature lots of images, so this technique helps you achieve fast loading times.
Bundling, minifying and caching CSS and JS
When you open the source files, you’ll often see a whole list of .css and .js files. When a web page is loaded, all of these files have to be opened one by one. Optimise this step by combining all .css files, minifying them (removing unnecessary whitespace and lines) and then caching them (in the web server’s temporary memory). Apply the same process to .js files. Instead of loading dozens of files, you limit it to two larger files. Caching these optimised files in the temporary memory saves a lot of time.
DNS prefetching and preloading
When opening a web page, the browser wants to know in advance which (larger) files will be loaded. This applies to images, CSS, scripts, fonts, external files, etc. By placing the DNS prefetch and preload directives as high as possible in the source code (the <head>), the browser is given the opportunity to load those files in advance. The sooner this happens, the better it is for performance.
Use hyperlinks sparingly
Everyone seems to think that a large menu is user-friendly. ‘Think again!’ According to Google, a web page should have no more than 150 hyperlinks. If you have a large drop-down menu and a large number of links in the footer, you’ll have very few options left for hyperlinks within the text. Text blocks in overviews are also often structured incorrectly. There’s a hyperlink on the title, the image and the ‘read more’ link. You can easily fix this by placing a single hyperlink around the entire block for each item and giving it a ‘title’ attribute with the item’s title. An average list contains 10 articles, so do the maths and see the benefits for yourself.
Fill in ALT text by default
As a rule, you should provide ALT text for each image. The client is often just happy that an image has appeared alongside the article, let alone that each image needs to have its own alternative text. ALT text provides Google with more background information about the image in relation to the content.
Adding structured data
Search engines index web pages and then analyse them. For years, search engines had to interpret everything themselves. With structured data, that is now a thing of the past. You can now specify exactly what type of information is being used and how the different elements relate to one another. Proper implementation of structured data enables rich snippets. A rich snippet is a search result on Google that includes an image, the number of reviews, or prices and stock levels. This helps to boost zero-click results.
We analyse websites and work with the developer(s) to optimise technical SEO. A solid technical foundation is essential. No matter how well your content is optimised or how many backlinks you have, it’s of little use without good technical SEO. That’s why you should call on SEO Ninja.