Technical search engine optimization (SEO) is a crucial component of content marketing. You could have the best content in the world, but if your website is structurally deficient, it could hurt your overall SEO performance and decrease the chance of people finding your website. Technical SEO addresses the issues that prevent your pages from getting crawled, interpreted and indexed correctly and efficiently.
Page speed is also considered a technical SEO issue. A slow loading webpage is one of the most common reasons users exit a webpage and return to a search results page.
Some technical issues require the help of a web developer, but there are a few ways that marketers (without assistance) can drastically improve the speed of a website. Implementing these six changes can help boost your website’s visibility on search engines and improve your online reputation.
6. Use a Content Delivery Network (CDN)
1. Minimize Redirects
Image: blog.catchpoint.com
Redirects happen when you insert a non-specific website address into a web browser. The browser will then do its best to find that exact resource for you, and will return the best match for your query.
For example, you try to connect to Brandpoint’s blog page by typing “https://brandpoint.com/blog/” into the browser bar. First, you’re redirected from HTTP to HTTPS. Then “www” is added. Then you’re redirected to the URL that includes “blog” in the path: “https://brandpoint.com/blog/”. Now, the server can send down website files and resources to your browser.
There are a number of redirects that may occur before you even arrive on a website, which adds latency (delays in processing data) to page load times. It doesn’t seem like much, milliseconds per request, but they pile up, and having too many redirects could cause a request to fail.
A user typically only notices the redirect process when it executes abnormally slowly — they might get stuck on a blank screen or the request could time out and an error window will appear because there were too many redirects to their requested resource.
However, there are times when redirects are necessary, such as:
- You’ve recently updated content and want to reroute traffic from the outdated content to the new content.
- You’ve changed the website’s permalink structure and need to redirect the old URLs to their new structure.
- You’re working on updating a previously published post or page and need a way to send traffic to a different page or post while you work on the update.
How can I fix redirect issues?
Your top-level domain (www.mywebsite.com) should resolve with no more than one redirect. All of these should resolve no matter what a visitor to your site throws in front of the domain:
- http://mywebsite.com
- http://www.mywebsite.com
- https://mywebsite.com
- https://www.mywebsite.com
Unfortunately, this might not magically solve your problem. In that case, you may need to access your web server to add URL rewrite rules to your .htaccess file (.htaccess is a configuration file for use on web servers running the Apache Web Server software).
You can create redirect rules that target any URL formulation that requires more than one redirection. For example, if the URL “http://mywebsite.com” requires two redirects to get to “https://www.mywebsite.com,” you can create a manual redirection that makes that happen in one step rather than two.
If this sounds intimidating, HubSpot and Yoast offer user-friendly tools that allow you to create redirects without having to dig into the code.
2. Minifcation
In web development, minfication is the process of making code more efficient by removing unnecessary data like whitespace or line breaks and condensing vital code without affecting how the code functions. For example:
I
Can
Write
A
Sentence
Like
This.
Or I can write a sentence like this.
It probably took you more time for you to read the first sentence than the second. Similarly, it takes a browser more time and effort to process a longer set of instructions.
Brandpoint.com’s “styles.css” (everything that controls our site styles — colors, fonts, sizes, positions, etc.) is 5,614 lines long with a lot of whitespace in between each style declaration. That’s a lot for a browser to process.
If you crunch it all into one line, though, a browser can process it much faster! One line, that’s all. Check out the screenshot below — on the left is how it looks regularly. I can read the code and write cleanly. On the right is a minified version of the same code. Look closely at the first line and you’ll see the same code (html { font-family: sans-serif; } … etc.) all pushed onto one line. It looks like a bunch of lines but if I had enough space to drag the window across the screen, it would all be on one line.
So, how do you actually minify the code? Well, you have to delete all 5,614 lines … just kidding. There are plenty of tools where you can just copy and paste the code, hit the “minify” button, and you have code that’s all on one line.
3. Image optimization
Image: advancedsourcecode.com
Media files like images and videos are at the top of the list of things that slow down a website, but fortunately, they’re also something you have the ability to improve yourself!
Optimizing your images removes unnecessary data saved within the image. This reduces the file size of the image, based on where it is being used in your website. Optimizing images for the web can reduce your total page load speed by up to 80 percent.
Image optimization should be part of every marketer’s content publishing process. Before you insert your final images into a publishing platform like WordPress, here are two things you can do to ensure those images are optimized and less likely to be detrimental to your page speed.
4. Image compression
To reduce the size of your image without sacrificing quality, you can use one of these two forms of compression:
- Lossy: Some data from the original file will be lost, and once you convert to lossy, you can’t revert those changes. The more a lossy image is compressed, the more data is lost. However, lossy compression results in a significantly reduced file size. JPEGs and GIFs are lossy image formats.
- Lossless: Images saved in lossless format retain all the information needed to produce the original image. This format is better for retaining the quality of images without sacrificing smaller file sizes. Lossless compression produces higher quality but larger file sizes than lossy. RAW, BMP, GIF and PNG are lossless image formats.
There are many resources for compressing images — too many to count. Many of these services offer both lossy and lossless compression and allow you to set the compression levels for your original image files. Pick one and go for it! If you leave images uncompressed and in the wrong format, it can contribute to web page load times, which will have a negative user experience.
Image Dimensions
Resizing the image on the webpage itself is helpful, but the issue is that the web browser will still download the entire original file, then resize it and display it.
Imagine you have a wall-poster-sized image and are shrinking it down to use it as a postage stamp. That tiny postage-stamp-sized image takes just as long to load as the original giant poster-sized image. By resizing it (using a program as simple as Paint or Photoshop), you could load the postage-stamp image in a fraction of the time. This is useful for images that are being used as logos, icons or thumbnails in blog posts and web pages.
Whether compressing or resizing the image, this image optimization process should be part of your content publishing routine. That way you prevent the need to go back and optimize images for hundreds of pieces of content (or more).
5. Browser caching
Image: ilian.io
Internet browsers use a cache. Just like a raven keeps a cache of shiny things it finds like can tabs, jewelry and coins, your browser keeps a similar cache of files and images (among other things). This way, the browser doesn’t have to load every aspect of a page each time you visit a website. Can you imagine if Facebook or Twitter had to load everything it contains every single time you went to their websites? It would take forever — sites like those are massive in the eyes of the web.
Giant requests take a toll on servers and browsers, so caches store things we can see like fonts, images, personalized settings, videos, and things web developers like me deal with such as libraries and frameworks for programming languages.
Some pages might only consist of a few files and be small in size — maybe only a couple of kilobytes. But for others, there may be a lot of files, and these may add up to several megabytes. According to GTmetrix, this issue is twofold:
1. These large files take longer to load and can be especially painful if you’re on a slow internet connection (or a mobile device).
2. Each file makes a separate request to the server. The more requests your server gets simultaneously, the more work it needs to do, only further reducing your page speed.
Browser caching reduces the load on your web server, which ultimately reduces the load time for your users. This is done by storing some of these files locally in the user’s browser.
A user’s first visit to your site will take the same time to load; however, when that user revisits your website, refreshes the page or moves to a different page of your site, they already have some of the files they need locally.
This means the amount of data the user’s browser has to download is less, and fewer requests need to be made to your server. Ultimately, this leads to a decreased page load time.
To improve your browser caching, you’ll have to have access to your web server and modify code that sets expiration times for your cache. You can even set which types of files (.css, .js, .png, .jpg, .pdf, etc.) expire at different times since some content may be updated at shorter intervals and you will want your visitors to be able to access that content as soon as you deliver it.
6. Use a Content Delivery Network (CDN)
Image: maartenballiauw.be
Think of a CDN like the Amazon distribution centers. Before Amazon had centers in every major city in the world, you would have to wait weeks for your packages to arrive; every once in a while, you still do because the shipping center is in China or India. A Content Delivery Network is a network of servers geographically distributed across the country or world. It serves a variety of web and downloadable objects, applications, live streaming media and social networks.
For example, if someone in California visits your website, you don’t want the closest server to be in New York because that request has to travel across the country, and the return trip with the requested files or resources will delay page load times.
However, if the website is using a CDN and has a server location in California, it will quickly improve that experience by providing a local instance of your website files and resources. The visitor doesn’t have to wait for the server to send it all the way across the country or the world; it’s available nearby and can be loaded much more efficiently.
Speed wins
By identifying and making the above repairs, you can provide your clients and prospects with a responsive and painless website. This then sends a signal to search engines that your website is a fast, reliable resource that should appear higher on returned search results.
