TIL about opening windows

A presentation at Tech Talk @ Tagesspiegel in March 2021 in by Gunnar Bittersmann

Slide 1

Slide 1

TIL about opening windows Photo by Adrien Siami on Unsplash

Slide 2

Slide 2

<a href=”…” target=”_blank” rel=”noopener”>

Slide 3

Slide 3

“ Opening up new browser windows is like a vacuum cleaner sales person who starts a visit by emptying an ash tray on the customer’s carpet. Don’t pollute my screen with any more windows, thanks. — Jakob Nielsen, Top 10 Mistakes in Web Design, 2011

Slide 4

Slide 4

“ changes of context major changes in the content of the Web page that, if made without user awareness, can disorient users who are not able to view the entire page simultaneously Opening a new window, moving focus to a different component, going to a new page (including anything that would look to a user as if they had moved to a new page) or significantly re-arranging the content of a page are examples of changes of context. — Web Content Accessibility Guidelines (WCAG) 2.1

Slide 5

Slide 5

“ Regardless of what accessibility conformance level you target, do not arbitrarily open links in a new window or tab. If you are required to do so anyway, inform users in text. — Adrian Roselli, Link Targets and 3.2.5

Slide 6

Slide 6

[target=”_blank”]!”after { content: ” (opens in new window or tab)”; } In his article Link Targets and 3.2.5 (opens in a new window or tab) Adrian Roselli states “do not arbitrarily open links in a new window or tab.”

Slide 7

Slide 7

[target=”_blank”]!”after { content: ” (opens in new window or tab)”; }

Slide 8

Slide 8

[target=”_blank”]!”after { content: ” (opens in new window or tab)”; clip: rect(0 0 0 0); clip-path: inset(50%); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; }

Slide 9

Slide 9

<p id=”message-target-blank” hidden=”“> opens in new window or tab !$p> ⋮ <a href=”…” target=”_blank” rel=”noopener” aria-describedby=”message-target-blank”>

Slide 10

Slide 10

Slide 11

Slide 11

Slide 12

Slide 12

Slide 13

Slide 13

TIL about opening windows Photo by Vino Li on Unsplash