A little while ago we wrote a post on the pros and cons of stacking divs to speed up interactions. Since then we received a number of questions regarding guidance in regards to the website response time. Specifically: What should the response times be for a typical site? Some of you who have attended our our Interaction Design For Engineers talk have probably heard us speak about this. In this post we'll go over 3 important limits to remember for site response times.
Less than 100ms
For an action that has no shared control (such as typing something in a field) 100ms is the perfect response time. You type a character and you expect it to show up in the text field immediately.
Here is the example of how to use a sub-100ms response time:
More than 100ms but less than 1sec
Any action that takes more than 100ms and less than 1s implies shared control between person using the interface and the interface itself. In other words, the user expects the app to process the command they have asked it to do. If a user clicks 'next' after filling out a form, they expect to wait for at least 100ms until something happens. You might need to add a delay in your interface to achieve this response time. See below:
More than 1sec but less than 10sec
For anything that takes from 1 to 10 seconds, the user starts to lose focus on the task and lose flow. If you are in this range, you have to show some kind of message that something is happening but you don't necessarily need to say: 'this will take 20 seconds to come back'. A good solution for this response time is a spinner or some type of progress indicator such as this:
More than 10sec
This response time is just plain old depressing for the user. If the action will take more than 10 seconds you need to notify the user that they have time to go get coffee, check Twitter or their email or do something else. Alternatively, you can give the user something fun to do while they are waiting for the action to complete. Here's something we use to engage users while they are waiting for a process to complete:
Response times are a tricky subject; it's easy to mess up the interactions and lose a customer's focus during longer processes. Hopefully this post clarifies what to do during each time window. We'd love to hear any past experiences you've had with response times. Give us a shout.