[css] Responsywna - oddzielne style, Pytanie z czystej ciekawości Opcje

[maniek74]

Witam

Przeważnie na stronach responsywnych jest stosowane rozwiązanie jednego arkusza stylów pod stronę, ale przecież jest rozwiązanie owiele bardziej czytelne tj. pod każdy układ zastosować oddzielne style:

[HTML] pobierz, plaintext 
<link rel="stylesheet" type="text/css" media="only screen and (min-width: 100px) and (max-width: 480px)" href="/css/stylePanel_480.css">
<link rel="stylesheet" type="text/css" media="only screen and (min-width: 481px) and (max-width: 800px)" href="/css/stylePanel_800.css">
<link rel="stylesheet" type="text/css" media="only screen and (min-width: 801px) and (max-width: 1024px)" href="/css/stylePanel_1024.css">
<link rel="stylesheet" type="text/css" media="only screen and (min-width: 1025px)" href="/css/stylePanel.css">
 
[HTML] pobierz, plaintext 

Taki układ jest prawie nie stosowany, sprawdziłem to na kilkudziesięciu stronach z poradami na temat reponsywności i każdy stosuje:

[HTML] pobierz, plaintext 
 
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
 
   ....................
 
}
 
 
@media only screen and (min-width : 321px) {
   ....................
 
}
 
itd
[HTML] pobierz, plaintext 

Dlaczego?

Pozdrawiam

Ten post edytował maniek74 4.01.2015, 07:07:37

[by_ikar]

Dodatkowo przeglądarki mają limit połączeń które mogą nawiązać w tym samym czasie do jednego hosta. Więc jak tych plików będziesz miał 20, a limit wynosi 5 (css, obrazki, js, czcionki etc), to na któreś pliki przeglądarka będzie musiała czekać, efektem tego będzie dziwne pierwsze wejście na stronę, że dziwnie się będzie doczytywać etc. Dlatego lepiej jest to lepiej łączyć potem w jeden plik, niż w kilka.

Więcej połączeń, to też większe obciążenie dla webserwera, taki apache średnio lubi sporą ilość requestów..

Ten post edytował by_ikar 4.01.2015, 13:05:46