Dear Ms. FEWD: Target Practice

Dear Ms. FEWD,

I have two questions around the anchor tag’s target attribute.

1. When should a link open in a new browser tab, versus opening in the same browser window?

2. I know target=”_blank” and target=”_self”. Are there any other types, and do you have pointers on when they should be used?

Thanks,
Target Practice


Dear Target Practice,

These are fantastic questions. I typically like to stick to the following rule:

If it’s an internal link (same site/domain), I open the link in the same browser window. This keeps the flow of your site moving forward as your user views your site. For any reader that may be new to HTML, this just means to use a standard anchor link:

<a href="url">My link copy, same browser window</a>

If it’s an external link (different site/domain), however, I open it in a new browser tab. This way, your site doesn’t send any of your traffic to another domain. The tab for your site is still there, so that the user can go back to it and view more of your content. To open it in a new browser tab, you use the target attribute with a _blank value.

<a href="url" target="_blank">My link copy, new browser tab</a>

A full list of target attribute values are as follows, with older HTML4 frame examples from TAG Index linked:

_blank – opens in a new tab. If the browser used doesn’t have the tabbed layout, it will open in a new window. Examples of this can be found by just clicking on the next four example links – note that the domain is another site, so we have them coded as target=”_blank”, so you can come back to this tab, and read more (neat how that works, right?).

framename – Opens the href in the defined frame

_parent – Opens the href in the parent frame

_self – default. Opens the href in the same frame

_top – Opens the linked document in the full body of the window

A good thing to have in mind when dealing with the target attribute is that it’s a hangover from the old days of HTML, when we did web layouts in frames. <frame> was finally deprecated in HTML5, even though it was considered “bad practice” by the early ‘00s. However, in the specs, we still see the terminology for the target attribute calling out frames. So, unless you’re unfortunate enough to inherit an extremely old layout that you still need to maintain, odds are you’ll only use the target attribute with the “_blank” value when it is an external link and a basic anchor tag when it’s an internal link.

Happy developing!
Ms. FEWD

Do you have a front end development question? Ms. FEWD has answers. Email her at MsFEWD@tahzoo.com.

Our services

One experience. One team.

Studios.
  • Digital Strategy & Planning
  • Data & Analytics
  • Content Strategy
  • User Experience Design
  • Campaign Management & Operations
Labs.
  • Data Hub
  • Content Hub
  • Intelligence Hub
  • Digital Publishing
  • System Operations