CSS: Підключення файлу через @IMPORT або LINK

Для підключення файлу стилів CSS можна скористатися кількома способами. Хтось вважає за краще використовувати вставку через LINK, а хтось любить @IMPORT. Як же зрозуміти – який спосіб використовувати краще всього? Відповідь на це питання нам дасть Google (думаю, йому можна довіряти в цьому плані). Корпорація добра дає наступні характеристики описаних вище методів…

Отже, для підключення файлу стилів у нас є 2 способи:

<link rel="stylesheet" type="text/css" href="styles.css" />

Або ж всередині самого файлу стилів через директиву @import

@import url('style.css');

Перший спосіб краще для швидкості завантаження і оптимізації сайту, так як в цьому випадку працює паралельне завантаження файлів.

У другому ж випадку підключення через @import, поки даний файл стилів не буде повністю завантажений, браузер не може виконувати швидше паралельне завантаження.

Якщо у вас кілька файлів стилів, найкращий варіант об’єднати їх усі в один і пройтися компактером, який вб’є всі пробіли, останні закривають точка-коми і переноси рядків.

Якщо ж не вийде, то завантажуйте їх паралельно:

<link rel="stylesheet" href="style_1.css" />
<link rel="stylesheet" href="style_2.css" />
<link rel="stylesheet" href="style_3.css" />