E-mail List Archives

You are here: Home > Community > E-mail List Archives > View Thread

Thread: Consistent Navigation when switching between layouts

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

From: Steve Green
Date: Wed, Sep 13 2023 2:48PM
Subject: Consistent Navigation when switching between layouts
No previous message | Next message →

I am testing a website that has two menus at the top of the page. One is a small utility menu containing three links. The other is the main menu. In the desktop layout, the utility menu is before the main menu, but in the mobile layout the main menu is first. Is this a violation of WCAG SC 3.2.3 (Consistent Navigation)?

It's certainly a real world problem because screen reader users tend not to pay attention to their browser window size, and they are confused when websites suddenly have different content or behave differently. For instance, a screen reader user recently told me he could not get a particular website to stop talking, and I found that it displayed an autorotating carousel in the mobile layout, but not in the desktop layout. Maximising the window was a simple fix, but not one the user could come up with by themselves.

My problem is that the client has a very tight launch schedule and is not going to want to change the design unless I can show it's a WCAG non-conformance. They are usually receptive to user experience improvements, but not on this project.

Steve Green
Managing Director
Test Partners Ltd

From: Kevin Prince
Date: Wed, Sep 13 2023 5:27PM
Subject: Re: Consistent Navigation when switching between layouts
← Previous message | Next message →

My reading of F.66 <a href=3D"https://ww=
w.w3.org/WAI/WCAG21/Techniques/failures/F66.html">https://www.w3.org/WAI/WC=
AG21/Techniques/failures/F66.html</a> is that it's not a failure as the 'de=
fault presentation of the navigation mechanism on each page to see if the l=
ist of links are in the same relative order on each Web page." 3.2.3 a=
pplies to a set of pages and it doesn't consider that page one might be at =
a different breakpoint (and specifically notes that it doesn't apply if &qu=
ot;a change is initiated by a user". I'd argue that it fails th=
e intent but not the letter though and push it strongly as being an issue.<=
br>Kevin <meta http-equiv=3D"Content-Type" content=3D"text/html; char=
set=3DUTF-8" />
<title></title>
<table border=3D"0" cellpadding=3D"0" cellspacing=3D"0" width=3D"100%">
<tbody>
<tr>
<td style=3D"font:14pt Calibri; color:#2846a8;">Kevin Prince </s=
trong></td>
</tr>
<tr>
<td style=3D"font:12pt Calibri; color:#2846a8;">Product Accessibility & =
Usability Consultant </td>
</tr>
<tr>
<td style=3D"1px solid #d2d2d2;"> </td>
</tr>
<tr>
<td style=3D"font:14pt Calibri; color:#5f5a59; padding-top: 5px; border-=
top: 1px solid #d2d2d2;">Foster Moore</td>
</tr>
<tr>
<td style=3D"font:10pt Calibri; color:#5f5a59;">A Teranet Company</td>
</tr>
<tr>
<td style=3D"font:10pt Calibri; color:#000000;"> </td>
</tr>
<tr>
<td style=3D"font:10pt Calibri; color:#000000;"></td>
</tr>
<tr>
<td style=3D"font:10pt Calibri; color:#000000;">E <a hr=
ef=3D"mailto: = EMAIL ADDRESS REMOVED = " style=3D"text-decoration:none;">=
= EMAIL ADDRESS REMOVED = </a></td>
</tr>
<tr>
<td style=3D"font:10pt Calibri; color:#000000;">Christchurch</td>
</tr>
<tr>
<td style=3D"font:10pt Calibri; padding-top: 10px; padding-bottom: 10px;=
"><a href=3D"http://www.fostermoore.com/" style=3D"color:#000000; t=
ext-decoration:none;">fostermoore.com</a></td>
</tr>
</tbody>
</table>
 -----Original Message----- From: WebAIM-Forum <webaim-forum-bounc=
= EMAIL ADDRESS REMOVED = > On Behalf Of Steve Green Sent: Thursday, Septembe=
r 14, 2023 8:49 AM To: = EMAIL ADDRESS REMOVED = Subject: [WebAIM]=
Consistent Navigation when switching between layouts CAUTION: This =
email originated from outside of the organization. I am testing =
a website that has two menus at the top of the page. One is a small utility=
menu containing three links. The other is the main menu. In the desktop la=
yout, the utility menu is before the main menu, but in the mobile layout th=
e main menu is first. Is this a violation of WCAG SC 3.2.3 (Consistent Navi=
gation)? It's certainly a real world problem because screen reader u=
sers tend not to pay attention to their browser window size, and they are c=
onfused when websites suddenly have different content or behave differently=
. For instance, a screen reader user recently told me he could not get a pa=
rticular website to stop talking, and I found that it displayed an autorota=
ting carousel in the mobile layout, but not in the desktop layout. Maximisi=
ng the window was a simple fix, but not one the user could come up with by =
themselves. My problem is that the client has a very tight launch sc=
hedule and is not going to want to change the design unless I can show it's=
a WCAG non-conformance. They are usually receptive to user experience impr=
ovements, but not on this project. Steve Green Managing Director<=
br>Test Partners Ltd ://list.webaim.org/</a> List archives at <a href=3D"http://webaim.org/di=
scussion/archives">http://webaim.org/discussion/archives<;/a> t messages to = EMAIL ADDRESS REMOVED =

From: Steve Green
Date: Wed, Sep 13 2023 5:44PM
Subject: Re: Consistent Navigation when switching between layouts
← Previous message | Next message →

Thanks Kevin,

That is my interpretation of it too, but I'm hoping someone can suggest a plausible way of interpreting it differently.

Steve

From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Kevin Prince
Sent: Thursday, September 14, 2023 12:28 AM
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] Consistent Navigation when switching between layouts

