Links without href and the title attribute

The photo pages contain links that lead users to the previous and next photo pages. What should we do with this link, for example, on the last photo page? After all, there is no next photo in this case. You can delete the entire link, or you can do something else.

An <a> element without href is a placeholder rather than an active link. Adding href makes it a link to a destination. A placeholder can be useful when a navigation item has no destination, such as “Next” on the last photo, or when an item represents the current page:

<nav>
  <ul>
    <li><a>Page 1</a></li>
    <li><a href="2">Page 2</a></li>
    <li><a href="3">Page 3</a></li>
  </ul>
</nav>

The title attribute can provide an additional hint about an element, such as why a navigation item has no destination. Many desktop browsers show this hint as a tooltip on hover. Keep important explanations visible on the page: title tooltips are not reliably available to keyboard, touch or screen-reader users. For example:

<a title="You are viewing the first photo, so there is no previous photo.">Back</a>

In many desktop browsers, the tooltip appears when you hold the pointer over the element for a moment.

Now let’s modify the navigation on the last page of the gallery.

After completing this step, you can download an archive of the Website of a Beginning Coder we have built.