Introduction to Web Optimization: Why this Matters for You
Introduction: What Does Optimizing Your Web Page Mean? 🎯
Optimizing your website can be summed up as offering the best user experience for visitors. There are many ways to improve site performance, but it’s most important to know what your goal is from your website and what you want the user to do when they visit it.
Optimization of your website can take several forms such as:
- Ensuring the site loads quickly
- Improving the path to conversion
- Efficient content and resource loading
- Appropriate themes that are eye catching and don’t tire eyes when visiting the page
Although each of the bullet points can be independent articles, the purpose of this article is to give you a general idea (and tools) to help you resolve critical issues that are punishing your website in search performance. You’ll want to optimize your website to keep visitors engaged, encouraged to revisit soon and (ideally) excited about sharing your website with their friends.
Website Speed: Helping or hurting you? 🏁
The speed of a website can be measured by the time it takes to load, how quickly a user can interact with the content, and the time it takes for the first content to show. Website load time is an important factor in page optimization as long load times can deter visitors from converting or even visiting your site to give you the page view. The quicker a website loads, the more likely a visitor will stay on that site and continue browsing.
A 2019 study by Portent found that a less than four second load time is best for conversion rates, and the initial five seconds of page-load time tend to impact conversion rates the most.
A lot of indicators exist for page loading performance, but a few of the important markers worth noting:
- First Contentful Paint - A time that marks when the first text or image is seen on your website
- Largest Contentful Paint - A time that marks when the largest asset (text or image) is seen on your website
- Time to Interactive - Total amount of time one would wait before the page is completely interactive
Although there are more metrics with respect to performance (here’s a more exhaustive list by Google), these are the time indicating metrics that allow you to understand whether or not your website loads quick enough for visitors.
When does Website Speed Matter Most?
Website speed will always matter, but it depends on the context of your website to determine whether or not visitors are willing to wait to see what you offer. For example, a food and dieting blog might be looking to have quick load times if they are sharing resources hosted elsewhere (Youtube, TikTok, Instagram) and are using it to share information by text or refer clients to their social media channels. However, an ecommerce business selling handmade goods might need to be more flexible on load times due to high quality images that visitors might want to see when purchasing online.
Visitor Path and Hurdles to Conversion 🥅
Visitor paths are a way of understanding how visitors move through your site. The path is made up of the sequence of pages they visit and the hurdles they have to overcome to reach their goal on your site; reading a blog post, purchasing an item, subscribing to email, visiting your social pages. Understanding just how visitors move through your site can give you insight into how your website performs and whether or not visitors are engaged.
Hurdles are anything that prevents visitors from reaching their goal, such as:
- Page took too long to load ⏳
- Visitor did not like the content 😟
- Loaded irrelevant page 🤔
- Page was broken ❌
The metric used to determine if your website is creating hurdles or issues (or simply not to a visitor’s liking) is Bounce Rate (or Non-engagement Rate in GA4). This figure is represented as a % to show what portion of visitors did not stay engaged on your website or left suddenly.
When do you evaluate visitor paths to your website?
It’s a good idea to be aware of the struggles your visitors face when loading your website, but it’s critical when you have a high bounce rate (or low engagement rate). Using tools such as Google Analytics or Mixpanel, you can follow visitor paths to understand where visitors are leaving your website so you can see if it’s a technical issue or something related.
Asset Loading Practices ⏲️
As the web landscape continues to evolve, visitors are demanding more from the website owners or sellers to keep them engaged:
- Video content
- Short snippet carousels/slides
- Image/gallery content
- Podcasts
- And much more
And with the demand for more content comes challenges such as resource loading, content distribution networks and how to efficiently load these things for users within a short amount of time.
A key part of web optimization and improving load times of a website is identifying which assets are render blocking and which are not.
Render blocking assets are those that take a long time to load, such as high fidelity images, and hinder the loading speed for other assets on your site, such as scripts and widgets your site might rely on.
Having blocks of code from widgets or other styling that is important to your site might be impacting your site performance and are worth auditing if your page doesn’t perform as you’d expect.
When are assets loading a problem?
Figuring out if the assets loading are a problem depends on the time your visitors would likely expect to be
able to load your content. Typically visitors always want the information quickly, but assets (styling, user
experience, widgets, etc.) might be important for how your website operates. Asset loading can be artfully
designed to load critical assets up front (AKA in the header or <head>
) and less important assets at the end
(AKA in the footer or <footer>
) to bring a visitor’s network relief when downloading your web page(s) the first time.
Consider how animations, unused widgets, and other non critical elements may be effecting your users’ experience as they navigate through your site.
Choose Your Colour Palette and Themes Wisely
Your site’s colour palette and theme colours should be chosen wisely as they can affect your visitors’ experience, depending on their preference and possibly if they have difficulties seeing certain colours. Search engines have also started to use the colour of your site as a ranking factor to determine if sufficient contrast exists between elements. They have also begun to note the size of certain assets like text with images or video captions to determine if it’s appropriately sized for a reader on desktop or mobile devices.
When do you audit your colours and themes?
This is a qualitative feature, but one worth having a designer involved that you trust to determine:
- If you use too many colours on your site, visitors may feel cluttered and distracted
- If your text is too small, they may ignore important links
- If sufficient contrast exists within the colours used
- If the design is appropriate and attention-grabbing for the audience
Our team of web experts at EV Advisory are happy to help and address any of your questions about how to optimize your website. Google’s Lighthouse is a great tool for auditing the performance issues discussed here.