Tag Info

Hot answers tagged

45

Paging should be used to break content into semantic or task-related groups of content, such as by your categories in your menu bar on the left. This allows users to find content by what it is (e.g., the page title in a menu) rather than where it is (e.g., page number or relative position in a scrolling page). Generally user tasks depend on what (“I need to ...


29

The accepted UX terminology for this pattern is "infinite scrolling". It's becoming more and more common in rich web apps because it's a way to keep users engaged with a minimum number of roadblocks. The accepted viewpoint is that users prefer single page versions of content when given the choice (Google's own research backs this up), but that it's ...


22

If I understand your question right, this is a very common problem since iOS and Android (and now OSX) never show any scrollbars. A good way to go are visual clues: If the canvas is full the last item shouldn't be completely visible. Here's an example from one of our apps: Additional thought: Windows 8 Metro (and WP7) heavily rely on visual clues for ...


20

Why not show a few items from each list, and collapse the rest? Alternatively, use an accordion, but it may not always work.


20

Horizontal scrolling is terrible. Users almost always complain about it, and it's particularly a problem when paired with vertical scrolling; there's nothing worse than trying to scroll a site on mobile when you keep scrolling horizontally on accident. Lots of data backs up this idea in web user's behavior; Horizontal Attention Leans Left (for Left to Right ...


20

Yes, you should allow users to escape it. The Boston Globe redesign was handled by Ethan Marcotte, who wrote the book on responsive design. Combined with the CMS nature of the site makes it perfect for deployability, usability, and flexibility concerns with responsive designs. Each viewport has to morph content to promote, demote, and generally rearrange ...


19

The way I understand the article is that you still want your most important content at the top where it'll most likely catch attention first. What they're arguing against is the old notion that everything must be above the fold because novice users don't know how to scroll. Well, they do, at least now. Frankly, we shouldn't be surprised. The fold matters, ...


19

The arrows on scrollbars are a functional element. If you click on them they move the screen up or down. Clicking on the area between the arrows and the position marker usually moves the screen up or down a page at a time. They are therefore not redundant as nothing else behaves in the same way. Whether or not they are needed is a different issue. While ...


18

I think of this more as a mental model issue. Imagine if there was no mouse, but rather you were doing it with your hand. Most people are right-handed. My mental model is that I am moving the scrollbar with my right hand. Therefore, scrollbar on the left would indicate that my arm is moving across (in front of) the content and blocking my vision so I can ...


18

Horizontal scrolling like all other features requires certain conditions to exist in order to be comfortable. These conditions include display technology (screen & layout) and the navigation control technology (input devices). Let's look at the brief history of them all. Nearly all analog means of presenting information have had horizontal scrolling: ...


16

Aesthetics help usability. Many things "just" look nice, but when it comes to such key elements as scroll bars, their visual appeal can make them more usable. It's important that they look different from a standard scroll bar, because in most web apps at least one of the scroll bars is the rightmost element on the page, so it's adjacent to the standard ...


15

Besides the obvious... An indication that what is on screen is not the complete content. For example: Text stops mid sentence A border box shows no bottom but has the left and right edges stopping at the bottom. Even more emphasized if they have drop shadows. Text or lists that cut off the bottom half of a line. Pictures cut in half Long text which has a ...


15

I believe this was simply done because we read from top to bottom. The choice was made pretty early on, and was probably influenced a lot by technical limitations. Because text is encoded linearly, most text editors (not necessarily word processors) had a limit in the number of columns and rows they could display. If you go far back this was typically along ...


14

They are usually used because the designer thinks that they look better. Many designers design for what looks good rather than for what is usable. For usability just use the standard scroll bars. Edit: Also, the way that different people use the scrollbar varies a lot. Some click on the bar and move it; some use a scroll wheel on their mouse; some click ...


14

This is something we've had issues with as well - perhaps this solution may help you. The general idea is that you have a group of elements with arrows at the top and bottom (these can be clicked to scroll). The user can also use a scroll wheel inside the area to scroll. There's no real affordance of scrolling here, but it provides an alternative method for ...


13

The conceptual model isn't "left arrow moves the elements left"; it's "left arrow takes me to the element on the left". With indirect manipulation like this, it's probably fair to assume that users are thinking in terms of the content they're consuming rather than the spatial projection of the UI.


12

The entire point of a modal is that the user needs to focus on that task before doing anything else. Modality is most appropriate when: It’s critical to get the user’s attention. A task must be completed (or explicitly abandoned) to avoid leaving the user’s data in an ambiguous state. Considering this, I would say it would be counter ...


11

Here is an article from a few years ago: http://blog.clicktale.com/2006/12/23/unfolding-the-fold/ The major findings here were that: 91% of the page-views had a scroll-bar. 76% of the page-views with a scroll-bar were scrolled to some extent. 22% of the page-views with a scroll-bar were scrolled all the way to the bottom. Also of note is that it ...


11

I'd break them into three pages, but not because of scrolling. Scrolling is not a problem. Having 30-40 fields thrown at you all at once is intimidating, it creates an immediate overload that may scare users off. Dealing with them one group at a time is much easier.


11

You could use "Return to Top", "Jump to Top" or "Skip to Top". I would avoid using anything but "top", honestly. Alternate words like "beginning" or "start" indicate a time span or activity and are more related to media controls. If you're going for classy "Return to Top" is not a bad choice.


11

It's quite literal: Long page design (google search for the same term).


10

The scroll bar is usually used after the content of the page above the fold has been consumed. I.e. the users first look at the content or read it and once they've reached the bottom, they scroll to see the rest. Since the language determines the order of consumption, the users will have finished the visible content and would need to see more (scroll) ...


10

Off hand, Option 1 sounds better for the reason you give –it’s easier and less error-prone to tap to advance to the next question than to swipe/scroll. The general rule is to use scrolling to avoid arbitrarily breaking up content. In your case, if you can only fit one whole question on the screen at a time, then you’re not being arbitrary. You may find some ...


10

I wouldn't approach the Conduit website from a UX perspective. I would look at it from an advertisement angle, i.e. as just a gimmick designed to get attention (albeit clumsily, IMO). Print advertisements have been using such a gimmick for years, example: I cannot think of a good reason to use reverse scrolling, no more than there is a reason to print ...


10

Several ideas: You've said that fading edge is not available. I assume that if it was available, you would have used it. Why not implement a fading edge by yourself? This shouldn't be too hard to implement, just draw a gradient mask in a layer over your content. If you extend the default scrollable container class (ScrollView), you can add this ...


10

There is very simple logic behind it and that is difference of perspective. For example Make a frame of your fingers and like shown in the image below and turn your "frame" towards the right and see what happens. you move your frame right and your vision moves left. you move your frame left and your vision moves right. Now you have to pic one of the ...


10

For all practical purposes it is termed the "Collapsing Header Effect" (genius, right?) and you can find out more and how to implement it yourself here. EDIT The idea is fairly new as far as I know and its simply an "effect" rather than a pattern. I cant recall where else I have seen it but it is becoming more common. The article will tell you that this ...


10

The fact is, it doesn't matter what you think. You shouldn't disable scroll wheel zoom just because it's better for you because you are not your typical user. For those using Google Maps embedded into your page, users are going to have have some pre-conceived expectations of how it should behave - i.e. they expect it to behave like Google Maps in its normal ...



Only top voted, non community-wiki answers of a minimum length are eligible