How To Build Agile, Compelling Landing Pages.
Posted on June 3, 2016 by Jay Jones
The aspect of a landing page can make or break a marketing campaign.
But even a page that’s beautifully designed and expertly written will fall flat on its face if customers abandon it before it finishes loading. Here are three simple tips to help you build a fast, resilient landing page.
1. Keep It Simple
As a general rule, a web page that relies on a few small objects will load faster than a page that uses lots of large objects.
Avoiding visual clutter is good practice for landing pages anyway, so a well-designed landing page won’t be overloaded with super-sized image files. However, it’s important to ensure that the images you do use are optimised for the web.
You also need to build a page that works well for visitors using different devices.
For example, if your landing page is responsive use different images for different viewports rather than rescaling one very large image to fit. That way, visitors on mobiles won’t waste time or bandwidth downloading unnecessarily large images.
The video is another popular way to make landing pages more engaging. However, video files tend to be even bigger than images, and if you make customers wait for them to load before they can view your page, you risk losing them.
2. Don’t use the same page structure as your main site
When you’re building a separate, standalone landing page, you don’t need to worry about loading all the resources you need for the rest of your website.
For example, you almost certainly don’t need all the same style sheets and JavaScript files. Instead, you can focus on loading only those resources you need to make that page work. You should also consider ‘inlining’ resources in the HTML – this means including them in the main HTML file, rather than loading them as separate files.
If the HTML includes all the CSS it needs to display the page, the browser has to make fewer requests and customers get to see that page sooner. On a normal website, the disadvantage of doing this is that visitors won’t be able to cache CSS for future visits or for use on other pages on the site. However, a landing page generally has just one purpose.
You’re less concerned about future visits or visits to other pages on the site. Instead, you need the landing page to load as fast as possible, maximising the chances that your prospect will convert.
3. Prepare for traffic
You’ve tried your landing page and it seems to load quickly. But what happens when 1,000 people are trying to access it at the same time?
Systems behave differently under load, so it’s crucial to have an idea of how many people are likely to visit your landing page at any one time and how it’s going to respond when they do.
One way to ease the pressure on your site is to try to spread visits over a longer period by, for example, staggering an email campaign.
It’s also worth considering a load test – subjecting the page to increasing levels of traffic under controlled conditions to see how it’s likely to behave when the campaign hits.
Want to learn more? Contact us today and let’s create you some new business!
Nicola Yap on March 12, 2018 at 10:26 pm said:
You brought up an excellent point about the design – make the landing page different structure than the website. I think that’s a great tip!