Background
Search engine optimization (SEO) seems to be making a comeback these days. In recent months, I have noticed people perk up the moment I mention that my team and I are experts in it. To many, it means that they will show up when people “Google them”.
While the general public has one idea of SEO and how it can improve their online presence, any time I mention the term to other marketers or programmers, they cringe a little. The usual question I get right away is “what do you mean by SEO?”.
This is warranted given SEO’s shaky history among the tech community. It’s always a client’s number one concern and it’s almost impossible to promise since it’s like promising a sunny day for your wedding. There are too many factors to take into account and it’s a nuanced conversation about strategy and marketing, not the “yes” or “no” clients want to hear.
Instead, the type of “SEO” I’m generally referring to is more of a technical checklist. Google has best practices and tools they use for testing sites. The more checkboxes you hit, the more “points” you get from Google and the higher your ranking tends to be. What we try and do here at Drive is hit as many checkboxes as permitted (usually constrained by time and budget).
So what I’ve done is quickly compiled 3 items that I often see overlooked. These items were chosen because they are quick points with relatively high impact (given how little work is involved in implementation).
The Good Stuff
So what are these three magical things I can do to improve my site’s ranking?
Simply put:
1. Install an SSL certificate
2. Enable browser caching
3. Enable compression
And there you have it! 3 things, just like I promised : )
The Good Stuff: Explained
So how do you implement these things? Well, if you’re completely new to web development or have no background in programming, these tasks are going to seem daunting. If you’re an experienced web developer, you probably scrolled down, saw the list and said to yourself “pffft, I already did that, what am I, an idiot?”
If you’re somewhere in-between, these items are not difficult to implement and are often overlooked when launching a new project because they are small details that are less important than “getting the site working”. Strictly speaking, not having any of these details implemented will not break anything, but you will be missing out on some easy points from Google.
Getting a Little More Technical
Prerequisites:
- Linux Apache server
- Access to web server (ideally cPanel)
- Access to edit .htaccess
- Unique IP address for your server
If you have the above items, you should be all set. Let’s tackle one item at a time.
1. SSL Certificate:
This is by far the easiest one. Most web hosting companies will have tech support that you can speak to (over the phone or via chat). If you simply ask them to install an SSL certificate onto your server, they will give you a price and just do it for you.
IF you want to buy the certificate yourself, you have a list of vendors to choose from (I personally like namecheap.com) but you will have to use cPanel to install the certificate yourself. This is a little trickier since you have to generate a request from your server, then do some copy and paste between cPanel and the SSL vendor. I would only recommend this option if you already know how to manage your server and are comfortable following some technical instructions.
For a free certificate, you can always use Let’s Encrypt (https://letsencrypt.org/). This is a free certificate, offered from a recognized non-profit with a mission to improve web infrastructure. Over the last few years, their services has slowly started to dominate the web and is now (as of Jan 2018) serving close to 50 million active certificates.
The catch here is that it takes a lot of technical expertise to properly set up Let’s Encrypt. If you want more details, check out my article on “How to Install a Free SSL Certificate Without Shell Access” (https://drivemarketing.ca/en/blog/how-to-install-a-free-ssl-certificate-let-s-encrypt-without-shellaccess/).
2. Enable Browser Caching:
This sounds complicated but it’s actually pretty easy to explain. When you load a webpage, you are loading files that tell the browser how to paint the page. Some of these files are used repeatedly throughout the site. When you “enable caching”, what you do is tell your visitor’s browser that they only need to download certain files once, not for every page they visit. The result is that you speed up your page’s loading times. This, in turn, helps with your overall ranking with Google.
The things is that it’s actually fairly straight forward to implement. All you have to do is add some code to your .htaccess file (usually found on your website’s root directory) to tell the server to send these instructions to your visitor’s browsers. You want to list any kind of file that should be cached. The standard extensions to include are: .css, .js, .jpg, .jpeg, .gif, .png, .svg.
Depending on the version of Apache you’re running, you will use one of the two variations below:
Variation 1:
## CACHING ##
ExpiresActive On
ExpiresByType image/jpg "access 1 month"
ExpiresByType image/jpeg "access 1 month"
ExpiresByType image/gif "access 1 month"
ExpiresByType image/png "access 1 month"
ExpiresByType text/css "access 1 month"
ExpiresByType text/x-javascript "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresDefault "access 1 month"
## CACHING ##
Variation 2:
## CACHING ##
Header add "Cache-Control" "max-age=604800"
Header add "Cache-Control" "max-age=604800"
Header add "Cache-Control" "max-age=604800"
Header add "Cache-Control" "max-age=604800"
Header add "Cache-Control" "max-age=604800"
Header add "Cache-Control" "max-age=604800"
## CACHING ##
I would recommend trying the first one, first. IF it doesn’t work, remove the code and try the second one. How do you know if it’s working or not? Use https://tools.pingdom.com/ to run a quick test.
3. Enable Compression
Again, when loading a website, you are downloading files from the server. You want to have your visitors download as little as possible so that the site loads faster.
One way to do this is to remove unnecessary information from your files. Removing spaces and tabs and renaming variables into short, nonsensical letters, makes the code pretty much impossible for a programmer to read, but will cut down on the file size being sent to the browser. This is essentially compression.
For images, there are other mathematical algorithms that cut down the file size (to be honest, I don’t really know the details of how they work). The takeaway is that images too can be reduced in size.
The server can be told to compress files before sending them out. It’s usually not on by default as it can eat up other resources if left unchecked. So you have to tell the server to implement this option. How?
Again, we go back to editing the .htaccess file to achieve this. The files we want to compress are scripts, fonts, images … pretty much anything and everything possible.
Depending on the version of Apache you’re running, you will use one of the two variations below:
Variation 1:
## COMPRESSION ##
# Compress HTML, CSS, JavaScript, Text, XML and fonts
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
AddOutputFilterByType DEFLATE application/x-font
AddOutputFilterByType DEFLATE application/x-font-opentype
AddOutputFilterByType DEFLATE application/x-font-otf
AddOutputFilterByType DEFLATE application/x-font-truetype
AddOutputFilterByType DEFLATE application/x-font-ttf
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE font/opentype
AddOutputFilterByType DEFLATE font/otf
AddOutputFilterByType DEFLATE font/ttf
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE image/x-icon
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/xml
# Remove browser bugs (only needed for really old browsers)
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
Header append Vary User-Agent
Variation 2:
## COMPRESSION ##
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file .(html?|txt|css|js|php|pl)$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include mime ^text/.*
mod_gzip_item_include mime ^application/x-javascript.*
mod_gzip_item_exclude mime ^image/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
## COMPRESSION ##
Just like with caching, I would recommend trying the first one, first. IF it doesn’t work, remove the code and try the second one. How do you know if it’s working or not? Use https://tools.pingdom.com/ to run a quick test.
Conclusion
Even if you’re not going to implement this yourself, you should ask your development team to take a look at these items. Though it looks intimidating, most web developers with minimal experience should be able to implement these simple changes.
These 3 items on their own won’t lead to a huge boost in rankings, but it’s a point system and these are low-hanging fruit compared to a lot of the other work involved in SEOing a site.
To all my technical friends out there … sorry for using “SEO” in a blog post :P