How to Add Navigation Links to Your Marketing E-Mails - dummies

How to Add Navigation Links to Your Marketing E-Mails

By John Arnold, Michael Becker, Marty Dickinson, Ian Lurie, Elizabeth Marsten

Navigation links in web marketing e-mails are HTML links that allow your audience to jump to visual anchors within the body of your e-mail. If your e-mails have one or more headlines or bodies of content that your audience has to scroll to for viewing, you can include navigation links in your e-mail to

  • Highlight the content that your audience can’t see immediately.

  • Allow your audience to access the information by clicking a link instead of scrolling.

You can also include links to your website to allow your audience to jump from your e-mail to specific content on your website.

Navigation links are actually anchor links in HTML. Anchor links are HTML tags that reference a specific portion of content within an HTML document and automatically scroll the browser to the top of the referenced content when clicked.

To create an anchor link, you have to create a name for the anchor using an anchor tag and place the anchor in your website code at the beginning of the content you want to link to. Then you add a link in your e-mail text that points to the anchor.

Using your HTML or website editor of choice, follow these basic steps (the specifics depend on the editor you’re using):

  1. Use an anchor tag to place your anchor, and include the name attribute to identify the anchor’s name.

    Use the first word of the headline or section of content for the anchor name so that you can remember how to name your anchor link later.

    • To set the anchor in text, include an <a> anchor tag with a name attribute within your paragraph tags:

      <p><a name="anchorname">headline or title</p>
    • To name an image as an anchor, include the name attribute within the image tag:

      <img name="anchorname" src="">

    If you’re new to HTML, note that you should replace anchorname in the preceding examples with whatever name you’d like to use. Also, headline or title stands in for the text that actually appears on your site, and the URL in the preceding image tag also stands in for the location and filename of the image you want to use.

  2. Create your anchor link by inserting the <a> anchor tag in your HTML e-mail text, with the href attribute pointing to the anchor name you specify in Step 1, and preceded by a # character.

    • To create a TOC link that scrolls to your anchor tag, use the following:

          <a href="#anchorname">TOC link text</a>
    • To create a navigation link that scrolls to an anchor link on your website, use the following:

          <a href="”>
          navigation link text</a>

Most EMPs allow you to create navigation links in your e-mails, and many include navigation links in basic e-mail template designs.