Your daily frequent11y newsletter, brought to you by @ChrisBAshton:

When to use target=”_blank”

An old CSS-Tricks article by Chris Coyier, worth reading as a refresher.

The default value for the target attribute, if unspecified, is “_self”, meaning links open within the same window. Using “_blank” forces links to open in a new window or tab. Users can opt in to opening in new tabs by using CMD + Click when opening links, so they have the choice without being forced into any one decision.

Chris points out some bad reasons that have been used in the past to justify forcing links to open in new tabs:

• For branding, metrics and engagement. Opening new tabs means people still have your website on their original tab, keeping them on your site.
• Because internal and external links are different. Quite a few sites only open ‘external’ in a new tab.
• Because the link is to a PDF. Users can still use the back button, so why a new tab? (PS if you’re trying to make it easier to download, use a download attribute on the link instead).
• Because your client wants it that way. Chris suggests educating them about not frustrating their users.
• Because it’s an infinite scroll page (to avoid the issue of handling ‘back’ behaviour after a long scroll).

Chris then lists some good reasons for opening in new tabs:

• Because there is user-initiated media playing.
• Because the user is working on something that would be lost if the current page changed.
• Because there is a technologically obscure reason. Chris cites “building an email where people in Outlook Kangaroo 2009 Enterprise Edition need to open it but links need to have target=”blank” on them otherwise they open in the sidebar viewing panel”…!

Last but not least, don’t forget to add the rel="noopener" attribute when opening in new tabs, for security reasons. This is less relevant now we’re approaching 2023, but the article hasn’t been updated to remove that advice yet, so I’d err on the side of caution and keep doing it.

Prefer longer newsletters? You can subscribe to week11y, fortnight11y or even month11y updates! Every newsletter gets the same content; it is your choice to have short, regular emails or longer, less frequent ones. Curated with ♥ by developer @ChrisBAshton.