@JohnDidact
Нуб во всём

Стоит ли загружать разные файлы стилей для разных экранов?

Хочу сделать что-то типа того:
<head>
 <link rel="stylesheet" type="text/css" href="https://mysite.com/front/style/default/style.css">
 <style>
   @import url("https://mysite.com/front/style/default/sp.css") screen AND (min-width: 320px) AND (min-height: 450px);
   @import url("https://mysite.com/front/style/default/pc.css") screen AND (min-width: 800px) AND (min-height: 600px);
   @import url("https://mysite.com/front/style/default/palm.css") handheld, print;
 </style>
</head>


style.css содержит общие правила;
sp.css - правила для смартфонов;
pc.css - правила для кампуктеров.

На CodeRoad в комментах вычитал, что чел так бы не делал, но он не пояснил, почему. Да и, насколько я помню, гуру так не делают, import и media используют там, где места не хватает для блоков. Но почему? Это чисто религия или есть какие-то аргументы (кроме религии) в пользу того, что делать так нежелательно? Или нежелательно было делать это в прошлом, а сейчас типа норм?
  • Вопрос задан
  • 147 просмотров
Пригласить эксперта
Ответы на вопрос 1
Kozack
@Kozack Куратор тега CSS
Thinking about a11y
Если речь идёт именно про "Адаптивный" дизайн -- то нет, не стоит. Если речь идёт про отдельный мобильный сайт (когда общих стилей почти нет) тогда да.

Проблема в том, что определение "Смартфона" на основе размеров экрана может быть крайне не точным. Смартфоны есть большие, смартфоны умеют менять ориентацию, у смартфонов есть разные режимы работы. То же касается и ноутбуков. Как вы отличите маленький ноутбук от фаблета или планшета?
Вариантов устройств великое множество. И не забывайте, что во многих случаях ваш сайт может быть открыт не на весь экран.

import и media используют там, где места не хватает для блоков. Но почему

Идея в том, что вы изменяете не всю страницу, по каким-то заранее установленным точкам, а каждый отдельный компонент и по собственным размерам. То есть каждый компонент страницы умеет адаптироваться индивидуально и не зависимо от других. (Особенно С приходом Container Queries)

При таком подходе, с какого-бы устрйоства не зашел пользователь он увидит наиболее оптимальную страницу.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы