Open the header's external links in a new tab

[eastagiletracker]

This PR proposes making the site header's external links truly external, so the social icons rendered on every page open in a new tab instead of replacing the page the reader is on (part of #99). We include this PR work along with a full history of your repo at https://eastagiletracker.com/projects/195. You can sign in with your GitHub ID to claim ownership of the project.

What changed and why

Issue #99 reports that outside links in the site chrome load in the same window, and asks for the other occurrences of the same behaviour to be found and fixed. The remaining one is the social bar: _includes/navigation.html renders it straight from _data/socials.yml, and that file lists YouTube, Slack, Reddit, Twitter, Facebook and LinkedIn under href — the key the include treats as an internal link — so those six anchors go out with no target. Because the include is pulled in by _layouts/default.html and _layouts/archive.html, it is on every page of the site, not just one, and clicking any of the icons drops the visitor out of bsidessf.org.

Reproduced on main at c70feae, and the same markup is live on the deployed site right now:

$ bundle exec jekyll build
$ grep -o '<a href="https://twitter.com/BSidesSF"[^>]*>' _site/about.html
<a href="https://twitter.com/BSidesSF" title="Twitter">

$ curl -s https://bsidessf.org/ | grep -o '<a href="https://twitter.com/BSidesSF"[^>]*>'
<a href="https://twitter.com/BSidesSF" title="Twitter">

The change follows the convention proposed in the issue comments — href for internal links, external for outside urls — so _data/socials.yml now declares its six outside urls under external, and Graphic Recordings stays on href as an internal link. In _includes/navigation.html the socials loop resolves either key and adds target="_blank" rel="noopener" whenever the resulting url is absolute, which means an entry added later under the old href spelling still opens in a new tab rather than quietly regressing. The two nav anchors that already used external also pick up rel="noopener", since target="_blank" alone hands the opened tab a reference back to the site.

Verified by building the whole site before and after and diffing the generated trees: the only difference anywhere is the added attributes — 686 anchors across 98 generated pages — with every other byte identical, and the internal Graphic Recordings link deliberately unchanged.

$ diff -r _site.before _site.after | grep -E '^[<>]' | sort | uniq -c | sort -rn
  98 > <a href="https://twitter.com/BSidesSF" title="Twitter" target="_blank" rel="noopener">
  98 < <a href="https://twitter.com/BSidesSF" title="Twitter">
  ... (six socials plus the bsides.org nav link, no other lines)

I also rebuilt with a temporary entry declared the old way (href: "https://infosec.exchange/@bsidessf", matching the commented-out Mastodon line) to confirm the fallback path: it renders with the new tab attributes, while href: "/news" renders without them.

Scope note, since the issue says "fix all of them": this covers everything the templates and data files generate, which is the site chrome on every page. A handful of hand-written links inside page copy (volunteer.md, qna.md, privacy.md and friends) still lack target, and the frozen year snapshots under _archives/ are untouched on purpose. Happy to follow up on the page copy if you want it in the same style — I left it out here because those files change often and it seemed better not to collide with edits in flight.

How this was managed

The work was tracked on a board imported from this repository's own issues and pull requests (131 stories, 3 labels): the story for this change is Make all external links in site truly external, on the board at https://eastagiletracker.com/projects/195.

If you'd rather not receive contributions like this, reply no-more-prs on this pull request and we won't open any further ones on your repositories.

---

Lawrence W. Sinclair
CEO / East Agile
linkedin.com/in/lwsinclair/
eastagile.com