Link tegi ichida rel atributi nima uchun kerak?

<link> тегидаги rel атрибути ҳужжатнинг ҳозирги ҳужжати ва тегга ишора қилган ҳужжат ўртасидаги муносабатни (relationship) белгилайди. У браузерга боғланган ресурсдан қандай фойдаланишни хабар беради.

Энг кўп ишлатиладиган rel қийматлари:

• stylesheet: ҳужжатга қўлланиши керак бўлган ташқи CSS-файлни кўрсатади.
• icon/shortcut icon: сайт учун иконка (favicon) кўрсатади, у браузер табида кўрсатилади.
• preload: кейинроқ керак бўладиган ресурсни олдиндан юклайди, рендерингни тўхтатмай.
• preconnect: кўрсатилган манбаларга олдиндан боғланиш ўрнатади, кейинги сўровларни тезлаштиради.
• prefetch: фойдаланувчининг келгусидаги навигациясида керак бўлиши мумкин бўлган ресурсни олдиндан юклайди.
• canonical: саҳифанинг каноник URL-манзилини кўрсатади, бу эса қидирув тизимларига мазмуннинг асосий версиясини аниқлашда ёрдам беради.
• alternate: ҳозирги ҳужжатнинг альтернатив версиясини кўрсатади (масалан, бошқа тилда ёки бошқа форматда).
• author: ҳужжат муаллифини кўрсатади.
• help: ёрдам ҳужжатига ишора қилади.

rel="stylesheet"дан фойдаланиш намунаси:

<link rel="stylesheet" href="/css/style.css">

rel="icon"дан фойдаланиш намунаси:

<link rel="icon" href="/favicon.ico" type="image/x-icon">

rel="preload"дан фойдаланиш намунаси:

<link rel="preload" href="/fonts/myfont.woff2" as="font" type="font/woff2" crossorigin>

relдан фойдаланиш браузер ва қидирув тизимлари томонидан ташқи ресурсларни тўғри ишлаш ва самарадорликни ошириш учун зарурдир.