Upgrade to Pro — share decks privately, control downloads, hide ads and more …

TIL about opening windows

TIL about opening windows

Gunnar Bittersmann

March 29, 2021

More Decks by Gunnar Bittersmann

Other Decks in Programming


  1. TIL
    Photo by Adrien Siami on Unsplash

    View Slide

  2. View 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

    View 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

    View 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

    View 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.”

    View Slide

  7. [target="_blank"]!"after {
    content: " (opens in new window or tab)";

    View 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;

    View Slide

  9. opens in new window or tab
    aria describedby="message-target-blank">

    View Slide

  10. View Slide

  11. View Slide

  12. View Slide

  13. Photo by Vino Li on Unsplash
    about opening windows

    View Slide