Hello,
I’d like to know more about when browsers download “media queried” stylesheet. In the code below (taken from 320 and Up), are the four stylesheets downloaded and triggered when you resize your window, or are they downloaded only when needed?
<!-- For progressively larger displays -->
<link rel="stylesheet" media="only screen and (min-width: 480px)" href="css/480.css?v=1">
<link rel="stylesheet" media="only screen and (min-width: 768px)" href="css/768.css?v=1">
<link rel="stylesheet" media="only screen and (min-width: 992px)" href="css/992.css?v=1">
<link rel="stylesheet" media="only screen and (min-width: 1382px)" href="css/1382.css?v=1">
A similar question (still taken from 320 and Up): are all the icons downloaded or do device/UA know which one to download and use?
<!-- For iPhone 4 -->
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="img/h/apple-touch-icon.png">
<!-- For iPad 1-->
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="img/m/apple-touch-icon.png">
<!-- For iPhone 3G, iPod Touch and Android -->
<link rel="apple-touch-icon-precomposed" href="img/l/apple-touch-icon-precomposed.png">
<!-- For Nokia -->
<link rel="shortcut icon" href="img/l/apple-touch-icon.png">
<!-- For everything else -->
<link rel="shortcut icon" href="/favicon.ico">
Regards,
-jj. 