The Best Practices for Speeding Up Your Website
Over the years, you have probably heard about a lot of different ways to speed up your website and wondered if any of them work. Well, as an Ottawa web design agency, we have curated a list of the best things that have proven helpful for us and put them into categories to make it easy to understand.
There are several areas of your website where you can focus your efforts – content, server, cookies, CSS, JavaScript, images and mobile. Optimising each of these areas of your website will combine to make for a much faster experience for your website visitors.
Content
- Make fewer HTTP requests
- Avoid redirects
- Minify HTML
- Prioritize visible content
- Make AJAX cacheable
- Reduce the number of DOM elements
- Minimize the number of iframes
- Reduce DNS lookups
- Avoid 404s
Server
- Reduce server response time
- Use a Content Delivery Network (CDN)
- Add expires or cache-control header
- Enable compression
- Configure ETags
Cookies
- Reduce cookie size
- Use cookie-free domains for components
CSS
- Eliminate render-blocking CSS in above the fold content
- Avoid CSS expressions
- Choose <link> over @Import
- Make CSS external
- Minify CSS
- Avoid filters
JavaScript
- Eliminate render-blocking JavaScript in above the fold content
- Make JavaScript external
- Minify JavaScript
- Remove duplicate scripts
- Minimize DOM access
- Develop smart event handlers
Images
- Optimize images
- Optimize CSS sprites
- Do not scale images in HTML
- Serve images in next-gen formats
- Make favicon.ico small and cacheable
Mobile
- Keep components under 25kb
- Pack components into a multipart document
