W3C home > Mailing lists > Public > public-cognitive-a11y-tf@w3.org > August 2015

Re: Hamburger menu (was Re: technique to include security)

From: Steve Lee <steve@opendirective.com>
Date: Tue, 18 Aug 2015 13:43:52 +0100
Message-ID: <CAEsWMvRWZGp-DENgZbVU5qAM_tUTwo9bq_8TQxWBjW2jrEyK_w@mail.gmail.com>
To: "Rochford, John" <john.rochford@umassmed.edu>
Cc: Jamie Knight <Jamie.Knight@bbc.co.uk>, public-cognitive-a11y-tf <public-cognitive-a11y-tf@w3.org>
Well said!

I think hamberger = more things is the common use and best understanding
possible.

I hope in general that good design will give clear, easily recognised
affordances for important stuff for the particular app.


Steve Lee
OpenDirective http://opendirective.com

On 18 August 2015 at 13:13, Rochford, John <john.rochford@umassmed.edu>
wrote:

> Jamie and All,
>
>
>
> The points Jamie made are great ones, and ones I support.
>
>
>
> John
>
>
>
> John Rochford <http://profiles.umassmed.edu/profiles/display/132901>
>
> UMass Medical School/E.K. Shriver Center
>
> Director, INDEX Program
>
> Instructor, Family Medicine & Community Health
>
> www.DisabilityInfo.org <http://www.disabilityinfo.org/>
>
> Twitter: @ClearHelper <http://twitter.com/ClearHelper>
>
> [image: Facebook Button]
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>[image:
> Twitter Button] <https://twitter.com/NEINDEX> [image: WordPress Logo]
> <http://www.disabilityinfo.org/blog/>
>
>
>
> *From:* Jamie Knight [mailto:Jamie.Knight@bbc.co.uk]
> *Sent:* Tuesday, August 18, 2015 8:06 AM
> *To:* EA Draffan
> *Cc:* Steve Lee; Rochford, John; public-cognitive-a11y-tf; lisa. seeman
> *Subject:* Hamburger menu (was Re: technique to include security)
>
>
>
> Hiya.
>
>
>
> The hamburger menu and it's three vertical dots friend 'the kebab menu'
> are not new at all.
>
>
>
> We tested them a few years ago at the BBC. I don't remember the details,
> but I can remember the main take away being that explicit menu names were
> better. I don't remember how strongly that was found to be.
>
>
>
> linked to memory load for making objects actions and options visible
>
>
>
> I disagree at this point. Putting everything on the page also tests badly.
>
>
>
> As screen space drops, the art is putting the right objects visible on the
> page and hiding those who are less important.
>
>
>
> A blanket declaration that hiding menus behind iconography is a bit blunt,
> I don't think object memory is the difficulty here.
>
>
>
> To play devils advocate, all emerging affordances and conventions have to
> emerge. Hamburger menus are used across the web and within native mobile
> apps. In this regard they are very consistent.
>
>
>
> I would hazard that for many users (myself included) consistency of an
> icon to mean 'more things' is actually less overload than trying to figure
> out what the term picked actually means on each and every website. Three
> bars is much easier than interpreting 'more', 'menu', 'all", "..." The
> other myriad things people use as menu button labels.
>
>
>
> In memory term, I remember one thing (3 lines means more thins) rather
> than having to try and remember the wording used on each and every site I
> visit.
>
>
>
> In my mind consistency and convention lead to affordances and we have to
> be careful not to be too alarmed as new conventions arise.
>
>
>
> We don't use the hamburger menu right now at the BBC. But I am sure we
> will test it again soon and see what happens.
>
>
>
> I suspect we will see an inflection point. Where more users know what it
> means than those who do not. When that point is I don't know.
>
>
>
> My final thought is that the hamburger menu is a convention from the
> mobile world. As more and more users use the web on mobile first we may
> find that the demographics start to make a big difference. For example
> younger users, or poorer users (who only have access to the web on mobile)
> are the first to understand the convention.
>
>
>
> Sorry that for a bit long! Quite a digression! Will change the subject to
> help with the threading.
>
>
>
> Jamie + Lion
>
>
> On 18 Aug 2015, at 12:42, EA Draffan <ead@ecs.soton.ac.uk> wrote:
>
> I agree and interestingly Jakob Nielsen has just come out with some new
> guidance about those three lines that we now see as menu items for
> responsively designed sites – this is also linked to memory load for making
> objects actions and options visible in this case the fact that you lose the
> main menu system and are presented with what he calls a ‘hamburger menu’.
> http://tinyurl.com/nreydpa
>
>
>
> Best wishes
>
> E.A.
>
>
>
> Mrs E.A. Draffan
>
> WAIS, ECS , University of Southampton
>
> Mobile +44 (0)7976 289103
>
> http://access.ecs.soton.ac.uk
>
> UK AAATE rep http://www.aaate.net/
>
> http://www.emptech.info
>
>
>
> *From:* Steve Lee [mailto:steve@opendirective.com
> <steve@opendirective.com>]
> *Sent:* 18 August 2015 12:04
> *To:* John Rochford
> *Cc:* public-cognitive-a11y-tf; lisa. seeman
> *Subject:* RE: technique to include security
>
>
>
> That's very good
>
> Steve Lee
> Sent from my mobile device Please excuse typing errors
>
> On 18 Aug 2015 11:58, "Rochford, John" <john.rochford@umassmed.edu> wrote:
>
> Hi Lisa,
>
>
>
> My second impression about this approach is that it could be combined with
> recommendations for what developers **should** do.
>
>
>
> Example:
>
> “Minimize the user’s memory load by making objects, actions, and options
> visible. The user should not have to remember information from one part of
> the dialogue to another. Instructions for use of the system should be
> visible or easily retrievable whenever appropriate.”
>
>
>
> Reference: Neilson 10 Principles at
> http://www.expressiveproductdesign.com/nielsens-10-usability-heuristics-user-interface-design/
> , provided by Steve Lee to our list serve on 8/14.
>
>
>
> John
>
>
>
> John Rochford <http://profiles.umassmed.edu/profiles/display/132901>
> UMass Medical School/E.K. Shriver Center
> Director, INDEX Program
> Instructor, Family Medicine & Community Health
> www.DisabilityInfo.org
> Twitter: @ClearHelper <https://twitter.com/clearhelper>
>
>
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>
>
>
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>
>
>
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>
>
>
>
>
> *From: Rochford, John Sent: Tuesday, August 18, 2015 6:48 AM To:
> 'lisa.seeman' <lisa.seeman@zoho.com>; public-cognitive-a11y-tf
> <public-cognitive-a11y-tf@w3.org> Subject: RE: technique to include
> security
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
>
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>
>
> Hi Lisa,
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>
>
>
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>
>
> My first impression about this approach is that it does not provide
> developers any recommendations about what they **should** do, which is
> the optimal approach.
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>
>
>
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>
>
> John
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>
>
>
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>
>
>
>
>
>
>
> *John Rochford UMass Medical School/E.K. Shriver Center Director, INDEX
> Program Instructor, Family Medicine & Community Health
> www.DisabilityInfo.org Twitter: @ClearHelper
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
>
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>
>
> *
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
>
>
>
> *From: lisa.seeman [mailto:lisa.seeman@zoho.com] Sent: Tuesday, August 18,
> 2015 6:02 AM To: public-cognitive-a11y-tf <public-cognitive-a11y-tf@w3.org>
> Subject: technique to include security
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *Hi
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *I was thinking of the following technique as a way to include security
> and other considerations
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *"Do not require cognitive abilities when it is  avoidable"
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *In security this may include:
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *Requiring that the user has a good working memory or short term memory
> required to copy a code
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *Requiring that the user can remember complex passwords
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *Requiring that the user can remeber spelling of terms used in security
> questions such as how to spell a strange pets name
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *Requiring that the user can remember visual patterns
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *Having tokans, signing in via email account or face book, or biometrics
> are all alternatives to the above
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *In voice  systems this may include,
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *?       Requiring the user to understand categories,
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *?       Requiring the user to remember numbers
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *?       can all be used as a barrier to getting human help
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *is is aviodable by having 0 as a reserved digit to access a human
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *In the Web of things this may include:
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
>    1. *remembering what symbols mean
>    <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>    2. *remembering sequences to run certain tasks
>    <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *This is aviodable by having simple text with symbols and
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *clear discovrability of how o complete each task
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *and recovrability from errors
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
> *
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
>
>
>
>
>
> *All the best Lisa Seeman Athena ICT Accessibility Projects LinkedIn,
> Twitter
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>*
>
>
> <http://www.facebook.com/pages/New-England-INDEXShriver-CenterUMass-Medical-School/227064920160>
>
>
>
>
>
> ----------------------------
>
> http://www.bbc.co.uk
> This e-mail (and any attachments) is confidential and may contain personal
> views which are not the views of the BBC unless specifically stated.
> If you have received it in error, please delete it from your system.
> Do not use, copy or disclose the information in any way nor act in
> reliance on it and notify the sender immediately.
> Please note that the BBC monitors e-mails sent or received.
> Further communication will signify your consent to this.
>
> ---------------------
>
Received on Tuesday, 18 August 2015 12:44:22 UTC

This archive was generated by hypermail 2.4.0 : Friday, 17 January 2020 19:13:28 UTC