Euro NCAP latest safety ratings page displays car safety test results with some filters like checkboxes to choose the time period by year and dropdowns to choose car make and model. All in all it’s quite easy for a user to control. Still a smaller problem lies here in details of how some form control elements are design. In this case we talk about the scrollbar inside the dropdown menu. It may have an appealing and contemporary design but is amazingly narrow to be used with a mouse pointer.
Even worse the menu is not very responsive when swiping through it with your fingertip. Besides in dropdown menus there has always been a possibility to shuffle through choices via keyboard letter keys. For example when looking for any choice starting with a letter “s” you open the dropdown menu and start pressing the “s” key until the right choice is active in the menu. In this dropdown you cannot do that.
So what to do? I suggest when using this kind of scrollable dropdowns these should have a wider scrollbar area. As indicated below, a popular UI framework called Semantic UI has a dropdown menu with a scrollbar of almost double the width of the one at Euro NCAP site when these are measured side by side. Why not stay with the best practice.
Another alternative is to use a combo box. The combo box allows users to write a search word and it displays results under the search box. Basically it is a search box with a dropdown menu like the example below from Kendo UI demos website.
A good web resource to obtain usability ideas is Nielsen Norman Group website. They have even a dropdown dedicated article “Dropdowns: Designs Guidelines” for you to read.