Tuesday, November 8, 2011

Facebook's Infinite Scrolling page.

I must admit I am a Facebook addict. I personally like to see what my friends have shared on the “News Feeds” page. And if you have currently been very active on Facebook you might have noticed some set of user interface changes they have been doing.

I would in this write up like to talk and take your views about the “infinite scrolling” or “bottomless paging” behavior on this page. I would like to discuss what particular advantages it has over few other ways of presenting content, what gets compromised and what else Facebook guys could do to improve upon.


Why “Infinite Scrolling”?

Media content rich sites like facebook want there users to adhere to there site. It’s a well studied fact that Users want to keep their content on one page give them a “read more” link which takes them to different page and they will start loosing their interest. So “infinite scrolling” has started getting acceptance as a valid UI design pattern. Users keep scrolling down and they get more and more content to read It’s like driving on a smooth road without much roadblocks. One similar example one can think from his everyday life is “Think that you are watching a movie on HBO and its just started building the interest and suddenly they show advertisements what you do you move to a different channel and many a times loose the initial content you were viewing”. So is with website give users a roadblock and they would switch to something else. The earlier patterns like pagination, read more etc stops users to take decisions and their normal flow is disturbed..

What’s wrong with it?

Keep in mind that infinite scroll is not for every site and not for every page. It’s just a way of removing “Road Blocks” from a users view while he is enjoying watching the content.

With infinite scrolling in place you won’t touch the bottom of the page of your site. So if there is some footer containing some important information or link you are sacrificing that content.

User sometimes get annoyed while he is moving the scroll bar down to read down it moves up because some more content has loaded.

Also if you are somewhere in the middle of reading content you will have to scroll quite high up to find the navigation.


How to do it right?

Let’s start with Header and Footer First if you have some important information in your header and footer it must be easily accessible with least scrolling. But since we are dealing with an infinite scroll we can design out header and footer with fixed positioning. See Facebook has a fixed layout for its header. So even if you have scrolled a lot down. You will always have the header near your eyes. But I am not sure why Facebook has done injustice to its footer by keeping it nearly inaccessible to its users. A fixed positioning for footer or moving of footer links somewhere at the top might solve this problem.

The problem of scroll bar annoyance can only be dealt with introducing correct timing. By timing I mean scrolling should be smooth enough so that even when more content is loading the user is aware of it. I believe twitter does the same more smoothly than Facebook. Here are few more suggestions of how to do it right on http://uxmovement.com/navigation/infinite-scrolling-best-practices/



2 comments:

  1. If infinite scrolling takes time, usually users avoid to wait for next set of data and prefer to visit other pages/links. So, in case of using infinite scrolling, time is the most vital point.
    Yes, twitter takes very less time in comparison of facebook. Reason - Facebook post contains text,picture and/or video while twitter contains only text( even limited number of characters per tweet).
    If consumed time is feasible, need to check the usability of header and footer. Fixed positioning of header and footer is one of the solution of this problem.
    Thanks Sushil for pointing out this new alternative of pagination.

    ReplyDelete