Opti­mize a web­site’s speed and per­for­mance to enhance the user expe­ri­ence, ampli­fy cus­tomer’s reten­tion and increase ROI! In this arti­cle, you will find 20 valu­able tips on how to opti­mize your web­site to load faster and improve your business.

Free website speed test tools

The first step in web­site speed and per­for­mance opti­miza­tion is test­ing, detect­ing and ana­lyz­ing over­all speed issues. To do that suc­cess­ful­ly, we sug­gest using some or all of the rec­om­mend­ed speed test tools:

• GTmetrix – Grades your page’s speed per­for­mance and gives you rec­om­men­da­tions with detailed expla­na­tions on how to improve your Page­Speed and YSlow scores.
• Ping­dom Web­site Speed Test – Besides giv­ing you per­for­mance grade and esti­mat­ed page load time, this tool can sort out files for all HTTP requests based on their size, and quick­ly detect bottlenecks.
• Web­PageTest – This tool allows you to test your web­site’s per­for­mance from more than 20 loca­tions in Chrome, Fire­fox and Inter­net Explor­er. It gives you an esti­mat­ed load speed, the TTFB (Time to First Byte) and lots of oth­er use­ful information.
• Google’s Page­Speed Insights – This tool does­n’t give you a load time esti­mate but gen­er­ates sug­ges­tions based on a web page analy­sis, to make that page faster.

20 tips on how to optimize website speed and performance

1. Choose quality hosting

The pre­con­di­tion of hav­ing a fast web­site is a qual­i­ty web host and reli­able DNS provider. Choose a host­ing com­pa­ny that has servers geo­graph­i­cal­ly locat­ed, where your tar­get audi­ence is. Avoid cheap host­ing solu­tions, and if your bud­get allows, choose a man­aged or ded­i­cat­ed serv­er, over shared hosting.

2. Use quality frameworks or lightweight themes

Opti­mized web­site speed and per­for­mance should be the most impor­tant point in mod­ern web­site design. Unfor­tu­nate­ly, most web­site own­ers do not real­ize that every extra load­ing sec­ond neg­a­tive­ly impacts their busi­ness. Ver­sa­tile, fea­ture-rich themes gen­er­ate more sales, and for this rea­son, many Word­Press devel­op­ers are inclined to put per­for­mance as a low­er priority.

If you’ve built your web­site using the wrong frame­work or theme, it would be very hard to opti­mize it, once your site is up and run­ning. If you want to have a fast web­site, make sure to choose a qual­i­ty, lean framework/theme, or you might regret it later.

3. Reduce the file size of your images

Unop­ti­mized image files are the num­ber one fac­tor that slows down a web­site. If you have to choose to change only one thing to improve your web­site’s speed, you should go with image optimization!

Images bear 64% of an aver­age web­site’s page weight ~ HTTP ArchiveCLICK TO TWEETThe best image opti­miza­tion tac­tic is to reduce the file size before upload­ing by fol­low­ing these rules:

• choose the prop­er for­mat – use JPGs for pho­tos, PNGs for logos, illus­tra­tions and when you need trans­paren­cy, use GIFs only for animations
• scale down the image to exact dimensions
• com­press the image

You can com­press images loss­less with online tools like Tinyjpg or Compressor.io.

Loss­less com­pres­sion reduces the file size by remov­ing unnec­es­sary image meta­da­ta. With the loss­less com­pres­sion method, there is no qual­i­ty loss.

If you have hun­dreds of images already uploaded on your web­site and don’t have time to reduce file sizes man­u­al­ly, you can use bulk opti­miza­tion plu­g­ins such as EWWW Image Opti­miz­er or Opti­mus – Word­Press Image Opti­miz­er.

4. Reduce the number of HTTP requests

Every addi­tion­al HTTP request slows down your web­site. To reduce the num­ber of HTTP requests you can do one or more of the following:

• com­bine your CSS and JSS files into as few as possible
• reduce the num­ber of plu­g­ins and widgets
• opti­mize plu­g­in usage – replace plu­g­ins which add many HTTP requests
• reduce the num­ber of tags in your code – use Google Tag Man­ag­er to add track­ing, ana­lyt­ics and remar­ket­ing tags to your website
• avoid using 3rd par­ty frameworks
• host fonts locally
• use CSS sprites

5. Enable Gzip compression

Gzip is a form of com­pres­sion at serv­er lev­el, which can save you a lot of band­width. You can enable Gzip com­pres­sion with a plu­g­in or man­u­al­ly in your .htac­cess file.

6. Minify CSS, HTML and JavaScript files

Reduce all unnec­es­sary char­ac­ters from your CSS, HTML and JavaScript files. Google sug­gests the UglifyJS2 tool for mini­fi­ca­tion of JavaScript files, and css­nano tool for mini­fi­ca­tion of CSS files.

7. Optimize CSS

