How to Improve Website Speed: 18 Practical Steps

To improve website speed, compress and resize images, ship less JavaScript and CSS, use caching and a CDN, and fix slow server response. Aim for Google’s Core Web Vitals targets: LCP within 2.5 seconds, INP of 200 ms or less and CLS of 0.1 or less.

Measure first with the Core Web Vitals Checker, then work through the steps below in order of impact.

What Is Website Speed Optimization?

Web speed optimization is all about making a website load faster. When people click on a site, they want a responsive website that opens quickly without waiting.

A fast website keeps people on your site longer and makes it SEO-friendly, although speed alone does not guarantee higher rankings.

18 Steps To Improve Website Speed

Google’s algorithm updates regularly, and page experience is only one input among many. A sitemap helps Google find your pages but does not make them load faster. Work through the steps below, starting with images and scripts, which usually matter most.

Measure first: the Core Web Vitals Checker shows which of LCP, INP and CLS fails on your page, so you fix the right thing.

1:1 Optimize Images

Per the 2024 Web Almanac, 73% of mobile pages have an image as their largest element, so images are the first thing to fix. Well-optimized images load faster, use less bandwidth and improve the overall user experience. 

How To Make Web Pages Load Faster By Optimizing Images:

Use Appropriate Dimensions

Make sure to use the correct image dimensions for your design. For example, if your website displays images at 800×600 pixels, avoid uploading oversized files like 4000×3000 pixels.

Compress Images

Compress your images to reduce file size without losing much quality. There are two types of compression: lossless, which keeps all image data and slightly reduces file size, and lossy, which removes some data for a bigger size reduction but still looks good.

Use Next-Gen Formats

Switch to modern image formats like WebP and AVIF instead of traditional ones like JPEG and PNG. Both usually produce smaller files than JPEG or PNG at similar quality. Check browser support for your audience and keep a JPEG fallback if you need one.

Lazy Loading

Lazy loading makes images load only when users scroll near them. For example, images farther down a webpage won’t load until the user gets close to them. This reduces initial load time and saves data for users who do not scroll down. Do not lazy-load your main (LCP) image: web.dev recommends removing loading=”lazy” from it and adding fetchpriority=”high”.

1:2 Minify And Combine Files

Minification removes extra spaces, line breaks, and unnecessary comments from your website’s code. This makes the files smaller and faster to load.

How To Minify & Combine Files

CSS/JavaScript/HTML Minification

Minify your CSS, JavaScript, and HTML by cleaning up unnecessary parts of the code. You can use tools like Minify, Terser, or HTMLMinifier to make the process quick and efficient.

Combine Files

Combining CSS and JavaScript files cuts the number of requests, but it matters less on HTTP/2 and HTTP/3 (see below). Do it only where your build tool makes it easy.

Leverage HTTP/2

If your server supports HTTP/2, you don’t need to combine files as much. HTTP/2 lets multiple files load simultaneously, making your site faster even if the files are separate.

1:3 Implement Browser Caching

Browser caching will make your website faster by saving essential files on the visitor’s device, like pictures, styles, or scripts. This way, when they revisit your site or go to a new page, their browser will show these files, and you don’t need to download them again from your server.

How To Implement:

Set Expiry Dates

It commands how long it can store files like images or scripts before checking if they need updates. This step will help with page speed optimization because the browser doesn’t have to download the duplicate files repeatedly.

Cache Static Content

You need to set up a rule in your server’s configuration file (like htaccess for Apache or the Nginx config) to command browsers to save static files like images, CSS, and JavaScript.

Optimize Cache-Control

Use settings like max-age to define how long browsers should keep content and public to allow shared caching.

Test Your Settings

You can use tools like Google PageSpeed Insights or GTmetrix to see if your caching rules are working properly or not. Then, find ways to improve your site’s performance.

1:4 Use a Content Delivery Network (CDN)

A Content Delivery Network (CDN) will increase page speed and make it faster by storing copies of your files (like images, videos, and scripts) on servers around the world. When someone visits your site, the CDN will deliver the content from the server that are closest to them.

How To Do It:

Choose A CDN Provider

Select a Content Delivery Network (CDN) like Cloudflare, Akamai, or Amazon CloudFront to distribute your website around the world.

Sign Up And Set Up An Account

Now, visit the website of your chosen CDN provider and create an account by following the setup steps they provide.

Link Your Website To The CDN

