How to Speed Up Your Site
With Google’s most recent changes to mobile friendly sites, many of our users have asked if Flothemes are mobile friendly. Thankfully, our themes are not only fully responsive, but pass Google’s Mobile Friendly test with flying colors. For more on this topic, you can view our blog’s full write-up on the subject here.
While “mobile friendly” is important, getting your site “mobile optimized” is the real objective.
We have put together a helpful guide related to speeding up your site, just for our users. It is no surprise that Google will now be taking into account the speed of your site, as now they are focusing their ranking on user experience. This article will cover some useful tips on how to make sure your site stays up to speed and ranks high in Google’s PageSpeed Insights.
Google’s PageSpeed Insights
Google PageSpeed Insights measures the performance of your site, both on desktop and mobile. You can read more about it here in Google’s documentation. It scores out of 100, with 85+ being very good. Getting this score on a Mobile device is nearly impossible with large images and heavier content. Therefore, aiming for a speed score of around 70 is be more realistic. Just be sure your user experience score for Mobile is “green” (85+). Scores can be viewed at the very bottom of the Page “Speed Insights.” You can read more on the mobile analysis here.
After you run a speed test, you will be shown your test results as well as suggestions for changes that you should make.
Then for the desktop version:
Every user will have different results based on content, the plug-ins available, and the optimizations that have been made.
As you can see above, the desktop version received a better score than on mobile. Hopefully, using the “Should Fix” suggestions will solve any problems you encounter. Please note that there may be some issues that are just not possible to remove. For example, Google Fonts are a spread problem that there seems to be no solution for as of yet. The aim here is to get as many items out of the “Should Fix” area as possible as this affects the your score the most.
Hosting
This is an area many users ignore when it comes to their business. However, hosting is one of the most important investments for your business when it comes to creating your online presence. Hosting equals speed. And a faster speed equals a positive user experience.
Here’s a link that includes our top recommendations for hosting providers.
Compress your Site
Compressing your site means reducing the number of bytes needed to load a page and is very important for mobile since your phone does not have the same bandwidth as a desktop computer.
Our recommendation to compress your site is to use WP Performance Score Booster. This will allow for GZip compression, leverage browser caching, and remove any queries from static resources. Depending on your site, this can increase your score by quite a few points.
While there are other options available, from our experience, this plug-in alone boosts your score the most and can bring your site one step closer to the desired green Google rating.
Minify JavaScript and CSS
Similar to site compression, there are several plug-ins that can help reduce the size of your JavaScript and CSS files, thus increasing loading time.
We recommend trying one of the following:
We recommend you activate and test the plug-in while in the process of improving your site, as sometimes plug-ins will actually decrease the speed (this was the case for us at times while testing, however some users have seen increased speed scores).
Leverage Browser Caching
Installing a plugin such as WP Super Cache is a great way to improve loading time. However, it is recommended that you follow a tutorial on how to set this up correctly as a wrongly configured caching plug-in can cause more issues than good. When testing your site for speed, it is best to clear the cache, refresh your page a few times, and retest every time you make any change.
Image Optimization
Image sizing and optimization is one of the most important items that you should consider when adding images to the web and is probably the reason many users are getting a low score on Mobile devices. The smaller the images in KB, the less data is needed, thus increasing loading times. You can view our recommended image sizes and how to optimize your images for web here.
There are a few plug-ins that can also assist with optimization of images, however most of the optimization should be completed before uploading your content on the web. The following plug-ins may assist:
Some testing with these plug-ins does show a slight improvement in sizing. However, Google will often still ask for the images to be reduced in size. Unfortunately for photographers, this is unlikely to be an option. So take time to optimize any images before uploading, and be aware that Google will still ask for a reduction in size regardless.
Using a Content Delivery Network (CDN)
A CDN, or Content Delivery Network, stores your static content to different locations on the web so that they are closer to your users. For example, it allows a user in the U.S. to successfully load content that may be originally stored in the UK. Because of this, the user is now able to receive the source directly from a server in the U.S.
You can learn more about CDNs here.
Users should also be aware that a CDN must be set up correctly so that SEO is not affected.
Turn off Pingbacks and Trackbacks
WordPress by default enables “pingbacks” and “trackbacks.” This enables your site to interact with other sites, by linking your pages and posts.
A great post explaining this further can be read here.
To turn off pingbacks and trackbacks is relatively simple, if you go to settings > discussion > “default article settings”, deselect the option “allow link notifications from other blogs” as shown below:
Other Suggestions
- Don’t show full posts on the blog page and always use the excerpt option when available. If you’re going to show full posts, keep them to a minimum per page, i.e. 2-3 items.
- Don’t post a large amount of images on blog posts. More images means more loading time. While it may seem like a great idea to put 100 images in a post, it can slow down your overall site performance and ruin the user experience.
- Keep your site minimal. Sometimes less is more and in this case it has never been more true.
Got a social sharing plug-in? On mobiles these can reduce loading time, as they have to load a resource for each networking platform.
Our Top Tips
- Caching. Cache your site, this will improve loading times immensely, as this will mean your resources are closer to the user. If possible, invest in a CDN and get it set up correctly so SEO is not affected.
- Image Optimization. Look at our tutorial on how to optimize images for web. Try to keep them around 300-400kb.
- Minify. Minify your CSS and JS. Having them minified means less loading time and will improve your Google Score.
- Be wary of plug-ins. Remove unnecessary plug-ins and always test new plug-ins to see if it affects your site loading times.
Remember a score of 70+ is very good for mobile and you will want a score of 85+ for desktop. There are a number of factors why you will may not score higher, but as long as you get the green from Google, your site will perform correctly for your users.