Open external links in a new tab

[pioupia]

When in doubt, I preferred to create a discussion rather than an outcome, but I think this topic can be addressed either way.

Describe the problem

When we read the documentation, we often click on links, and this is perfectly normal, because we are interested in their content.

However, Astro documentation contains a major problem, all external links replace the actual page of the documentation, making the content we were looking at disappear with it.

Impact on users

On any site, including documentation, the user expects the external link to be opened in a new tab, as it has almost become a convention.
This makes the user stay on the documentation page, increases the time he stays there.
Moreover, from his point of view, the navigation remains pleasant, once the external content is read, he can return to his documentation, without losing the level of scroll previously acquired.

Honestly, I find it quite frustrating.

How to solve the problem

I made a simple approach, maybe not the best, but it works.
I created a rehype function (actually, I used one that was perfect for my purpose, it avoided increasing the rendering time), and I applied the HTML attributes necessary for the above actions.
So, the _blank value for the target attribute, and noopener noreferrer security values for the rel attribute.

After that, I tested the documentation, and it worked.

I made a Draft PR for that : #2926
The initial commit : pioupia@92ee9df

[delucis]

Ah, sorry, saw your PR before this! As I mentioned when closing the PR, it’s usually fairly easy for a user to decide to open a new tab (cmd/ctrl + click on desktop, or with a long press on mobile) and it is also easy for a user to find their way back using the back button if a same-tab navigation was not what they wanted. But the inverse is not true if we enforce target="_blank" on all external links.

Here’s a more detailed write-up of the research around this UX: https://www.nngroup.com/articles/new-browser-windows-and-tabs/

[pioupia]

Thanks for the detailed answer, I'll go check it out right away!