At this stage, you need to update your website’s DNS settings so that traffic can be directed through the CDN.

Upload Your Content To The CDN

The CDN then fetches and caches copies of your files automatically.

1:4 Reduce HTTP Requests

Every time someone visits your website, their browser asks your server for various files, such as CSS, JavaScript, images, and fonts. If there are many files, it can slow down the website.

Combine Files

Fewer, larger files mean fewer requests, but on HTTP/2 or HTTP/3 the gain is small. Focus on removing files you do not need rather than merging everything.

Use CSS Sprites

If your website has many small images (like icons), you can combine them into one large image. You can use CSS to display only the specific part of the image you need.

Inline Critical CSS

Add CSS for the most important parts of your page to show the content users see first and then directly in the HTML.

1:5 Enable Gzip Compression

Gzip compression reduces the size of files like HTML, CSS, JavaScript, and other text-based content before sending them to the browser. You can enable it on your server using configuration tools like Apache or Nginx.

How To Do It

Turn It On in Your Server Settings

Enable Gzip compression in your server settings (like Apache or Nginx). Most hosting providers make this easy to set up.

Choose The Right Files

You need to use Gzip to compress text-based files like HTML, CSS, JavaScript, and similar content. You should avoid compressing images and videos with Gzip because they are already optimized differently.

1:6 Reduce Server Response Time

Time to First Byte (TTFB), the delay before the first byte arrives, feeds directly into LCP. web.dev lists using a CDN as one of the most effective ways to improve TTFB.

Choose Better Hosting

You should switch to better hosting, such as a VPS (Virtual Private Server), dedicated server, or managed hosting.

Optimize Server Settings

To improve your server’s performance, you need to enable HTTP/2 for faster data transfers. Moreover, a quicker database engine like InnoDB and tweaking your server settings should handle visitors more efficiently.

Clean Up Your Database

You need to keep your database clean by removing old or unused data, optimizing the tables regularly, and cutting down on unnecessary queries.

1:7 Optimize Website Code

How To Optimize It?

Remove Unused Code

Go through your code regularly to find and remove any unnecessary CSS, JavaScript, or other unused elements.

Defer Non-Essential Scripts

Now, use the “defer” or “async” attributes for JavaScript files. This step will prevent them from blocking the page from loading.

Prioritize Important CSS

Inline the CSS for the content that shows up first on the page (above the fold) directly into the HTML.

1:8 Use Lightweight Themes and Plugins

Heavy themes and plugins add scripts and styles to every page. Use a lightweight theme and only the plugins you need.

How to Optimize Themes and Plugins:

Choose Lightweight Themes

Choose lightweight themes like Astra, GeneratePress, or Neve.

Limit Plugins

You should limit your plugins by reviewing them regularly. You need to remove any you don’t use or truly need.

Avoid Feature Overload

You should avoid overloading your site with too many single-purpose plugins. Instead, use plugins that can handle multiple tasks.

1:9 Use HTTP/2 Or HTTP/3

If you upgrade to HTTP/2 or HTTP/3, you can increase page speed by improving resources delivered to browsers. These newer protocols will allow multiple files to load simultaneously over a single connection (multiplexing), compress headers to reduce unnecessary data transfer, and prioritize critical resources like CSS and JavaScript.

How To Do It:

Check Your Hosting

First, check if your hosting provider supports HTTP/2 or HTTP/3. If your host doesn’t support them, consider switching to a more modern provider.

Use HTTPS

Make sure your website uses HTTPS with a valid SSL certificate. This step will ensure a secure connection for your users, which is important for privacy and website performance.

Test Your Setup

Test your setup by using tools like KeyCDN HTTP/2 Test to make sure your website is using the latest protocols, like HTTP/2 or HTTP/3, for faster performance.

2:0 Optimize Fonts

Web fonts can improve your website’s appearance, but if not used properly, they can slow down its load times.

How to Optimize Web Fonts:

Use System Fonts

Try to use system fonts on your website.

Font Subsetting

Instead of loading an entire font family, only include the characters or subsets that you actually need. For example, if you don’t need special characters, then don’t include them.

Use Preloading

For fonts that are essential for your page’s design, use the <link rel= “preload”> tag.

Check your chains: the Redirect Checker shows every hop a URL takes before it loads.

2:1 Reduce Redirects

Redirects can slow down your website because each one adds extra time to the loading process.

How To Reduce It

Audit Your Redirects

