An HTML a tag creates a hyperlink used for connecting different resources to a web page. The anchor tag is one of the most used elements on a webpage. This <a> element is also known as the anchor element. The href attribute is the major element of the anchor element. It holds the link destination inside.
The HTML <a> tag can be used to jump to different sections on the same page, move from one webpage to another, open an application, download files, and more. Here, let us learn more about the HTML a tag and how to use it for your web development project.
The HTML a Tag
The HTML a tag or anchor element is used to create hyperlinks that connect one page to another or allow users to jump from one section to another within the same page, open emails, applications, or more. It is one of the most commonly used tags in web development.
- The HTML <a> tag is used to define a hyperlink.
- The “href” attribute is one of the most important attributes of the <a> element, indicating the link’s destination.
- If you do not specify a specific target, the linked page is displayed in the current browser window.
- You can style HTML tag links using CSS styling methods.
- The HTML a tag is supported on all major browsers, like Chrome, Safari, Mozilla Firefox, Safari, Opera Mini, and more.
The Anchor Tag Syntax
The HTML a tag encloses a hyperlink or URL within the <a> tag. It starts with a <a> tag and ends with the </a> tag.
| <a href = “URL”> Anchor Tag Link Text </a> |
The opening <a> tag here defines the link, and the “href” attribute is used to specify the destination of the link, either connecting it to the same page or a different one. Let us take a simple example of an HTML a tag to understand it clearly.
| <a href=”https://pwskills.com”>Visit PW Skills</a> |
When you click the highlighted text “Visit PW Skills”, it will redirect you to the official website of PW Skills.
Read More: HTML Anchor Tag & A Complete Guide
How to Use the HTML Anchor Tag?
The basic syntax for the HTML anchor tag is given below.
| <a href = “https://example.com”> Visit Here! </a> |
- <a> defines the anchor tag in an HTML element
- The href is the attribute that tells the browser where the link goes.
- Users will only get to see the text between the opening and closing tags.
When a user clicks on the anchor link i,e. Visit Here!, the browser navigates to the link destination mentioned in the “href” attribute.
HTML a Tag: Default Appearance
The HTML a tag default appearance is based on three different situations. Check them below.
1. Before Click (Unvisited Link)
When you have never visited a link, you will find it in blue colors and underlined. Check the example below.
You can see that the links here are blue colored, and when you hover your mouse around, you will see them underlined.
2. After Click (Visited Link)
You will see the links you have already visited or clicked on at some point in time will appear in “purple” color, along with an underline when you hover on them.
You can see the PW Skills search result page, “What is Keyword Proximity?….” changed its color to purple as soon as I clicked on it.
3. Active Link
These links appear red in color, along with an underline below the linked text. They highlight the links that are either currently being clicked or interacted with by the user. It shows the page is loading the new page.
HTML a Tag: The href (Hypertext Reference) Attribute
The href attribute in the HTML a tag is used to enclose the URL or links used to go to other pages on the website, open webpages, or redirect pages to other websites. It tells the browser where the link should go when a user clicks on it.
| <a href=”https://pwskills.com”>Visit PW Skills</a> |
Here, the href attribute holds a link to the official website of PW Skills. When users click on the highlighted text i,e. “Visit PW Skills”, they will reach the official landing page of PW Skills.
Target Attribute In HTML a Tag
The target attribute in the HTML anchor tag is used to tell where to open the linked source. The attached URL might open in the same tab, redirected to a new tab.
| Value | Features |
| _self | It opens the link in the same tab or window (default behavior) |
| _blank | It is mostly used with the link in a new tab or window |
| _parent | The _parent value in the target is the link in the parent frame, which is used when working with frames |
| _top | It opens the link in the full browser window, breaking out of all frames |
| framename | It opens the link inside a named iframe or frame |
When to Use the HTML Anchor Tag?
You can use an anchor tag whenever you want to move from one place to another within a page or across different websites. Check some of the major use cases of the HTML a tag below.
1. Navigate Between Pages
The HTML a tag can be used to navigate to different sections on a webpage, such as menus, sidebars, etc.
| < a href = “/services.html”> Our Services </a>
<a href = “/contact.html”> Contact </a> |
2. Creating Bookmarks
The HTML a tag is also used to create a bookmark, allowing users to return to a specific location on a webpage.
| <a id = “section1”></a>
<a href=”#section1”> Back to Section 1 </a> |
3. Downloading File
When you click on anchor tags can also let your download files. The “download” text adds it to the anchor tag to download the file when you click the anchor tag element.
| <a href = “ /newfile/project_file.pdf” download> Download Project File </a> |
4. Opening Email Links
You can also use the HTML a tag to open mail links using the href attribute. Check with a simple example.
| <a href= “mailto : info@example.com”>Email Us </a> |
Master HTML With PW Skills
Learn and master the complete HTML fundamentals, tags, and build your portfolio with real world projects, assessments, and more in PW Skills Full Stack Web Development Course. Master HTML, CSS, JavaScript, React, SQL, and more.
Get doubt support sessions, industry led professional sessions, project portfolio, career assistance, and industry skills. After completion, you will get an industry recognised certification by PW Skills to level up your game in web development and gain exposure.
HTML a Tag FAQs
Q1. What is an HTML a tag?
Ans: An HTML tag is a frequently used element in a web development project used to redirect to a new page, specific frames, or to the same page.
Q2. What is href in HTML a tag?
Ans: The href in the anchor tag is used to create a hyperlink for other web pages, applications, or other sections of the same website. The targeting URL is enclosed within the href attribute.
Q3. Is the HTML anchor element a self closing tag?
Ans: No, the HTML anchor tag is not a self closing tag, it opens with and then ends with .
Q4. What is _blank value in an HTML a tag?
Ans: The “_blank” value in the anchor element is used to redirect the linked page to a new tab.
