Opinion: Don't make placeholder pages, send content first

Zeynel Abidin Öztürk -
29 days ago

This is one of the annoying thing on the web design last (many) years: Loading an empty page without content first, then fetching content from server or maybe locally. This approach may look good to some, but in reality it have a few drawbacks. And it's not faster, it is slower.

Being web programmer myself, I know there can be scenarios you'll need to fetch data after you load the page - I'm not against it. I'm surely not the most experienced web designer, but in my opinion the page should have some content in the first place. If you have to update something, update it later.

Never send user a content page without content

This approach is broken from the very beginning. Even in some good documentation the approach is explained, and justified as "do this so user sees 'something' at the beginning". You really shouldn't be fooling your user with 'something' called text and image placeholders, which mean nothing other than waiting more.

This is because it doesn't always work in the way you imagined. People doesn't have low latency connections like your local machine does, and on slower devices like mobile phones, it can randomly cause stuttering.

The problems appear includes, from best to worst case:

- At the best, it works fast enough, but not always. It will certainly fall into the one of the scenarios below.

- User doesn't see crucial information on the first load (such as unit price, article text). They only see animating/static placeholders for a few second or so, which are completely useless.

- If this approach isn't implemented "good enough", it may look like the device is online when it is not; because it fetches the page from cache. I can open such a website, use the search bar just to find in fact there is no connection.

- The scripts are probably heavy for the device, the device probably renders page again, and this is not as fast as you think. The jumping of scrolling position is not nice - it may not happen to you on the test but it will happen to people, and it's not a nice experience.

- Again, the moment the content loads the scrolling will stutter (even if not jump to elsewhere), if the user was scrolling through the empty placeholder page. Even this sounds stupid enough, do we really need to fool the user? 

- If the loading took a bit longer, the user doesn't know if it's stuck or not. Because that JavaScript code or that fancy framework doesn't tell anything about it. The loading can take forever. This sometimes cause multiple page refreshes by user. Sure, below-par managers will like it, but it'll work against them in the long run.

I'm certain there are scenarios this approach is hard to avoid; e.g. you're making something like Google Analytics or you want to make an endlessly scrolling page. But for example in Facebook (a few years ago), it was really bad experience everything was placeholder. Probably it's a bit better now, but I don't use it. 

The fancy ecommerce site Hepsiburada works in such way too, but it's way too slow. I don't even want to visit it in mobile device and any website that works in "old" way, I mean the websites that load the content right away works much faster. It doesn't matter which nice JavaScript framework (or whatever) you use, if I should wait a few seconds just to see the price of a item.

This is a keyboard shortcut website, and if I load these lists with JavaScript, I'm sure the experience will be worse for some. I use this approach in comment section, where I update the comments if the page doesn't include new comment user just posted. But I always include comments in the first go, even if they're old - so no placeholders used.

Did you find this article useful?
1 0
Share this page on:

Join our mailing list!

Your email is kept private and we don't spam.