As well as the actual load time, the perception of the speed of a website is just as important, as Dean Hume, Richard Rutter and Yesemenia Perez-Cruz all touched upon.
Custom web fonts, for example, can create a delay in displaying content while the browser downloads the required font. Replacing this with a web-safe font, which displays until the custom font has downloaded, can offer users a quicker experience.
Dean Hulme gave an acronym to remember technical changes which can be made to improve projects; RAIL.
For the last point, you could consider loading some CSS inline. By isolating the most important CSS and adding that inline, you'll allow a page to render significantly faster and increase the perception of a performance.
Budgeting From The Start
Managing and prioritising features and elements which affect performance can be a difficult task, which is why the conference placed a big emphasis on performance budgets.
By setting performance targets for load time, page size or a combination of the two at the start of a project, designers and front end developers can focus on website speed early on and ensure it's at the forefront of every decision.
- Kraken.io – for optimising images and improving load time
- Gulp-responsive – to generate different sized images to enhance responsive sites
- Critical gulp – to speed up perceived page load time by adding inline CSS
- UnCSS – which will remove any unnecessary styles
- Louis – an ideal gulp task for measuring performance and analysing performance budget
Performance Led Development
Summing up the conference, it's evident that performance should be an essential design feature, not just something to consider during the technical aspect of a project.
Placing an emphasis on performance budgeting and understanding the importance of speed and responsiveness across all devices and browsers, including those on games consoles, is the key to building a successful website today.
Use automated workflow tools to improve your processes and ensure that load times – perceived and actual – are the best they can be. If that means compromising on design elements, at least you'll be aware of it from the initial stages of the project.
Words: Dave Redfern
Dave Redfern is a designer and front end developer at iWeb Solutions,
an e-commerce website design agency based in Staffordshire.
Like this? Read these!