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).
- Reference (href) - the address opened when the link is clicked
- Anchor (a) - the display text or image
To recap, here's the basic HTML code for creating a hyperlink.
Code
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
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
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
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
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
Display
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?