YouTip
```
---
## Key Considerations
1. **SEO and Security:** Using `rel="nofollow"` on image map areas is highly recommended when linking to untrusted external sites. Similarly, using `rel="noreferrer"` enhances user privacy by hiding the origin URL.
2. **Multiple Values:** You can specify multiple space-separated values within a single `rel` attribute if needed (e.g., `rel="nofollow noreferrer"`).
3. **Validation:** Ensure that the `href` attribute is always defined when using `rel`. If `href` is missing, the `rel` attribute will be ignored by browsers and will fail HTML validation.Att Area Rel
# HTML <area> rel Attribute
The `rel` attribute of the `` tag defines the relationship between the current document and the linked document or resource. It is an essential attribute for SEO, accessibility, and browser behavior optimization when working with image maps.
---
## Definition and Usage
The `rel` attribute specifies the relationship between the current document and the target URL specified in the `href` attribute.
* **Prerequisite:** The `rel` attribute can **only** be used if the `href` attribute is present on the `` element.
* **HTML5 Standard:** The `rel` attribute is a new addition to the `` tag in HTML5. It was not supported on `` elements in HTML 4.01.
---
## Browser Support
The `rel` attribute for the `` tag is fully supported by all modern web browsers:
* Google Chrome
* Mozilla Firefox
* Microsoft Edge / Internet Explorer
* Safari
* Opera
---
## Syntax
```html
```
---
## Attribute Values
The following table lists the supported values for the `` `rel` attribute and their meanings:
| Value | Description |
| :--- | :--- |
| `alternate` | Links to an alternate version of the document (e.g., a print page, a translation, or a mirror). |
| `author` | Links to the author of the document. |
| `bookmark` | Specifies a permanent URL used for bookmarking (permalink). |
| `help` | Links to a help document or user guide. |
| `license` | Links to the copyright or licensing information of the document. |
| `next` | Indicates that the linked document is the next part of a sequence. |
| `nofollow` | Instructs search engine crawlers not to follow or pass link equity (PageRank) to the linked document. |
| `noreferrer` | Prevents the browser from sending the HTTP `Referer` header to the destination page when the link is clicked. |
| `prefetch` | Hints to the browser that the target resource should be pre-fetched and cached in the background. |
| `prev` | Indicates that the linked document is the previous part of a sequence. |
| `search` | Links to a search tool or search interface for the document. |
| `tag` | Specifies a tag or keyword that applies to the current document. |
---
## Code Example
Below is an example of an image map where one of the clickable hot spots (``) points to an alternate version of a document using `rel="alternate"`:
```html
```
---
## Key Considerations
1. **SEO and Security:** Using `rel="nofollow"` on image map areas is highly recommended when linking to untrusted external sites. Similarly, using `rel="noreferrer"` enhances user privacy by hiding the origin URL.
2. **Multiple Values:** You can specify multiple space-separated values within a single `rel` attribute if needed (e.g., `rel="nofollow noreferrer"`).
3. **Validation:** Ensure that the `href` attribute is always defined when using `rel`. If `href` is missing, the `rel` attribute will be ignored by browsers and will fail HTML validation.
```
---
## Key Considerations
1. **SEO and Security:** Using `rel="nofollow"` on image map areas is highly recommended when linking to untrusted external sites. Similarly, using `rel="noreferrer"` enhances user privacy by hiding the origin URL.
2. **Multiple Values:** You can specify multiple space-separated values within a single `rel` attribute if needed (e.g., `rel="nofollow noreferrer"`).
3. **Validation:** Ensure that the `href` attribute is always defined when using `rel`. If `href` is missing, the `rel` attribute will be ignored by browsers and will fail HTML validation.