Задать вопрос
@JohnDidact
Нуб во всём
html

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

Хочу сделать что-то типа того:
<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 используют там, где места не хватает для блоков. Но почему? Это чисто религия или есть какие-то аргументы (кроме религии) в пользу того, что делать так нежелательно? Или нежелательно было делать это в прошлом, а сейчас типа норм?
  • Вопрос задан
  • 156 просмотров
4 комментария
Подписаться 2 Простой 4 комментария
Решения вопроса 1
Kozack
@Kozack Куратор тега CSS
Thinking about a11y
Если речь идёт именно про "Адаптивный" дизайн -- то нет, не стоит. Если речь идёт про отдельный мобильный сайт (когда общих стилей почти нет) тогда да.

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

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

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

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

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

Похожие вопросы
Вакансии с Хабр Карьеры
Fullstack Developer под Wordpress
Future Search
от 90 000 до 150 000 ₽
JavaScript FullStack разработчик
Rocket • Смоленск
от 80 000 до 130 000 ₽
CRM Bitrix24 разработчик
World Vision Clinic • Москва
от 170 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Разработать приложение для создания и управления виртуальными турами
22 дек. 2024, в 11:58
1000 руб./за проект
Игра С# MVC console + wpf
22 дек. 2024, в 10:44
15000 руб./за проект
Извлечь данные из архива
22 дек. 2024, в 10:12
10000 руб./за проект
Ещё заказы