Basic HTML Every Marketer Should Know (About Links)

Download Now: Free Marketing Plan Template
Erin Colbert

Updated:

Published:

As a follow up to my first post on Basic HTML Every Marketer Should Know, I wanted to dig a little deeper into links. Hyperlinks are references to resources on the web. They primarly link to other web pages, but can also reference images, documents, audio, or movie files. I often find myself using HTML code directly on blog comments or in forums. Keep this article as a handy reference for hyperlinks and stay tuned for my next post on basic HTML marketers should know about tables.

The Basic Hyperlink

There are 2 key elements to the code in creating a hyperlink (or link).

  1. Reference (href) - the address opened when the link is clicked
  2. Anchor (a) - the display text or image

To recap, here's the basic HTML code for creating a hyperlink.

Code

HTML 1

Display

Check out my recent blog article on Basic HTML Every Marketer Should Know.

If you want to replace the anchor text with an image, use this code instead.

Code

HTML 2

Display

Link that Opens in a New Tab/Window

When you want your link to take the visitor to a new tab or window when the link is clicked, use the "target=_blank" reference. Don't overdo this one though. When you're linking to content within your own site, it's a best practice to keep the session in the same window.

Code

HTML 3

Display

This link for my recent blog article will open in a new window.

Using a Tracked URL

Tracking tokens allow marketers to track traffic for a specific marketing campaign such as paid search, banner ads, email blasts or newsletters. To create the URL, use the Google URL Builder to define the campaign, source, and name. Once generated, you'll use this new URL as the reference destination and choose the anchor text (or an image) just like the basic link. You'll be able to see the results of your campaign in your analytics tool, like Google Analytics or HubSpot Sources.

Code

HTML 4

Display

Here is where I'd put a link in my email campaign to track visits back to my website.

Using the "No Follow" Attribute

There are times when you don't want to pass search engine credit for a link on your site. The "no follow" attribute instructs the search engines that a hyperlink should not affect or influence the target site's rank or authority. However, it's important to note that utilizing "no follow" for PageRank sculpting can be cumbersome and time consuming with little proven benefit

Code

HTML 5

Display

This hyperlink to the Inbound Marketing blog will not pass authority to the search engines.

Anchor Links Within a Web Page

Although you typically want to avoid having pages that scroll on and on forever, there are times when you want to link to content referenced at the middle or bottom of a page. The name attribute is invisible to the user and, when used with the anchor attribute allows for linking within an HTML document.

Code

HTML 6

Display

Brian Halligan

Here is where I'd put Brian's bio, typically further down on the page, but you get the idea.

What other HTML tips do you have to share? 

free website redesign benchmarks

Related Articles

We're committed to your privacy. HubSpot uses the information you provide to us to contact you about our relevant content, products, and services. You may unsubscribe from these communications at any time. For more information, check out our Privacy Policy.

Outline your company's marketing strategy in one simple, coherent plan.

Marketing software that helps you drive revenue, save time and resources, and measure and optimize your investments — all on one easy-to-use platform

START FREE OR GET A DEMO