Web Performance as a Competitive Advantage
Web performance is often considered an engineering optimization which developers are responsible for resolving at the end of the development process. This mindset is also why performance is one of the most overlooked optimizations on the Web. Performance must be an essential design feature that is prioritized during each phase of your process. In doing so, the speed at which your site loads will not only result in better user experiences, but can become a key competitive advantage.
Time is Money
Simply put, it is not enough to have a responsive website available on any device; it also must be fast. The average user expects your site to load in two seconds or less; after three seconds, up to 40% will abandon your site. Another consideration is that 88% of online consumers are less likely to return to a site after a bad experience that resulted from slow performance. This equates to lost revenue from not only that consumer, but also prospective consumers who may learn of the bad experience via social media or word of mouth.
It’s fair to say that online customers are impatient, and the implications are quite alarming. For example, Amazon has discovered for every one second delay, conversions dropped by 7% and would result in an annual loss estimated at $1.6 billion. Now let’s say your company sells $100k per day online. A single second delay that is making users wait longer than they want is costing your company an annual loss of $2.5m.
What Contributes to Poor Performance?
There are several contributing factors when it comes to poor performance on the web. Below are a few which have the most impact:
Page Weight
Page weight is the total file size of all elements that must be loaded in order to render a Web page, including the HTML document, stylesheets, scripts, images, fonts, and other media. In 2015, the average page weight increased by 16% to reach a whopping 2,262KB, and the year before saw a very similar increase.
Images are still the largest contributing factor to this, but things like custom web fonts, bloated CSS and Javascript are also adding up. Then there are the other features that supposedly “increase engagement”: third-party ads, obtrusive sign-up popups, underused social media buttons, and redundant tracking scripts. These combined elements contribute to bloated pages, and are likely hurting you more than helping.
Ignoring Progressive Enhancement
Progressive enhancement is a web design strategy which prioritizes content delivery to all browsers (usually via HTML and mobile-first structured CSS), and progressively adds enhancement layers. This layered approach is focused on providing everyone with access to basic content and functionality of a web page, while taking advantage of browser/device features if available.
Let’s take Javascript for example. This powerful scripting language is what powers most of the interactivity you will find on the Web. Unfortunately, many websites rely on Javascript to simply have a useable interface. There are a number of reasons why a device can fail to load this enhancement layer, resulting in a broken experience for the user. When and if this happens, the user will likely never return.
Adopting progressive enhancement not only ensures that users can utilize your website sooner, but the experience will remain useable even if something fails to load fast enough (or fails to load altogether).
Poor Planning
Web performance is an invisible feature, which often means it is overlooked. This inevitably results in performance optimization being put off until the end of the project, at which point it’s too late to have a significant impact beyond what is achievable with development optimizations. Performance must be treated as design if it is to become a competitive advantage. This means it is essential for everyone, not just developers, to make performance a priority and properly plan for it from the beginning.
Web performance is often considered an engineering optimization which developers are responsible for resolving at the end of the development process. This mindset is also why performance is one of the most overlooked optimizations on the Web. Performance must be an essential design feature that is prioritized during each phase of your process. In doing so, the speed at which your site loads will not only result in better user experiences, but can become a key competitive advantage.
Prioritizing Performance
We have covered why optimizing web performance is important, as well as what contributes to poor performance. Now let’s look at some ways we can prioritize performance in the early planning stages of the website creation process.
Planning
There are plenty of technical considerations when optimizing performance, but impact is limited if performance isn’t planned for and established as an essential feature from the beginning. Performance is an invisible feature, so it is critical for everyone on the team to treat performance as a priority. This means including performance as a primary objective in project documentation such as statements of work, project proposals, and design briefs.
Process
It is important that performance downfalls are discovered as soon as possible. By adopting a more agile design process and leveraging the power of prototypes, you can discover potential performance bottlenecks early. This will allow your team to address issues before launching your website, saving both time and money.
By prioritizing performance as an essential design feature, it is possible to leverage the resulting increase in page speed as a key competitive advantage. Per Google’s DoubleClick, ROI can be substantial. When comparing sites that load in 5 seconds to sites that load in 19 seconds, the faster sites had 70% longer average session lengths, 35% lower bounce rates, and 25% higher ad reach than their slower counterparts.
These findings reflect what many companies experience when prioritizing performance and serve as a catalyst to ensure that performance is a top priority for all projects relating to web development.
