Submenu title, h1 or span/other

Question

I have a pretty standard menu with a title that is not a link, but does display the submenu below on hover. The question is as this is the title for the submenu, should that item be a h1, span or other? Normally I would use an anchor but in this case it doesn't actually link anywhere. I have looked around but can't find a suitable answer.

Examples

With span

<nav>
  <ul>
    <li>
      <span class="hover-me-for-submenu">Submenu Title</span>
      <ul class="submenu">
        <li><a>Link One</a></li>
        <li><a>Link Two</a></li>
        <li><a>Link Three</a></li>
      </ul>
    </li>
  </ul>
</nav>

With h1

<nav>
  <ul>
    <li>
      <h1 class="hover-me-for-submenu">Submenu Title</h1>
      <ul class="submenu">
        <li><a>Link One</a></li>
        <li><a>Link Two</a></li>
        <li><a>Link Three</a></li>
      </ul>
    </li>
  </ul>
</nav>

Thanks

Is this the whole content of the `ul`/`nav`? If not, could you show/describe how the full navigation list looks like? — unor, Oct 26 '16 at 06:39

score 1 · Answer 1 · answered Oct 25 '16 at 16:04

I would advise against using a <h1> as its technically "the most important" header tag (ranging from 1-6). I think a header is fitting, but something more minor would make more sense. For more information look up semantic HTML. Its important because it can affect your SEO and usability for screen readers.

score 1 · Accepted Answer · answered Oct 25 '16 at 16:05

Out of the two, I'd personally use a span because h1 is usually used for section headings, and sometimes even recommended to only be used once per document as the main title of the site (though that is debatable).

Another option I've used before is to not add any extra element at all and make the li itself hoverable:

<nav>
  <ul>
    <li class="hover-me-for-submenu">
      Submenu Title
      <ul class="submenu">
        <li><a>Link One</a></li>
        <li><a>Link Two</a></li>
        <li><a>Link Three</a></li>
      </ul>
    </li>
  </ul>
</nav>

score 0 · Answer 3 · answered Oct 25 '16 at 16:00

0

I think using span is recommended as span is considered Inline . Also use of h1 has no problem

answered Oct 25 '16 at 16:00

Sai Bhasker Raju

531
1
7
20

Submenu title, h1 or span/other

3 Answers3