За какво се използва тагът <link>?

Етикетът <link> се използва за установяване на връзки между текущия документ и други ресурси.

Основни случаи на употреба:

Свързване към CSS стилови листи: Най-често срещаното приложение. Позволява свързване на външни CSS файлове за стилизиране на страницата.
```
<link rel="stylesheet" href="/css/style.css">
```

Свързване към шрифтове: Например Google Fonts.

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">

Свързване към икони (Favicon): Смяна на стандартната икона на таба на браузъра.
```
<link rel="icon" type="image/png" sizes="32x32" href="/images/favicon-32x32.png">
```
Посочване на канонична връзка: Помага на търсачките да определят основната версия на страницата при дублирано съдържание.
```
<link rel="canonical" href="https://example.com/page">
```
Посочване на алтернативни версии на документа: Например, за различни езици.
```
<link rel="alternate" hreflang="en" href="https://example.com/en/page">
```
Предварително зареждане на ресурси (preload, prefetch, preconnect, prerender): Подобряване на производителността чрез предварително зареждане или установяване на връзки.
```
<link rel="preload" href="/fonts/roboto.woff2" as="font" type="font/woff2" crossorigin>
<link rel="preconnect" href="https://api.example.com">
<link rel="prefetch" href="/data/next-page.json">
<link rel="prerender" href="https://example.com/next-page">
```

Ключовите атрибути включват rel (отношение към текущия документ), href (URL на ресурса), type (тип MIME) и media (медийна заявка).