E-mail List Archives
Thread: tabs vs windows
Number of posts in this thread: 19 (In chronological order)
From: Lijewski, Lolly M (DHS)
Date: Tue, Aug 19 2014 8:25AM
Subject: tabs vs windows
No previous message | Next message →
Hello,
In my last post I asked about opening of windows, but in some browsers, tabs open. So the question is the same, what are the best practices when content opens in a new tab or window?
Thanks,
Lolly
Lolly Lijewski
Disability Services Division
Minnesota Department of Human Services
Work Phone: (651) 431-3218
Fax: (651) 431-7411
Email: = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >
Building Address:
540 Cedar Street
St. Paul Minnesota 55155
Mailing Address:
PO Box 64967
St. Paul Minnesota 55164-0967
Caution: This e-mail and attached documents, if any, may contain information that is protected by state or federal law. E-mail containing private or protected information should not be sent over a public (non-secure) Internet unless it is encrypted pursuant to DHS standards. This e-mail should be forwarded only on a strictly need-to-know basis. If you are not the intended recipient, please: (1) notify the sender immediately, (2) do not forward the message, (3) do not print the message and (4) erase the message from your system
From: Paul J. Adam
Date: Tue, Aug 19 2014 8:31AM
Subject: Re: tabs vs windows
← Previous message | Next message →
Best practice is to warn all users, sighted and screen reader, to the presence of those new window links or file types links.
Simple way to do that is to use a graphical icon for new windows, external links, PDF, doc, xls, etc. so visual users know what it is before clicking on the link and provide a text alternative for those icons so screen reader uses get the same info.
Paul J. Adam
Accessibility Evangelist
www.deque.com
On Aug 19, 2014, at 9:25 AM, Lijewski, Lolly M (DHS) < = EMAIL ADDRESS REMOVED = > wrote:
> Hello,
>
> In my last post I asked about opening of windows, but in some browsers, tabs open. So the question is the same, what are the best practices when content opens in a new tab or window?
>
> Thanks,
> Lolly
>
>
> Lolly Lijewski
> Disability Services Division
> Minnesota Department of Human Services
> Work Phone: (651) 431-3218
> Fax: (651) 431-7411
> Email: = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >
>
> Building Address:
> 540 Cedar Street
> St. Paul Minnesota 55155
>
> Mailing Address:
> PO Box 64967
> St. Paul Minnesota 55164-0967
>
> Caution: This e-mail and attached documents, if any, may contain information that is protected by state or federal law. E-mail containing private or protected information should not be sent over a public (non-secure) Internet unless it is encrypted pursuant to DHS standards. This e-mail should be forwarded only on a strictly need-to-know basis. If you are not the intended recipient, please: (1) notify the sender immediately, (2) do not forward the message, (3) do not print the message and (4) erase the message from your system
>
>
>
>
>
> > >
From: deborah.kaplan
Date: Tue, Aug 19 2014 8:46AM
Subject: Re: tabs vs windows
← Previous message | Next message →
it's weird that there is not established best practice for opening
a javascript modal dialog box. Given how inaccessibly the majority of
them are coded, I would love to know before I click a link if it's going to
bring one of those up. From a usability point of view, they aren't
substantially different from a new tab (except that they are often coded
much worse).
Deborah
On Tue, 19 Aug 2014, Paul J. Adam wrote:
> Best practice is to warn all users, sighted and screen reader, to the presence of those new window links or file types links.
>
> Simple way to do that is to use a graphical icon for new windows, external links, PDF, doc, xls, etc. so visual users know what it is before clicking on the link and provide a text alternative for those icons so screen reader uses get the same info.
>
> Paul J. Adam
> Accessibility Evangelist
> www.deque.com
>
> On Aug 19, 2014, at 9:25 AM, Lijewski, Lolly M (DHS) < = EMAIL ADDRESS REMOVED = > wrote:
>
>> Hello,
>>
>> In my last post I asked about opening of windows, but in some browsers, tabs open. So the question is the same, what are the best practices when content opens in a new tab or window?
>>
>> Thanks,
>> Lolly
>>
>>
>> Lolly Lijewski
>> Disability Services Division
>> Minnesota Department of Human Services
>> Work Phone: (651) 431-3218
>> Fax: (651) 431-7411
>> Email: = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >
>>
>> Building Address:
>> 540 Cedar Street
>> St. Paul Minnesota 55155
>>
>> Mailing Address:
>> PO Box 64967
>> St. Paul Minnesota 55164-0967
>>
>> Caution: This e-mail and attached documents, if any, may contain information that is protected by state or federal law. E-mail containing private or protected information should not be sent over a public (non-secure) Internet unless it is encrypted pursuant to DHS standards. This e-mail should be forwarded only on a strictly need-to-know basis. If you are not the intended recipient, please: (1) notify the sender immediately, (2) do not forward the message, (3) do not print the message and (4) erase the message from your system
>>
>>
>>
>>
>>
>> >> >> >
> > > >
>
--
From: Paul J. Adam
Date: Tue, Aug 19 2014 8:51AM
Subject: Re: tabs vs windows
← Previous message | Next message →
I agree that there should be an indication for all new windows including modals, light boxes, pop-over dialogs, etc.
Also for expanding and collapsing content.
This is even more important for screen reader users to know the the presence of these dynamic widgets than to know about the new window link indicators because the screen reader informs them when a new window opens but that does not happen with JavaScript widgets.
Paul J. Adam
Accessibility Evangelist
www.deque.com
On Aug 19, 2014, at 9:46 AM, = EMAIL ADDRESS REMOVED = wrote:
> it's weird that there is not established best practice for opening
> a javascript modal dialog box. Given how inaccessibly the majority of
> them are coded, I would love to know before I click a link if it's going to
> bring one of those up. From a usability point of view, they aren't
> substantially different from a new tab (except that they are often coded
> much worse).
>
> Deborah
>
> On Tue, 19 Aug 2014, Paul J. Adam wrote:
>
>> Best practice is to warn all users, sighted and screen reader, to the presence of those new window links or file types links.
>>
>> Simple way to do that is to use a graphical icon for new windows, external links, PDF, doc, xls, etc. so visual users know what it is before clicking on the link and provide a text alternative for those icons so screen reader uses get the same info.
>>
>> Paul J. Adam
>> Accessibility Evangelist
>> www.deque.com
>>
>> On Aug 19, 2014, at 9:25 AM, Lijewski, Lolly M (DHS) < = EMAIL ADDRESS REMOVED = > wrote:
>>
>>> Hello,
>>>
>>> In my last post I asked about opening of windows, but in some browsers, tabs open. So the question is the same, what are the best practices when content opens in a new tab or window?
>>>
>>> Thanks,
>>> Lolly
>>>
>>>
>>> Lolly Lijewski
>>> Disability Services Division
>>> Minnesota Department of Human Services
>>> Work Phone: (651) 431-3218
>>> Fax: (651) 431-7411
>>> Email: = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >
>>>
>>> Building Address:
>>> 540 Cedar Street
>>> St. Paul Minnesota 55155
>>>
>>> Mailing Address:
>>> PO Box 64967
>>> St. Paul Minnesota 55164-0967
>>>
>>> Caution: This e-mail and attached documents, if any, may contain information that is protected by state or federal law. E-mail containing private or protected information should not be sent over a public (non-secure) Internet unless it is encrypted pursuant to DHS standards. This e-mail should be forwarded only on a strictly need-to-know basis. If you are not the intended recipient, please: (1) notify the sender immediately, (2) do not forward the message, (3) do not print the message and (4) erase the message from your system
>>>
>>>
>>>
>>>
>>>
>>> >>> >>> >>
>> >> >> >>
>>
>
> --
> > >
From: Angela French
Date: Tue, Aug 19 2014 9:23AM
Subject: Re: tabs vs windows
← Previous message | Next message →
Paul, I would be interested in seeing an icon that indicates a new window. Could you provide a URL to one?
Angela French
From: Greg Gamble
Date: Tue, Aug 19 2014 9:26AM
Subject: Re: tabs vs windows
← Previous message | Next message →
Won't the tag ARIA role=dialog tell a browser if a modal opens up?
Greg
From: Paul J. Adam
Date: Tue, Aug 19 2014 9:30AM
Subject: Re: tabs vs windows
← Previous message | Next message →
There's tons to choose from! They mostly look similar, generally many have either an arrow pointing out of a box or a box overlaid on a box underneath to represent 2 windows.
<http://stackoverflow.com/questions/1899772/new-window-icon-for-web-accessibility>;
<http://webaim.org/techniques/hypertext/hypertext_links#new_windowz>;
Paul J. Adam
Accessibility Evangelist
www.deque.com
On Aug 19, 2014, at 10:23 AM, Angela French < = EMAIL ADDRESS REMOVED = > wrote:
> Paul, I would be interested in seeing an icon that indicates a new window. Could you provide a URL to one?
>
> Angela French
>
>
From: Paul J. Adam
Date: Tue, Aug 19 2014 9:33AM
Subject: Re: tabs vs windows
← Previous message | Next message →
Only if the user's screen reader fully supports ARIA dialog roles. VoiceOver for iOS does NOT announce the dialog or its accessible name but VO for OS X does.
NVDA and JAWS handle this correctly I think.
Not all dialogs actually use role=dialog, the application role also causes problems so it is sometimes avoided. You don't "need" a role=dialog if you trap the users focus correctly and give them a warning.
Paul J. Adam
Accessibility Evangelist
www.deque.com
On Aug 19, 2014, at 10:26 AM, Greg Gamble < = EMAIL ADDRESS REMOVED = > wrote:
> Won't the tag ARIA role=dialog tell a browser if a modal opens up?
>
>
> Greg
>
>
From: Angela French
Date: Tue, Aug 19 2014 9:36AM
Subject: Re: tabs vs windows
← Previous message | Next message →
Thanks Paul, while I'm familiar with the various ones for external links, I guess I've never really noticed, or thought about the new window icons. I just click 'em open!
From: deborah.kaplan
Date: Tue, Aug 19 2014 9:38AM
Subject: Re: tabs vs windows
← Previous message | Next message →
That doesn't help keyboard/speech recognition users, though, because they
still have no visible indicator.
A lot of the problems with modals/lightboxes/etc. are screen reader-based,
with the code not having the appropriate ARIA to report that the JavaScript
dialog is now open. But many of them are problems for keyboard users,
people with small viewports such as mobile devices, and mouse/touchscreen
users who have trouble hitting small controls, so those users would also
like to know if a link is going to open up a modal.
(All of those problems are easily fixable, of course.
* Make sure no JavaScript windows take up more than 100% of the current viewport
* Make several methods of exiting the dialog, such as hitting Escape or
clicking/tapping outside of the dialog, and not just a small and hard to
see "X" in the top right corner.
* Make the keyboard focus start at the beginning of the dialog, and -- with
very rare exceptions -- trap the keyboard focus in the JS dialog.
* And of course, have the appropriate WAI-ARIA to report the new screen to
screen reader users.
But the fact is even sites that theoretically carry about accessibility
don't tend to bother to do all of these things.)
Deborah Kaplan
On Tue, 19 Aug 2014, Greg Gamble wrote:
> Won't the tag ARIA role=dialog tell a browser if a modal opens up?
>
>
> Greg
>
>
From: Greg Gamble
Date: Tue, Aug 19 2014 9:46AM
Subject: Re: tabs vs windows
← Previous message | Next message →
Deborah ... what would you need to be aware of a modal trying to open?
I'd think just the modal showing would be enough, unless you're talking about the format/size of the modal?
And I agree 100% on the bulleted list ... and see most newer or at least updated modal frameworks getting better, as far as closing and focus.
Greg
From: deborah.kaplan
Date: Tue, Aug 19 2014 9:53AM
Subject: Re: tabs vs windows
← Previous message | Next message →
Well, one answer would be why would you need to be aware of a new window or
new tab trying to open? The answer is exactly the same as for modals --
something unexpected is going to happen and you want to know about it so
you can avoid it or control it appropriately.
In my case as a voice/keyboard user it's because if I knew a link would
open a modal there's a chance I would avoid the link, because many modals
are difficult to exit without a mouse. But again, there's no usability
distinction between wanting to know a modal is opening and wanting to know
a new tab/new window is opening. Your browser is going to do something
unexpected if you click a link, so it would be nice to be warned.
Deborah Kaplan
On Tue, 19 Aug 2014, Greg Gamble wrote:
> Deborah ... what would you need to be aware of a modal trying to open?
> I'd think just the modal showing would be enough, unless you're talking about the format/size of the modal?
>
> And I agree 100% on the bulleted list ... and see most newer or at least updated modal frameworks getting better, as far as closing and focus.
>
>
> Greg
>
>
>
From: Wee, Kim (MNIT)
Date: Tue, Aug 19 2014 11:26AM
Subject: Re: tabs vs windows
← Previous message | Next message →
I agree - the graphical icon for new windows, external links, PDF, etc. works great for visual users and by adding text alternative works also for screen readers - but, when I tested this technique and made the graphic part of the link (not separate from the link text, which is what you should do in order to not have duplicate links read to the screen reader), the alternate text was not read by the screen reader.
KIM WEE | WEBMASTER AND ACCESSIBILITY COORDINATOR
MN.IT SERVICES @ EDUCATION
651-582-8548 (w) | = EMAIL ADDRESS REMOVED =
Information Technology for Minnesota Government | mn.gov/mnit
From: Sean Curtis
Date: Tue, Aug 19 2014 1:43PM
Subject: Re: tabs vs windows
← Previous message | Next message →
What about aria-haspopup?
Cheers,
Sean
> On 20 Aug 2014, at 3:26 am, "Wee, Kim (MNIT)" < = EMAIL ADDRESS REMOVED = > wrote:
>
> I agree - the graphical icon for new windows, external links, PDF, etc. works great for visual users and by adding text alternative works also for screen readers - but, when I tested this technique and made the graphic part of the link (not separate from the link text, which is what you should do in order to not have duplicate links read to the screen reader), the alternate text was not read by the screen reader.
>
> KIM WEE | WEBMASTER AND ACCESSIBILITY COORDINATOR
> MN.IT SERVICES @ EDUCATION
> 651-582-8548 (w) | = EMAIL ADDRESS REMOVED =
>
> Information Technology for Minnesota Government | mn.gov/mnit
>
>
>
From: Ryan E. Benson
Date: Tue, Aug 19 2014 1:52PM
Subject: Re: tabs vs windows
← Previous message | Next message →
aria-haspopup (property)Indicates that the element
<http://www.w3.org/TR/wai-aria/terms#def_element>; has a popup context menu
or sub-level menu.
This means that activation renders conditional content. Note that ordinary
tooltips are not considered popups in this context.
A popup is generally presented visually as a group of items that appears to
be on top of the main page content.
--
Ryan E. Benson
On Tue, Aug 19, 2014 at 3:43 PM, Sean Curtis < = EMAIL ADDRESS REMOVED = > wrote:
> What about aria-haspopup?
>
> Cheers,
>
> Sean
>
> > On 20 Aug 2014, at 3:26 am, "Wee, Kim (MNIT)" < = EMAIL ADDRESS REMOVED = >
> wrote:
> >
> > I agree - the graphical icon for new windows, external links, PDF, etc.
> works great for visual users and by adding text alternative works also for
> screen readers - but, when I tested this technique and made the graphic
> part of the link (not separate from the link text, which is what you should
> do in order to not have duplicate links read to the screen reader), the
> alternate text was not read by the screen reader.
> >
> > KIM WEE | WEBMASTER AND ACCESSIBILITY COORDINATOR
> > MN.IT SERVICES @ EDUCATION
> > 651-582-8548 (w) | = EMAIL ADDRESS REMOVED =
> >
> > Information Technology for Minnesota Government | mn.gov/mnit
> >
> >
> >
From: Sean Curtis
Date: Tue, Aug 19 2014 2:19PM
Subject: Re: tabs vs windows
← Previous message | Next message →
Ah right. Well the original question was about new tabs or windows. I'm guessing that just specifying target="_blank" should be enough for screen readers. I'd still use this even if launching the new window is done via JS provided it helps screen readers announce things better.
Cheers,
Sean
> On 20 Aug 2014, at 5:52 am, "Ryan E. Benson" < = EMAIL ADDRESS REMOVED = > wrote:
>
> aria-haspopup (property)Indicates that the element
> <http://www.w3.org/TR/wai-aria/terms#def_element>; has a popup context menu
> or sub-level menu.
>
> This means that activation renders conditional content. Note that ordinary
> tooltips are not considered popups in this context.
>
> A popup is generally presented visually as a group of items that appears to
> be on top of the main page content.
>
> --
> Ryan E. Benson
>
>
>> On Tue, Aug 19, 2014 at 3:43 PM, Sean Curtis < = EMAIL ADDRESS REMOVED = > wrote:
>>
>> What about aria-haspopup?
>>
>> Cheers,
>>
>> Sean
>>
>>>> On 20 Aug 2014, at 3:26 am, "Wee, Kim (MNIT)" < = EMAIL ADDRESS REMOVED = >
>>> wrote:
>>>
>>> I agree - the graphical icon for new windows, external links, PDF, etc.
>> works great for visual users and by adding text alternative works also for
>> screen readers - but, when I tested this technique and made the graphic
>> part of the link (not separate from the link text, which is what you should
>> do in order to not have duplicate links read to the screen reader), the
>> alternate text was not read by the screen reader.
>>>
>>> KIM WEE | WEBMASTER AND ACCESSIBILITY COORDINATOR
>>> MN.IT SERVICES @ EDUCATION
>>> 651-582-8548 (w) | = EMAIL ADDRESS REMOVED =
>>>
>>> Information Technology for Minnesota Government | mn.gov/mnit
>>>
>>>
>>>
From: Birkir R. Gunnarsson
Date: Tue, Aug 19 2014 4:19PM
Subject: Re: tabs vs windows
← Previous message | Next message →
Hi
<a href="#" target="_blank"><img src="newwindow.jpg" alt="opens in new
window">My Link</a>
should work in most screen readers.
Keep in mind that often these types of icon images are coded as CSS
.background images and for those alt or title texts do not get
communicated to assistive technologies such as screen readers.
For those a work around needs to be devices such as using the title
tag of the link
<a title="opens in new window" target="_blank" href="#"
class="backgroundicon">MyLink</a>
This works with most assistive technologies, but only when the link
receives keyboard focus (when you navigate using the browse mode in
screen readers the title attribute is usually not announced).
role="dialog" or "alertdialog" is used on the dialog itself, not on
the triggering element, so even the most appropriately coded ARIA will
not notify end user of this until the dialog has been triggered.
a property such as aria-hasdialog would be useful in this case, but
also if the dialogs are correctly coded it is another desired vs.
required feature, like warning a user when a link opens in a new tab
or window.
It is important not to use aria-haspopup on a regular dialog.
Inconsistent use of aria widgets, even when well intensioned, is one
of the reasons ARIA is not more widely supported or understood by end
user (that is my experience from personally working with end users,
not a scientific fact backed up by academic research).
Cheers
-Birkir
On 8/19/14, Sean Curtis < = EMAIL ADDRESS REMOVED = > wrote:
> Ah right. Well the original question was about new tabs or windows. I'm
> guessing that just specifying target="_blank" should be enough for screen
> readers. I'd still use this even if launching the new window is done via JS
> provided it helps screen readers announce things better.
>
> Cheers,
>
> Sean
>
>> On 20 Aug 2014, at 5:52 am, "Ryan E. Benson" < = EMAIL ADDRESS REMOVED = >
>> wrote:
>>
>> aria-haspopup (property)Indicates that the element
>> <http://www.w3.org/TR/wai-aria/terms#def_element>; has a popup context
>> menu
>> or sub-level menu.
>>
>> This means that activation renders conditional content. Note that
>> ordinary
>> tooltips are not considered popups in this context.
>>
>> A popup is generally presented visually as a group of items that appears
>> to
>> be on top of the main page content.
>>
>> --
>> Ryan E. Benson
>>
>>
>>> On Tue, Aug 19, 2014 at 3:43 PM, Sean Curtis < = EMAIL ADDRESS REMOVED = >
>>> wrote:
>>>
>>> What about aria-haspopup?
>>>
>>> Cheers,
>>>
>>> Sean
>>>
>>>>> On 20 Aug 2014, at 3:26 am, "Wee, Kim (MNIT)" < = EMAIL ADDRESS REMOVED = >
>>>> wrote:
>>>>
>>>> I agree - the graphical icon for new windows, external links, PDF, etc.
>>> works great for visual users and by adding text alternative works also
>>> for
>>> screen readers - but, when I tested this technique and made the graphic
>>> part of the link (not separate from the link text, which is what you
>>> should
>>> do in order to not have duplicate links read to the screen reader), the
>>> alternate text was not read by the screen reader.
>>>>
>>>> KIM WEE | WEBMASTER AND ACCESSIBILITY COORDINATOR
>>>> MN.IT SERVICES @ EDUCATION
>>>> 651-582-8548 (w) | = EMAIL ADDRESS REMOVED =
>>>>
>>>> Information Technology for Minnesota Government | mn.gov/mnit
>>>>
>>>>
>>>>
From: Mallory van Achterberg
Date: Wed, Aug 20 2014 4:03AM
Subject: Re: tabs vs windows
← Previous message | Next message →
Wikipedia has used these icons for a while now as well.
On Tue, Aug 19, 2014 at 03:36:39PM +0000, Angela French wrote:
> Thanks Paul, while I'm familiar with the various ones for external links, I guess I've never really noticed, or thought about the new window icons. I just click 'em open!
>
>
From: Mallory van Achterberg
Date: Wed, Aug 20 2014 4:11AM
Subject: Re: tabs vs windows
← Previous message | No next message
I like hidden (offscreen) text in a span stating new windows/tabs
combined with css looking at the end of the URL (href$='pdf') to
provide a visual icon.
I tend to add it to the end though because when I'm skimming links
I might only see or hear the first few words of it before checking
out the next one.
because I am a lazy user :P
...and if I'm "reading" with a mouse (using it like a finger to hold
my place) I hate hate hate title tooltips, even when it's got actual
useful text as in Birkir's example (99% of the time title have 0
useful info). Plus touch-interface+tooltips suck, no hoverz.
-Mallory
On Tue, Aug 19, 2014 at 06:19:30PM -0400, Birkir R. Gunnarsson wrote:
> Hi
>
> <a href="#" target="_blank"><img src="newwindow.jpg" alt="opens in new
> window">My Link</a>
> should work in most screen readers.
> Keep in mind that often these types of icon images are coded as CSS
> .background images and for those alt or title texts do not get
> communicated to assistive technologies such as screen readers.
> For those a work around needs to be devices such as using the title
> tag of the link
> <a title="opens in new window" target="_blank" href="#"
> class="backgroundicon">MyLink</a>
> This works with most assistive technologies, but only when the link
> receives keyboard focus (when you navigate using the browse mode in
> screen readers the title attribute is usually not announced).
> role="dialog" or "alertdialog" is used on the dialog itself, not on
> the triggering element, so even the most appropriately coded ARIA will
> not notify end user of this until the dialog has been triggered.
> a property such as aria-hasdialog would be useful in this case, but
> also if the dialogs are correctly coded it is another desired vs.
> required feature, like warning a user when a link opens in a new tab
> or window.
>
> It is important not to use aria-haspopup on a regular dialog.
> Inconsistent use of aria widgets, even when well intensioned, is one
> of the reasons ARIA is not more widely supported or understood by end
> user (that is my experience from personally working with end users,
> not a scientific fact backed up by academic research).
> Cheers
> -Birkir