We use the following structure to create links:
Simple Link
<a href="https://www.example.com">Visit Example</a>
This format uses the <a> tag to define a hyperlink. The `href` attribute specifies the destination URL or path the link points to. When clicked, the user will be taken to the specified destination.
Link with Placeholder (#)
<a href="#">Placeholder Link</a>
If you want a link that doesn’t navigate anywhere yet (perhaps to be used with JavaScript), you can use href=”#” as a placeholder. Make sure to replace # with the correct URL or JavaScript function.
The <a> tag is used to create links in HTML. The `href` attribute is used to specify the destination of the link. It can be a URL, an anchor within the same page, or even a JavaScript action.
Example:
<a href="https://www.example.com">Go to Example</a>
This will create a simple link to “https://www.example.com.”
The `href` (hypertext reference) attribute defines the target URL or resource. If you don’t specify `href`, the link won’t function as a navigation link.
Example:
<a href="https://www.example.com">Visit Our Website</a>
This link will open “https://www.example.com” in the same window or tab.
Example with an anchor link:
<a href="#section2">Jump to Section 2</a>
This will scroll the page to the section with the ID section2.
You can use the `target` attribute to specify how the linked page should open. By default, links open in the same window, but with `target=”_blank”`, the link will open in a new tab.
Example:
<a href="https://www.example.com" target="_blank">Open in New Tab</a>
This link will open the “https://www.example.com” page in a new browser tab.
If you want a link to trigger a JavaScript function instead of navigating to a page, you can use `href=”javascript:void(0)”`.
Example:
<a href="javascript:void(0)" onclick="alert('Hello!')">Click Me</a>
This will display an alert with the message “Hello!” when clicked, but won’t navigate to a new page.
The `rel` attribute specifies the relationship between the current document and the linked document. For example, you can use `rel=”noopener noreferrer”` to improve security when opening links in a new tab.
Example:
<a href="https://www.example.com" target="_blank" rel="noopener noreferrer">Open Example in New Tab</a>
This link will open in a new tab and add security features to prevent certain types of attacks.
You can create a link that allows users to directly call a phone number using the `tel:` protocol. When clicked, this link will initiate a phone call on devices that support it (like smartphones or apps that handle phone dialing).
Example:
<a href="tel:+1234567890">Call Us Now</a>
This will display a link labeled “Call Us Now,” and when clicked on a mobile device or a device with phone-dialing capabilities, it will initiate a call to the number +1234567890.
You can also create links that allow users to send an email when clicked using the `mailto:` protocol.
Example:
<a href="mailto:someone@example.com">Send an Email</a>
This will open the default email client with a new message addressed to “someone@example.com.”
You can use the `download` attribute to prompt the user to download a file instead of navigating to it.
Example:
<a href="files/sample.pdf" download>Download PDF</a>
This will initiate a download of the “sample.pdf” file when the link is clicked.
Summary:
- Use the <a> tag to create links in HTML.
- The href attribute defines the destination URL or action.
- The target=”_blank” attribute opens the link in a new tab.
- The mailto: protocol allows users to send an email.
- The download attribute allows file downloads.
- This structure helps you create clickable links for navigation, email actions, file downloads, and JavaScript interactions.