How We Do WordPress Website Speed Optimization: Achieve Scores 100 Desktop, 97 Mobile on Google PageSpeed Insights (No Plugins)
Practical website speed optimization tips and tricks.
We employ proven strategies to optimize the loading speed of our clients’ WordPress websites, without the need for a single plugin, and we draw insights from our clients’ successes.
As Google makes website speed a major factor in ranking, entrepreneurs and website owners start focusing on optimizing website speed so that they get high rank in SERPs. So one of our clients also approached us to optimize his website speed, which was very poor at the time.
We started by studying his website. After some research and study, our team of expert web designers, developers, and marketers came up with a plan to improve the website’s loading speed.
We write down the changes, updates, and optimizations we are going to make, as well as some changes that we did not discuss before to improve loading page speed.
Without taking more time, here is the process we follow to achieve 99 desktop scores and 97 mobile scores on Google PageSpeed Insights. Check report here: GL Google PageSpeed Insights Report
Image: GL Google PageSpeed Insights Report
Processes We Followed and Tricks We Used to Optimize Website Loading Speed
#1 Pick a Speedy and Dependable Hosting Provider
Starting off, we changed to a different hosting provider than previously used by client. Quick loading is key for any website, so a solid hosting server is a must. Think about going with a reputable provider. WP Engine, CloudWays, SiteGround, or Bluehost are options.
We opted for WP Engine for our customer. A managed WordPress hosting could be the answer for peak performance.
Discuss Your Web Redesign Project Free Today!
#2 Use a Lightweight Theme
The second important step is to choose a lightweight theme, customize the theme completely, or start building a custom website. We suggest you choose the theme even if you want custom website design because themes come with basic configuration files, so you don’t need to create basic settings and configuration files.
We chose the Astra because it’s very light, and we customized it completely with custom elements as per our client’s requirements.
#3 Optimize Images
We’re shrinking all pictures, but not their quality. Compress your images using tools like TinyPNG before they go on your site. Pick the right format for your pictures (JPEG for snapshots, PNG for colorful graphics), and remember to think about using webp format.
#4 Minimize HTTP Requests
We optimize HTTP requests by merging files, using CSS sprites, and minimizing files.
Combine CSS and JavaScript files.
Use tools like Autoptimize to minify and combine files.
#5 Use a Content Delivery Network (CDN)
Implement a CDN, such as Cloudflare or MaxCDN, to serve static content from servers closer to your users’ locations.
#6 Use Async or Await
If there are elements that you want to load first and close, don’t forget the use of async and look forward to it. These functions prioritize what masses first by way of letting you highlight the crucial parts, along with the primary content. When you operate async and anticipate to wrap these essential elements’ loading process, you may make sure they will appear earlier than something else.
#7 Load scripts after complete page loaded
We suggest you don’t load too many scripts on the first try. Our client’s website uses script-generated animation in the hero section; we use images to first show the effect and load the script after the complete page is loaded.
#8 Don’t load sliders or any animation on the first page load
The client website has a slider section; we load it as a simple section at first, and after the entire page is loaded, we activate it with the help of some scripts.
#9 Reduce the shifting of elements to keep CLS under control
We reduce the shifting of the HTML elements; for example, if a section height is 100 pixels in theme CSS and you want it to be 60 pixels, then you should load the first your custom CSS before the theme CSS files. This keeps CLS under control.
#10 Use loaders
We use loaders for images and graphics, so the loader first loads, and the image appears after it. When you use loaders for search engines do not count them as graphics, this keeps the LCP low.
#11 Reduce Redirects
Minimize the use of redirects, as they create additional HTTP requests and delay page load times.
#12 Use a Fast and Secure DNS Provider
To reduce DNS lookup times, choose a fast DNS provider.
These are some of the techniques we used to achieve similar results for our client website, Goodman Lantern.
You can verify the page speed yourself and have faith in our efforts. If you also want to optimize your website’s loading speed, contact us today. Our team of expert web designers and developers will 100 percent help you.
Article originally posted on https://www.startdesigns.com/blog/wordpress-website-speed-optimization-no-plugins-used/