CSS opti­miza­tion is more than mini­fy­ing CSS files. Here are some good prac­tices on how to opti­mize CSS code:

• use few­er dec­la­ra­tions and operators
• load CSS code inside the <head> tag
• use exter­nal CSS files
• avoid @import
• avoid inline CSS, use inline small CSS
• use as few CSS files as possible

1 in every 4 vis­i­tors aban­dons the web­site if the load speed takes more than 4 sec­onds!CLICK TO TWEET

8. Optimize the DOM’s critical rendering path

Pre­vent CSS and Javascript code from block­ing the DOM with these practices:

• use as lit­tle code as pos­si­ble; com­press, mini­fy and con­cate­nate files into few­er files, prefer­ably only into one file
• put the CSS ref­er­ences in the head tag and move the scripts before clos­ing the </body> tag
• avoid ren­der block­ing of JavaScript by using the async or defer directive

9. Use a Content Delivery Network

Use a CDN such as Max­CDN or Key­CDN to dis­trib­ute your con­tent glob­al­ly, and deliv­er cached sta­t­ic con­tent to geo­graph­ic loca­tions near your users. With CDN, your web­site will be faster and user expe­ri­ence improved.

10. Avoid 301 redirects

Redi­rects dou­ble the required time for the ini­tial HTML doc­u­ment load­ing and for this rea­son you should avoid them when­ev­er possible.

11. Leverage browser caching

You can lever­age brows­er caching with a caching plu­g­in or spec­i­fy caching para­me­ters for dif­fer­ent files in your .htac­cess file. Google rec­om­mends to set expires head­ers with a min­i­mum max-age of 7 days.

12. Utilize server-side caching

If your web­site is high in traf­fic, con­sid­er uti­liz­ing serv­er caching. You can cache com­mon­ly used data from the database

13. Enable HTTP/2

HTTP/2 does not change the HTTP fun­da­men­tals; there are still requests and respons­es, but the usage of net­work resources is more effi­cient. To enable HTTP/2, you need to migrate from HTTP to HTTPS and have a serv­er that sup­ports HTTP/2.

14. Host fonts locally

In the last few years, web fonts have become increas­ing­ly pop­u­lar. The major­i­ty of web­sites are using cus­tom fonts, which are great from a design point of view. Unfor­tu­nate­ly, web fonts are ren­der block­ing and add extra HTTP requests to exter­nal resources.

In 2016, more than 63% of all web­sites are using cus­tom web fonts ~ HTTP ArchiveCLICK TO TWEETIf you are a fan of cus­tom fonts, the rec­om­men­da­tion is to host the fonts local­ly and, if you are using a CDN, move them to your CDN.

15. Use lazy loading

With lazy load­ing, con­tent loads only when it becomes vis­i­ble on the user’s screen. For exam­ple, if the user scrolls only through the first half of your web page, the sec­ond half will not load and will save a part of serv­er mem­o­ry and bandwidth.

16. Fix 404 Errors

Reg­u­lar­ly check for bro­ken links in your Google Search Con­sole account or from time to time run a quick scan with the Online Bro­ken Link Check­er. Fix all 404 errors to save serv­er memory.

17. Optimize your database

Your data­base can accu­mu­late a lot of unnec­es­sary infor­ma­tion and slow down your web­site. To pre­vent it from hap­pen­ing, remove:

• com­ments in the queue and unap­proved comments
• post revi­sions
• trashed posts and pages

18. Avoid non-functional multimedia content

Recon­sid­er the amount of graph­ic con­tent you are using on your web­site. Avoid graph­ic based back­grounds and large sized images, which are not the decid­ing fac­tor in dri­ving conversions.

19. Disable pingbacks and trackbacks

Track­backs and ping­backs are most­ly spam that ends up in your com­ment mod­er­a­tion sec­tion. Too many unap­proved com­ments can slow down your web­site, so it’s best to dis­able them. If you are not using com­ments on your web­site it’s best to remove com­ment fields permanently.

20. Use CSS sprites

CSS sprites is an opti­miza­tion tech­nique of com­bin­ing sev­er­al image files into one, which reduces the num­ber of HTTP requests. Few­er requests = bet­ter speed and performance.

CSS sprites are very use­ful for social media but­tons, flags or oth­er icons that are usu­al­ly dis­played together.

Maintain your website regularly

Web­site speed and per­for­mance opti­miza­tion is an ongo­ing process. Once you’ve man­aged to suc­cess­ful­ly opti­mize speed and per­for­mance you have to con­tin­ue mon­i­tor­ing, test­ing and – most impor­tant­ly – reg­u­lar­ly main­tain your web­site. If you fail to do so, every­thing you add to, or change on your web­site, such as code changes, new wid­gets, plu­g­ins, pub­lished con­tent, revi­sions, com­ments, etc. can influ­ence future load speed and performance.