This was originally published as a tweet thread here:
About Performance and SEO
Today I wanted to talk about website performance and SEO. By performance, I'm talking about speed, how fast is your site and what can you do if it's slow? #SEOThings #DigitalMarketing
Here's a disclaimer: not every site is the same, so not everything will apply to your situation and there may be things that you have that aren't covered here, that's pretty normal, websites are complex creatures. This is where to start.
1. Website performance is important. That's a given.
Users expect a fast loading site and for mobile it's even more important. Slow loading sites lose, Amazon found that for every additional second, they lost sales. Time literally is money, even if your website doesn't sell something directly.
1.5 Google uses performance
As a ranking factor. It matters to Google, so a faster site is good from both a user standpoint and a getting traffic from Google standpoint.
2.0 Testing your site
Many tools exist for this. Here's a few:
WebPageTest https://www.webpagetest.org/
Pagespeed Insights https://developers.google.com/speed/pagespeed/insights/
Think with Google https://testmysite.thinkwithgoogle.com/
GTmetrix https://gtmetrix.com/
My favorite is WebPageTest but I've used all of them for different reasons.
2.25 Tools
Pagespeed Insights has a pretty report you can toggle between mobile and desktop.
Think with Google comes from a mobile perspective. It wasn't working for me today.
WebPageTest and GTmetrix will give you more in-depth, nitty gritty technical details to dive deep.
2.5 The tools mentioned measure and compare things
In different ways but all of them will have recommendations that line up, more or less. This can help prioritize what to fix first.
2.75 Now you've got a test result, now what?
This result is a snapshot in time, so you might want to run several tests to get a feel for your site's response. Now you've got a result, so it's about looking into your particular trouble areas.
3.0 Common Culprits
Here are some of the most common problem areas for sites, and what they mean in English.
4.0 Long time to first byte
The amount of time it takes for your web server to respond to the first request for your page. Your browser says, “hey give me this page”. Time to first byte is how long it takes for your browser to see the first byte of data or “here's the page”. Also called TTFB.
4.25 This should be under 500ms or so.
Yes that's less than half a second. See over a second or two, (or more, oh no!) then you'll want to run several tests to see if this is a one time thing or a real issue. WebPageTest can be set to run several at one time.
4.5 Two seconds is ages in server response time.
If you have a consistently long TTFB, this can indicate a hosting problem, it's often seen with cheap hosts. It could also be a DNS issue, which depending on who you use for hosting or how you're set up, it might still be your host.
4.75 If your host doesn't have anything good to say,
Then it might be time to consider upgrading your hosting situation. Some hosts will offer to move you to a different server, but sometimes you need a whole new hosting company.
5. Compress transfer
This means gzip, where your web server compresses things like html and sends the compressed result to your browser which ‘unzips' it to display. Compressing makes the data size smaller and thus faster. Modern browsers do this but not all web servers have it enabled.
6. Browser Caching
Your web server can send caching information to the browser. This lets the browser use the copy of your logo it's already downloaded, instead of having to re-download that resource every time. This applies to things like images, javascript, css, etc. Easy to enable.
7. Optimize Images
This is one of the biggest issues I see. It happens when people upload images to their website, without resizing them or optimizing them first. Example: a thumbnail image that displays at 150×150 pixels on the page but is actually using a huge 3MB 2,000 pixel wide image.
7.25 Scale and resize your images
to be as close as you can to their intended use before uploading them. This is the first step to getting images to have smaller file sizes. Just add this step to your workflow, it's quick and makes a big difference, especially on image heavy sites.
7.5 Use a tool to compress your images.
Resources like: https://tinypng.com/ https://tinyjpg.com/ https://kraken.io/web-interface are all online and can help you get smaller file sizes without sacrificing quality.
7.75 Use the right type of image for the job
Use jpg for photographic images and png for graphical or text based images. The visual quality of the images will be better and they'll have the smallest file sizes possible. Icons and logos can even be .svg which can be tiny files.
8. Minify all the things
Minify your css and javascript. This removes extra whitespace from the files, making them smaller and faster to load. You can also sometimes combine multiple css or javascript into one file – this reduces the number of requests to the server, making things load faster.
9. Look at the overall number of requests
Are your pages loading things that aren't used? Got tracking scripts you don't recognize the purpose of? Images loading that aren't displayed?
9.25 Fonts
Web fonts, do you use them? These can slow things down, if you're using too many fonts in general, or if you're loading many different weights and styles you're not using, your site can slow down. Google Fonts gives you an indication of impact on load time.
9.5 Video
Does your video load in the background even if it's not played? Don't. Video shouldn't load until the user requests it by clicking. Use a service like YouTube to handle the embed/streaming. Doing video backgrounds and have to have them (really?), optimize the heck out of 'em.
10. Keep at it.
Periodically review your site's performance, even if you've done all the best practices. Websites aren't set in stone, and change overtime. Rolling audits are one way to stay on top of issues like this, so they can be fixed before they have impact.
I hope this Performance and Speed thread helped you get moving in the right direction.
#SEOThings #DigitalMarketing