The ubiquitous tag is an unsung hero of HTML, a versatile workhorse that assists in creating hyperlinks, labeling forms, and assigning actions to JavaScript functions. In this in-depth guide, we'll delve into the multifaceted role of the tag, exploring its attributes, uses, and best practices.
The HTML tag is defined as such: Link Text, with 'URL' being the webpage address you want the link to point to, and 'Link Text' being the text that users will click on to reach the target page. Let's dive into its key aspects.
The href Attribute: Navigation and Beyond
The href attribute is the cornerstone of the tag, enabling navigation by linking to other webpages, differing sections of the same page, or triggering actions. The value can be an absolute URL, a relative URL, or a fragment identifier starting with '#'.
Consider this example: Visit Example. Here, "https://www.example.com" is the absolute URL, and "Visit Example" is the link text.
Absolute and Relative URLs
Absolute URLs begin with a protocol (http: or https:), followed by a domain name, a colon, and the path to the resource. An example would be Absolute Link.
Relative URLs, on the other hand, are paths relative to the current page. If you want to link to a page in the same directory, you can simply use the filename, e.g., Server Status.
Fragment Identifiers: Jumping to Sections
Fragment identifiers, denoted by a '#' followed by an ID in the target resource, allow for smooth scrolling to specific sections within a webpage. To use, first assign an ID to an element using the id attribute, like
Contact Us
, then link to it with Contact.
Additional Attributes: Enhancing Interactivity
Besides href, the tag supports several useful attributes that augment its functionality. Let's look at a couple of notable ones.
1. **target**: This attribute specifies where the linked resource should be opened. The two most common values are _self, opening the link in the same window/tab (default), and _blank, opening it in a new window/tab (e.g., Open in New Tab).
2. **download**: When added to an tag with a href attribute containing a URL to a file, it triggers a download when clicked (e.g., Download PDF).
The name Attribute: Now Obsolete
The name attribute, once used for linking to IDs, is now deprecated. Use href with fragment identifiers (e.g., Jump to Target) instead.