An \u201ca href link\u201d (or \u201chref link\u201d) is HTML code that uses an <a> tag and href attribute to create a clickable hyperlink.<\/p>\n
For example, this href link creates the hyperlink \u201cSemrush<\/a>\u201d:<\/p>\n There are other types of HTML links (e.g., the\u00a0<link> tag<\/a>). And other ways to create hyperlinks (e.g., with JavaScript). But most links are created using\u00a0<a> tags<\/a><\/strong>, also known as anchor tags or anchor elements.<\/p>\n Anchor elements are defined by the start tag <a> and the end tag <\/a>.<\/p>\n The\u00a0href attribute<\/strong>\u00a0(hypertext reference attribute) defines the link destination or target. This is often a webpage\u00a0URL<\/a>. But there are\u00a0other possible values<\/a>.<\/p>\n Anchor tags should also include\u00a0anchor content<\/strong>\u2014the content that the link is attached to. In many cases, this is\u00a0anchor text<\/a>\u00a0(e.g., \u201cSemrush\u201d). But it can be an HTML element, such as an image.<\/p>\n Your content management system (CMS) might have tools that eliminate the need to code a href links manually. But it\u2019s helpful to understand how they work behind the scenes.<\/p>\n Tip:<\/strong>\u00a0Check for link issues\u00a0<\/a>and other technical problems on your site with Semrush\u2019s\u00a0Site Audit<\/a>\u00a0tool. You can crawl up to 100 URLs for free.<\/em><\/p>\n Find and Fix Link Issues<\/p>\n with the Site Audit Tool<\/p>\n<\/div>\n Href links are important because they\u2019re the most commonly used way to create hyperlinks. And hyperlinks help users and\u00a0web crawlers<\/a>\u00a0to navigate the internet and access digital resources.<\/p>\n There are two main types of hyperlinks you can add to your website:\u00a0internal links<\/a>\u00a0and\u00a0external links<\/a>. And a href links allow you to create both.<\/p>\n Internal links<\/strong>\u00a0are hyperlinks to locations or resources on your domain.<\/p>\n Examples include:<\/p>\n By using internal links effectively, you encourage users to explore your site. This might mean that they\u2019re more likely to make a purchase, share your content, or take another desirable action.<\/p>\n Plus, internal links help Google discover pages on your domain. And understand how they fit together. This can lead to higher rankings in\u00a0search engine results pages<\/a>\u00a0(SERPs).<\/p>\n External links<\/strong>\u00a0(or outbound links) are hyperlinks to locations or resources outside your domain.<\/p>\n Used properly, external links add value to your content.<\/p>\n For example, you can build trust by linking out to reliable sources. Or share a useful tool that isn\u2019t available on your site.<\/p>\n Google\u2019s John Mueller\u00a0claims<\/a>\u00a0that external links to reputable sites don\u2019t help with website rankings. But many\u00a0SEO<\/a>\u00a0professionals believe that they do.<\/p>\n When creating a href links, follow these best practices to ensure your hyperlinks work properly. And benefit your site as much as possible.<\/p>\n The href attribute value is the link destination. This can be a webpage, part of a webpage, file, email address, or phone number, for example.<\/p>\n The link destination is placed in between the quotation marks of the href attribute, like so:<\/p>\n Let\u2019s explore the main types of href values:<\/p>\n A relative URL is a path to a resource on the same website.<\/p>\n For example, our Semrush blog logo has the href value \u201c\/blog\/\u201d:<\/p>\n Some web developers use relative URLs for all internal links. Because they\u2019re concise. And they can still function after a\u00a0site migration<\/a>.<\/p>\n However, we recommend using absolute URLs for SEO purposes.<\/p>\n An absolute URL is the full path to a\u00a0URL<\/a>, including the protocol, domain, and any additional paths or parameters.<\/p>\n For example:<\/p>\n You\u2019ll need to use absolute URLs when adding external links.<\/p>\n But they\u2019re also helpful for internal links. Because you can always link to the\u00a0canonical URL<\/a>\u2014the preferred version of a duplicated page.<\/p>\n This removes any ambiguity or confusion for search engines. So it can help your SEO.<\/p>\n In a\u00a0Google video<\/a>, John Mueller said that linking to canonical URLs \u201cprobably makes a little bit more sense, because then you don\u2019t have to worry about things like [Google or users] accessing the non-WWW version of your website.\u201d<\/p>\n Anchor links (or jump links) are links to different parts of the same page.<\/p>\n For example, all the links in the table of contents for this article are anchor links.<\/p>\n To create a jump link, give the element you want to link to an id attribute (id=”id-name”).<\/p>\n Like this:<\/p>\n Then, create the link by using #id-name as the href value.<\/p>\n Like so:<\/p>\n Alternatively, use href=”#top” or href=”#” to create a jump to the top of the page.<\/p>\n The href=”mailto:” attribute creates a mailto link that opens a new email in the user\u2019s email program.<\/p>\n It\u2019s typically used in combination with a target email address.<\/p>\n For example, we have an href link like this in our site footer:<\/p>\n Clicking the hyperlink creates an email draft like this:<\/p>\n You can also add parameters such as a subject line, body content, and CC address to the a href code.<\/p>\n Let\u2019s say you want job applicants to send their resume to jobs@example.com with the subject line \u201cWeb Developer Role.\u201d<\/p>\n To make it easier, you could add an an HTML link like this:<\/p>\n Note that \u201c%20\u201d is used instead of spaces. This is an example of\u00a0URL encoding<\/a>\u2014a process that helps ensure parameters work properly.<\/p>\n To create a tel link, use the href=”tel:” attribute in combination with the phone number.<\/p>\n Like so:<\/p>\n When the user clicks the hyperlink on a compatible device, it\u2019ll open the number on their dialer app. Making it easy for them to call you.<\/p>\n The href attribute is important in an anchor element because it defines the link destination. But you can add other\u00a0anchor tag attributes<\/a>\u00a0to determine what happens when the user clicks the link.<\/p>\n These attributes can also help search engines understand your links. And therefore benefit your SEO.<\/p>\n Here\u2019s a quick overview of the most common ones:<\/p>\n<a\u00a0href=\"https:\/\/www.semrush.com\/\">Semrush<\/a><\/code><\/div>\nWhy Are Href Links Important?<\/h2>\n
\n
5 Best Practices for A Href Links<\/h2>\n
1. Choose the Right Href Attribute Value<\/h3>\n
href=\"value\"<\/code><\/div>\nRelative URLs<\/h4>\n
Absolute URLs<\/h4>\n
href=\"https:\/\/www.semrush.com\/blog\/\"<\/code><\/div>\nAnchor Links<\/h4>\n
<h2\u00a0id=\"faqs\">FAQs<\/h2><\/code><\/div>\n<a\u00a0href=\"#faqs\">jump\u00a0to\u00a0our\u00a0FAQs<\/a><\/code><\/div>\nMailto Links<\/h4>\n
<a\u00a0href=\"mailto:mail@semrush.com\">mail@semrush.com<\/a><\/code><\/div>\n<a\u00a0href=\"mailto:jobs@example.com?subject=Web%20Developer%20Role\">Apply\u00a0Now<\/a><\/code><\/div>\nTel Links<\/h4>\n
2. Use Other Anchor Tag Attributes<\/h3>\n