My reading of F.66 https://www.w3.org/WAI/WCAG21/Techniques/failures/F66.html is that it's not a failure as the 'default presentation of the navigation mechanism on each page to see if the list of links are in the same relative order on each Web page." 3.2.3 applies to a set of pages and it doesn't consider that page one might be at a different breakpoint (and specifically notes that it doesn't apply if "a change is initiated by a user".

I'd argue that it fails the intent but not the letter though and push it strongly as being an issue.
Kevin
Kevin Prince
Product Accessibility & Usability Consultant

Foster Moore
A Teranet Company

E = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >
Christchurch
fostermoore.com<http://www.fostermoore.com/>;

-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >> On Behalf Of Steve Green
Sent: Thursday, September 14, 2023 8:49 AM
To: = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >
Subject: [WebAIM] Consistent Navigation when switching between layouts

CAUTION: This email originated from outside of the organization.

I am testing a website that has two menus at the top of the page. One is a small utility menu containing three links. The other is the main menu. In the desktop layout, the utility menu is before the main menu, but in the mobile layout the main menu is first. Is this a violation of WCAG SC 3.2.3 (Consistent Navigation)?

It's certainly a real world problem because screen reader users tend not to pay attention to their browser window size, and they are confused when websites suddenly have different content or behave differently. For instance, a screen reader user recently told me he could not get a particular website to stop talking, and I found that it displayed an autorotating carousel in the mobile layout, but not in the desktop layout. Maximising the window was a simple fix, but not one the user could come up with by themselves.

My problem is that the client has a very tight launch schedule and is not going to want to change the design unless I can show it's a WCAG non-conformance. They are usually receptive to user experience improvements, but not on this project.

Steve Green
Managing Director
Test Partners Ltd

From: glen walker
Date: Wed, Sep 13 2023 6:19PM
Subject: Re: Consistent Navigation when switching between layouts
← Previous message | Next message →

I don't see it as a strict violation, albeit maybe not the best usability.
The guidelines says the navigation has to exist on "multiple Web pages
within a set of Web pages". If the same CSS breakpoint is used within the
set of webpages, then it doesn't fail. If you change your browser window
size or change your font size, causing a different breakpoint to be hit,
then the new breakpoint has its own "set of web pages" and is not related
to the previous set of web pages. The fact that the menu order is different
between the two sets is not a failure.

It might be possible that one page has a different CSS breakpoint defined
than the other pages, causing the menu to display differently, and in that
case I would fail it.

From: Geethavani.Shamanna
Date: Thu, Sep 14 2023 2:05AM
Subject: Re: Consistent Navigation when switching between layouts
← Previous message | No next message

As a screen reader user, I have often encountered this issue when testing websites, so much so that one of the first things I do before looking at a webpage these days is to maximise the browser window. Most screen reader users are however unaware that they are not accessing the desktop layout because of the size of their window.

-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Steve Green
Sent: 13 September 2023 21:49
To: = EMAIL ADDRESS REMOVED =
Subject: [WebAIM] Consistent Navigation when switching between layouts

External email: if the sender or content looks suspicious, please click the Report Message icon, or forward it to report-phishing @open.ac.uk

I am testing a website that has two menus at the top of the page. One is a small utility menu containing three links. The other is the main menu. In the desktop layout, the utility menu is before the main menu, but in the mobile layout the main menu is first. Is this a violation of WCAG SC 3.2.3 (Consistent Navigation)?

It's certainly a real world problem because screen reader users tend not to pay attention to their browser window size, and they are confused when websites suddenly have different content or behave differently. For instance, a screen reader user recently told me he could not get a particular website to stop talking, and I found that it displayed an autorotating carousel in the mobile layout, but not in the desktop layout. Maximising the window was a simple fix, but not one the user could come up with by themselves.

My problem is that the client has a very tight launch schedule and is not going to want to change the design unless I can show it's a WCAG non-conformance. They are usually receptive to user experience improvements, but not on this project.

Steve Green
Managing Director
Test Partners Ltd