Audit your redirects by reviewing your website for unnecessary redirects. If you find any, you can simply remove them to improve your site’s load speed.

Fix Broken Links

Regularly check and fix any broken links for both internal (within your site) and external (leading to other websites). Broken links often cause unnecessary redirects.

Spot-check the basics: run the Website SEO Audit after big changes to catch slow or broken pages.

2:2 Monitor Website Speed Regularly

Check field data from real users in the Search Console Core Web Vitals report or PageSpeed Insights, and use lab tests to debug. Lighthouse cannot measure INP; Total Blocking Time is its lab proxy.

Google PageSpeed Insights

You can do it by using Google PageSpeed Insights, which will give you a score and actionable suggestions on how to improve your site’s speed.

GTmetrix

You can get detailed reports on your website’s performance, along with helpful tips and recommendations on optimizing speed and improving loading times.

Pingdom

It will monitor your website’s page speed and uptime and provide insights into its performance and reliability to help you ensure it runs smoothly.

2:3 Enable Preloading And Prefetching

Preloading and prefetching will help speed up your website by loading important resources early. This will allow you to prepare for what users might do next.

How To Enable:

Preload Key Resources

At this stage, you need to use the <link rel= “preload”> tag to load important resources, such as fonts, images, and other essential CSS/JS files.

Prefetch Links

Predict which links or pages users might click next, and use those <link rel= “prefetch”> tags to load those resources in advance.

2:4 Manage Third-Party Scripts

Third-party scripts, like those for ads, analytics, or social media widgets, can slow down your website if it is not managed properly.

How To Manage:

Load Asynchronously

Use the async attribute to load third-party scripts. This will let the scripts load in the background without stopping the rest of the page from loading, making your site faster.

Use Tag Managers

A tag manager like Google Tag Manager makes scripts easier to manage, but old or unused tags still cost speed. web.dev advises removing unused tags periodically.

2:5 Reduce Code Bloat

You need to keep your code clean and optimized by removing unnecessary or messy parts.

How To Reduce It:

Ship Less JavaScript

Frameworks such as React can add large JavaScript bundles, which hurts responsiveness (INP). Use built-in browser features instead of JavaScript where you can, and remove unused code.

Eliminate Inline Styles

Avoid placing CSS styles directly within your HTML elements. Instead, store your CSS in separate, well-organized files.

2:6 Prioritize Mobile Optimization

Google uses the mobile version of your content for indexing and ranking, so mobile speed matters most. Fixing it also supports ranking higher in search results, though speed alone does not guarantee that.

How To Optimize For Mobile:

Responsive Design

Make sure your website is designed to adapt to different screen sizes.

AMP Is Optional

Google Search indexes AMP pages like any other page and applies the same standard to all pages, so AMP is not required. A responsive page that meets Core Web Vitals is enough.

2:7 Invest In A Robust Hosting Provider

Your hosting provider plays a major role to improve your website’s speed and reliability.

How To Do It

Choose SSD Hosting

Choose hosting that uses solid-state drives (SSDs). SSDs are faster and more reliable than traditional hard drives (HDDs), and they will improve website performance.

Go For Managed Hosting

Managed hosting services take care of server maintenance, updates, and performance optimization, so your site will run faster without you needing to handle technical tasks.

Conclusion 

Speed work pays off when you measure first and fix the biggest cause. If you want a second opinion, you can take expert assistance, or see how SEOs Hut approaches technical SEO.

FAQs

What is the fastest way to speed up a website?

Start with images, because most pages load an image as their largest element. Resize and compress them, use WebP or AVIF, and give the main image high fetch priority without lazy loading. Then add caching, a CDN and better hosting, and remove unused scripts and plugins.

What is a good website loading time?

Google’s Core Web Vitals give the targets: Largest Contentful Paint within 2.5 seconds, Interaction to Next Paint of 200 ms or less, and Cumulative Layout Shift of 0.1 or less, measured at the 75th percentile of real visits. There is no single universal load time.

Do I still need AMP to make my site fast?

No. Google Search says it indexes AMP pages like any other page and applies the same standard to all pages, whatever technology built them. A responsive page that meets Core Web Vitals is enough, and AMP is optional extra work.

Why is my website slow on mobile but fast on desktop?

Phones have slower processors and networks than desktops, so large images and heavy JavaScript hurt more. PageSpeed Insights reports mobile and desktop separately. Fix the mobile LCP element and long scripts first, because Google uses the mobile version of your pages for indexing.