E-mail List Archives

Search E-mail List Archives for

Number of posts in this thread: 3 (In chronological order)

From: K Barcham
Date: Sun, Nov 17 2019 5:02PM
Subject: Search fields hidden behind button
No previous message | Next message →

I've been asked to feedback on a site prototype with a search that makes me
wary.
The designer has 'hidden' the search input field behind the search button
(a magnifying glass icon/button).
In order to search, the user has to click on the magnifying glass before
the search field appears as the form field and magnifying glass button.
This doesn't feel like good usability but I'm also wondering if there are
any obvious accessibility issues doing it this way.

Katherine

From: Patrick H. Lauke
Date: Sun, Nov 17 2019 5:06PM
Subject: Re: Search fields hidden behind button
← Previous message | Next message →

On 18/11/2019 00:02, K Barcham wrote:
> I've been asked to feedback on a site prototype with a search that makes me
> wary.
> The designer has 'hidden' the search input field behind the search button
> (a magnifying glass icon/button).
> In order to search, the user has to click on the magnifying glass before
> the search field appears as the form field and magnifying glass button.
> This doesn't feel like good usability but I'm also wondering if there are
> any obvious accessibility issues doing it this way.

As long as this is implemented in a reasonable way - the magnifying
button acts as a disclosure widget (with aria-expanded="..." to reflect
its state), or even as a simple button control with a clear label (e.g.
"Search" or "Open search" or similar would likely do it) that, when
activated, sets focus directly to the search text input - it should be
ok. Of course, there are many ways in which this can be messed up :)

P
--
Patrick H. Lauke

www.splintered.co.uk | https://github.com/patrickhlauke
http://flickr.com/photos/redux/ | http://redux.deviantart.com
twitter: @patrick_h_lauke | skype: patrick_h_lauke

From: Birkir R. Gunnarsson
Date: Sun, Nov 17 2019 6:07PM
Subject: Re: Search fields hidden behind button
← Previous message | No next message

Technically this is fine. We've found in usability studies that screen
reader users always try to look for a search input directly on the
page and can get confused when they don't find it, but that's an AX
(accessible experience) category, not a WCAG violation (as Patrick
said, provided you quote the search input popup properly).
We do this for http://www.bbt.com



On 11/17/19, Patrick H. Lauke < = EMAIL ADDRESS REMOVED = > wrote:
> On 18/11/2019 00:02, K Barcham wrote:
>> I've been asked to feedback on a site prototype with a search that makes
>> me
>> wary.
>> The designer has 'hidden' the search input field behind the search button
>> (a magnifying glass icon/button).
>> In order to search, the user has to click on the magnifying glass before
>> the search field appears as the form field and magnifying glass button.
>> This doesn't feel like good usability but I'm also wondering if there are
>> any obvious accessibility issues doing it this way.
>
> As long as this is implemented in a reasonable way - the magnifying
> button acts as a disclosure widget (with aria-expanded="..." to reflect
> its state), or even as a simple button control with a clear label (e.g.
> "Search" or "Open search" or similar would likely do it) that, when
> activated, sets focus directly to the search text input - it should be
> ok. Of course, there are many ways in which this can be messed up :)
>
> P
> --
> Patrick H. Lauke
>
> www.splintered.co.uk | https://github.com/patrickhlauke
> http://flickr.com/photos/redux/ | http://redux.deviantart.com
> twitter: @patrick_h_lauke | skype: patrick_h_lauke
> > > > >


--
Work hard. Have fun. Make history.