# Parte 3: Attributi di \<a>

Benvenuti in questa lezione dedicata alla comprensione degli attributi di collegamento in HTML, focalizzandoci particolarmente su `follow` e `nofollow`, ma esplorando anche altri attributi utili. Questi attributi giocano un ruolo fondamentale nella definizione del comportamento dei link in termini di **SEO** e di interazione utente.

### Cosa sono `follow` e `nofollow`?

In HTML, l'attributo `rel` nel tag `<a>` specifica la relazione tra la pagina corrente e l'URL linkato. Gli attributi `follow` e `nofollow` influenzano come i motori di ricerca interagiscono con questi link:

* **`follow`**: Non è un valore effettivamente utilizzato o necessario. In assenza di un `nofollow`, si presume che il link sia di tipo `follow`, che indica ai motori di ricerca di seguire il link e di considerarlo nel ranking del SEO.
* **`nofollow`**: Questo valore viene usato per dire ai motori di ricerca di non seguire il link a fini di ranking. È utile per linkare siti ai quali non si vuole passare autorità da parte del proprio sito, come nei commenti degli utenti o in link sponsorizzati.

### Altri Attributi Importanti del Tag `<a>`

Oltre a `follow` e `nofollow`, ci sono diversi altri attributi che possono essere utilizzati con il tag `<a>` per controllare comportamenti specifici:

* **`href`**: L'URL della pagina verso la quale il link deve puntare.
* **`target`**:
  * `_blank`: Apre il link in una nuova finestra o tab.
  * `_self`: Apre il link nella stessa finestra o tab (comportamento predefinito).
  * `_parent`: Apre il link nel frame genitore.
  * `_top`: Apre il link nel topmost frame.
* **`title`**: Fornisce informazioni aggiuntive su dove il link porterà. Questo testo appare generalmente come un tooltip quando l'utente posiziona il mouse sul link.
* **`download`**: Questo attributo suggerisce che il link è destinato al download di un file. Quando usato, il browser scaricherà il file anziché navigare verso l'URL.
* **`rel`** (valori aggiuntivi):
  * `noopener`: Impedisce che la nuova pagina aperta possa controllare quella originaria.
  * `noreferrer`: Impedisce il passaggio dell'HTTP referrer header alla nuova pagina.
  * `external`: Indica che il link porta a un sito esterno. Non ha effetti funzionali, ma può essere utilizzato per definire stili CSS specifici.

### Esempi di Utilizzo

Ecco come potresti utilizzare questi attributi in un link HTML:

```html
<a href="https://www.example.com" rel="nofollow" target="_blank" title="Visita Example.com!">Visita Example</a>
```

<figure><img src="https://849926197-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FxDq3rP48kZBQE0crO5rs%2Fuploads%2FF0PJ4pUwZigkzWgP3zQC%2Fimage.png?alt=media&#x26;token=46f97f44-c2c9-4254-8f58-fc47de394dbc" alt=""><figcaption></figcaption></figure>

In questo esempio, il link porta a "example.com", dice ai motori di ricerca di non seguire il link, si apre in una nuova scheda, e mostra un tooltip quando l'utente passa il mouse sopra.

### Conclusione

Capire come e quando usare gli attributi di `<a>` può migliorare notevolmente l'usabilità del tuo sito, la sicurezza e la performance SEO. Sperimenta con questi attributi per vedere come influenzano l'interazione degli utenti e dei motori di ricerca con il tuo sito.