Loading time as it related to the number of pages and separation of images

Design help General
1

This may be a novice’s question. I like the look of “one-page” websites where the user can scroll down the page to see the entire website. However, I have roughly 20 screen shots that I want to show on the website in the “features” section.

There will be a lot of users visiting from parts of the world with slow internet connections, so it’s that much more important to have fast loading times.

Here is how I understand it: the loading time needed when a user goes to an initial website is determined by how much data is contained on that initial page. It’s not how much data is contained in the sum of all pages. Is that correct?

If it is correct, then my logic would follow that if I create a list of links on the “features” page like the list seen below, then I can reduce the loading time the user experiences through only showing 1 or 2 images for each feature, and the user needs to click on each feature link below to see the image(s) associated with that feature. So, for example, the user will only see screen shots associated with “Job management” when they click the “Job management” link, thus reducing the user’s initial wait time. Is that correct?

Paperless timesheets

GPS location tracking

Job management

Pictures and notes

Qualification tags

Staff schedules

Forms

Dispatch

Quotes, estimates, invoices

Accept mobile payments

Offline mode

Integrations: QuickBooks,

Salesforce, more

Languages

Custom features

2

Pages for sites are loaded as needed so, yes, dividing your content up into individual pages will make the site feel faster.

If you host with Webflow they have CDN built in, meaning the site will be cached locally for anyone visiting the site. Images are really the only thing that can cause long loading times. I recommend sizing them to the size that you want them, saving them as jpg and running them through www.tinypng.com This will size them down without any noticeable degradation. You should shoot for less than 200k per image or less than 100k if you have a bunch on a page.

Good Luck

1 Like
3

Thanks! I’ll likely try to host on Azure; does Azure automatically cache the site locally for people visiting the site?

4

Or if you want to create one page that only loads what’s visible until you scroll then you’ll need to add some custom javascript with something like the lazy load plugin. Here’s a link to a previous thread where someone used it with an explaination and video.

5

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.