Desktop nav uses <button onclick> instead of <a> for navigation links

[alexwolson]

Summary

The desktop navigation utility items (e.g. the "Sign Up" button) are rendered as <button> elements with onclick="window.location='...'" or onclick="window.open('...')". Buttons are semantically for actions, not navigation. This causes several problems:

• Screen readers announce these as "button" rather than "link", giving users incorrect expectations
• They cannot be middle-clicked to open in a new tab
• They do not support browser history navigation correctly
• window.open() can be blocked by popup blockers

Affected location

_includes/header.html:41–52

{% for item in site.data.navigation.utility %}
  <li>
    <button class="{{ item.type | default: 'secondary' }}"
      {% if item.external %}
        onclick="window.open('{{ item.url }}', '_blank')"
      {% else %}
        onclick="window.location='{{ item.url | relative_url }}'"
      {% endif %}>
      {{ item.label }}{% if item.external %}<span aria-hidden="true">&nbsp;↗</span>{% endif %}
    </button>
  </li>
{% endfor %}

Note: the mobile menu already correctly uses <a role="button"> for these same items — the desktop nav should match.

Fix

Replace the <button onclick> pattern with <a> elements styled to look like buttons, matching the mobile menu implementation:

{% for item in site.data.navigation.utility %}
  <li>
    <a role="button" class="{{ item.type | default: 'secondary' }}"
       href="{{ item.url }}"
       {% if item.external %}target="_blank" rel="noopener"{% endif %}>
      {{ item.label }}{% if item.external %}<span aria-hidden="true">&nbsp;↗</span>{% endif %}
    </a>
  </li>
{% endfor %}

WCAG criterion

4.1.2 Name, Role, Value (Level A), 2.1.1 Keyboard (Level A)