Link targeting in CSS

Although a fairly common practice online, link targeting—using the target attribute on a
and area elements (see the following code for an example), typically to open a link in
a new window—is not without its problems and should be avoided.
<a href="a-web-page.html" target="_blank">Open in a new window</a>
While some argue that this practice is beneficial, enabling users to look at external content
and return to your site, what it actually does is take control of the browser away from
users. After all, if someone actually wants to open content in a new window, they can do
so using keyboard commands and/or contextual menus. More important, opening documents
in new windows breaks the history path. For many, this might not be a huge issue,
but for those navigating the Web via a screen reader, pop-ups are a menace. New content
opens up, is deemed to not be of interest, and the back function is invoked. But this is a
new window, with its own blank history. Gnashing of teeth ensues. There’s also the problem
that you can’t guarantee what will happen when this attribute is used anyway—many
users configure browsers to suppress new windows, either forcing them to open in a new
tab or over the top of the current page.
There’s also the issue that target is deprecated. Although it remains valid when working
with XHTML Transitional (and XHTML Frameset), it’s not when using XHTML Strict.

There is, however, a JavaScript alternative for those very rare occasions where you need to
use a link to open a new window (this is explored on Bruce Lawson’s website, at www.
brucelawson.co.uk/2005/opening-links-in-new-windows-in-xhtml-strict-2/); essentially,
you attach the script to your web pages and then add rel="external" to the a start
tag for external links. Complying with the W3C’s Web Content Accessibility Guidelines
(WCAG), the script also warns when new windows are about to be opened. Ultimately,
though, you should avoid new windows whenever possible. For occasions when you want
to provide a temporary new window (such as for a terms-and-conditions box during a
checkout process), use a JavaScript pop-up, or place the terms inline by using a scrollable
content area