Monday, July 4, 2016

usability - Accessible custom scrollbars?



While it seems that the general consensus on custom scrollbars is that they are somewhat detrimental to overall user experience, powers beyond my control are suggesting their implementation is mandatory. Other than giving the scrollbar standard accessibly features (wide enough to be easily selected, high enough contrast to be easily noticed, etc), what are usability features I should keep in mind for an easily used custom scrollbar?



Answer



Good old Jacob Nielsen on Scrolling and Scrollbars:



With each of these successful designs, users easily noticed the scrollbars and used them without problems. By comparing the two figures and several other designs we tested, we determined four requirements for a good scrollbar:



  • Use an actual bar in the shape of a rectangular trough, preferably in a color that contrasts with the background.

  • Show arrows at the top and bottom.

  • Include a slider (sometimes called a "thumb" or an "elevator"), preferably in a color that contrasts with the trough. The slider's position should show the visible area's position relative to the total area, so people can see how much more content they have to scroll through.

  • Allow users to scroll by


    • clicking in the trough,

    • clicking on the arrows,

    • dragging the slider, and by

    • using a scrollwheel on their mouse.




Scrollbars are easy to get right. In fact, the less work you do, the better your scrollbar. Usability is almost always enhanced when you use the built-in scrollbars rather than design your own.




No comments:

Post a Comment

technique - How credible is wikipedia?

I understand that this question relates more to wikipedia than it does writing but... If I was going to use wikipedia for a source for a res...