1

without headings with headings

Do the select boxes and the search box really need a heading to explain what their function is? The first heading in English reads "Filter the results". The second heading reads "Search within results". My user base will be between 18 and 65 years old.

2
  • Does the user experience improve by removing the headings?
    – scronide
    Nov 15, 2012 at 21:11
  • No, but it makes the visual design cleaner.
    – naf
    Nov 15, 2012 at 21:33

3 Answers 3

3

Usually I would say yes, you should provide a title for your related set of fields because it is good accessibility to do so.

The standard method is to group all the fields in a fieldset and provide a legend within this that describes all the fields within that section of the form. This is an accessibility preference, but not a full requirement (different screenreaders treat the legend differently (if at all)).

The reason for doing so becomes particularly useful when you have a large form with several groups of fields, because - while visually it is easy to tell one set of fields apart from another - screenreaders do not have such a luxury. By providing a legend the screenreader will basically announce to the user that 'the set of fields you have previously been entering have completed, this next set of fields are all related to x' which makes it much clearer to the user what they are going to be expected to provide.

To quote W3C:

The FIELDSET element allows authors to group thematically related controls and labels. Grouping controls makes it easier for users to understand their purpose while simultaneously facilitating tabbing navigation for visual user agents and speech navigation for speech-oriented user agents. The proper use of this element makes documents more accessible.

The LEGEND element allows authors to assign a caption to a FIELDSET. The legend improves accessibility when the FIELDSET is rendered non-visually.

Source: http://www.w3.org/TR/html401/interact/forms.html#h-17.10

But, as I opened this post with 'usually' that means I don't think it's required in all instances. Your example above is a small form where all the fields are related to eachother, so would all therefore have the same header or legend. Because of this you can probably get away without having the additional markup provided everything is introduced and labeled suitably. However I would probably look to include them unless it becomes particularly impractical to do so.

2

I'm going to slightly dodge your question and suggest that you only have one section. In my experience, very few (non-technical) users know the difference between filtering and sorting. Here's a good (and long) article on UX Matters on the topic. I'll spoil the ending for you:

However, research shows that, in the minds of many people, sorting and filtering tools are just different ways of parsing search results, so there is no reason to separate these two types of controls. In fact, some successful user interfaces combine various sorting and filtering controls in innovative ways that best meet customers’ goals.

I'll also give the standard answer of "just test it". Sounds like a great candidate for an A/B test.

1

It will depend on the context where your filters and search options are located. For example, if you have a table with data and you have filters embedded within the table headers which allow users to sort or even filter by parameters, users will be able to relate the data with the filters as given below

enter image description here

However if the context of where those filters are going to be applied to is not clear then you might have users wondering what the action of those filters is or even if they are filters.

Taking your above example,assuming one of your filter is to filter by age. If I dont see a descriptive text above, I could so easily assume that that its just a dropdown and would not know that the end result until I actually play with the content.Hence you would potentially confuse your users if they are not sure about the end result.

The same case applies for your search as search can be both local and global(across the site). If you dont explicitly call out that you are searching within the specific subset of data, you can lead to confusion about the scope of the search and incorrect assumptions which ruins the experience.

I recommend looking at this article Why labels matter which has this to say :

Descriptive labels lead to clear expectations. In the example of the prospective buyer on your website, a lucid description removes (at a minimum) one less hurdle your buyer has to navigate. Remove as many hurdles as you can and the likelihood of you making a sale goes up.

2
  • The select boxes and the search box is placed in a sidebar next to the list of results.
    – naf
    Nov 15, 2012 at 20:45
  • 1
    Agreed but you do still need to provide context about those filters since people might not always make the relation between the data and the filters
    – Mervin
    Nov 15, 2012 at 20:49

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.