Option for "Opens in New Tab" on Navigation items

[lukewatts]

I think it could be useful to allow for navigation links to have the target="_blank" attribute set on them.

I sometimes link out to external sites such as my Github account in the main menu or subdomains for labs, projects etc and I like to open them in a new tab if possible.

[claviska]

My argument here is sort of hypocritical since this is currently an option in the link panel, but I'll say it anyway. There's a lot of debate about target="_blank" and I was reluctant to even include it in the editor for links (still debating if it should be left in or removed).

I'm reluctant to add this for a few reasons:

• It's bad UX to mess with the browser's default behavior (although there are some uses for it)
• It could introduce security risks
• It's not semantic
• Perhaps most importantly, users shouldn't have to think about these things

Decisions like this need to be made with more thought than most users will care to give. Letting them check boxes arbitrarily leads to inconsistent results and poor UX for their visitors.

If the designer chooses that this is the preferred behavior for the website, the recommended approach is to use a script to accomplish it. For example, here's a vanilla JS snippet for opening external links in a new tab/window (source):

function externalLinks() {
  for(var c = document.getElementsByTagName("a"), a = 0;a < c.length;a++) {
    var b = c[a];
    b.getAttribute("href") && b.hostname !== location.hostname && (b.target = "_blank")
  }
}

This actually provides more flexibility than a checkbox in the UI, since they can decide if they want to target external links, certain domains, certain media types, or even individual pages. Of course, the flexibility goes to the designer, not the user — but we all know users tend to get creative when they have too much control. 😆

[claviska]

In fact, now that I've actually outlined why target="blank" is such a bad idea, it's more obvious that it needs to be removed from the link panel before it becomes a breaking change in 1.0. 😕

[lukewatts]

I don't know. I think a lot of users will want this feature.

Perhaps an option in the .env to enable this feature for more advanced users...or those who really want it?

If plugins become a thing in Postleaf people are just going to implement this themselves anyways at some point.

At least this way you have the opportunity to show a message of reasons perhaps not to do it. Teach people rather than just restrict them.

[lukewatts]

I just know when I'm reading articles or documentation and they link to another site or another page of documentation for further reading and it doesn't open a new tab I get really annoyed because I lose where I was. (I'm a 100 tabs open at once kinda guy)

[lukewatts]

If not the target="blank" attribute then at least the ability to add additional classes or data-attributes so people can target links with JS as they want.

[claviska]

Teach people rather than just restrict them.

The people that need to be taught about things like this are web designers who don't know any better despite that being their job. End users don't care and will misuse things like this because they want something a certain way, and that negatively effects every visitor to their site.

I know I'm very opinionated and often anal about certain things. I believe the web designer should decide how things look, feel, and behave. These are critical design decisions, not ones that most users are capable of making without compromising their visitors' UX.

I just know when I'm reading articles or documentation and they link to another site or another page of documentation for further reading and it doesn't open a new tab I get really annoyed because I lose where I was.

True. On the other hand, I religiously use CMD+click to open links in a new window. When I expect a link to open on the same page and it doesn't, I too get annoyed. 🤷‍♂️

If not the target="blank" attribute then at least additional classes or data-attributes so people can target links with JS as they want.

Designers can target links with infinite flexibility using JavaScript, but this forces more thought and that's a good thing. It changes one's thinking from "I want this random link to behave differently for whatever reason" to "what makes a link unique in such a way that it should be opened in a new window?"

And that leads to a consistent design solution that end users don't ever have to think about 😄

[claviska]

I've brain-dumped even more into a blog post since I know a lot of people will ask about this.

This is the type of decision that separates Postleaf from every other platform: the attention to detail, the focus on users and visitors, and the ability for designers to make decisions they're trained to make.

Lots of emotions will be stirred, I'm sure: postleaf.org/dont-open-links-in-a-new-window