1

What is the best way to approach loading states of content that is localized or geo-located? In the attached example, I am loading the closest doctor and information related to such based on browser based geolocation, If this fails, we'd load content based off IP location.

The homepage features a large image of the doctor themselves and the interior page contains a synopsis of the doctor.

Despite the poor usability, in this scenario there will be an obvious load/lag time likewise a period in which the user may need to default content. Ie, if the site is accessed outside of the US.

What are the best ways to address this? Possible ideas are to A) show a global loader upon entering the site, B) render the rest of the site and use a loader for the location-based content only - however, after the element is rendered the page will expand after the DOM loads C) use a gateway screen, verifying the location while loading content in the background.enter image description here

1

I would discourage you from showing a global loader. A potential use case for your app is "I have an emergency, and I need a doctor now." Showing the loader initially could induce panic in users.

There are a few for increasing both real and perceived speed.

Real Speed:

  1. Cache the data (geolocate every X unit of time/X units of distance that the device moves) so the information is pre-loaded if/when they access the app.
  2. Use a CDN to reduce the server load and load objects in parallel.
  3. Reduce the number of objects loading, and reduce their file size. Put all CSS in one file, JS in another, and minify. Additionally, reduce the load from individual images. SVGs are lighter, and you won't need to serve multiple sizes for display densities.
  4. Decouple the client-side and server side. A framework like AngularJS separates the presentation, data, and logic components of your application.

Perceived Speed

  1. Prioritize and load what's important. Everything above the fold should be prioritized. You don't need to paint anything below the fold until users scroll. Do some testing to discover what's most important to your users. If your users care most about the doctor's information (eg. specialties, rating, distance from user), ensure that you're serving that first.
  2. Ensure that you have a great user flow. Users prefer pages where they can complete their desired task with ease, even if the load times are longer. "When people accomplish what they set out to do on a site, they perceive that site to be fast."
  3. Be creative with your loading indicators. Intriguing loading animations distract from the fact that users are waiting. If you're using something linear, speed it up as you go. Accelerating the displayed loading progression can cause perceived load time to change by ±10%.

Sources:
5 Steps for Faster Page Load Speeds
The Truth About Download Time
Animation Basics
The Perception of Speed

  • The doctor in this context is actually for eye-care for corrective vision treatments and not emergency related items. In this context, the doctor is being used with a headline to build familiarity and a "relationship". – master Apr 8 '14 at 18:42
  • That makes sense. Was my answer helpful to you? – SwankyLegg May 5 '14 at 16:03

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.