264 | Posts |
CSS is loaded with the combine.php. Why isn’t the css link in the head just linking to the latest minified & g zipped version of the css? (eg: data/_cache/hash.css)
I was wondering about it when thinking of the following.
Generally I like to add some extra css for older IE browsers, currently I've implemented this in my template after the GetHead function like this:
<!--[if lt IE 9]> <link rel="stylesheet" type="text/css" href="themes/Theme/Variant/oldIE.css"/> <![endif]-->
This way oldIE's get some css to fix a few ie quirks. This works good enough, but I have to do the minifying myself and there is always an extra request to the web server. What I'd like to see gpEasy do for me is output something like:
<!--[if !IE]> <link rel="stylesheet" type="text/css" href="data/_cache/eTag-name.css"/> <![endif]--> <!--[if lt IE 9]> <link rel="stylesheet" type="text/css" href="data/_cache/oldIE-eTag-name.css"/> <![endif]-->
Where the first css is the standards compliant version (just like the one that's now generated by combine.php) which is served to every browser except oldIE, and the second is the same combined with an oldIE only. That way its still one request for all browsers. If there is only one option this whole conditional mess could be skipped and just serve the default one.
The configuration for the second conditional comment could be added to the theme details as option:
"Load IE style sheets for browsers older than:(selectbox)IE 9/IE 8/IE 7/IE 6"
193 | Posts |
1.5K | Downloads |
1 | Themes |
I use the if statements to add a class to the <html> tag, Then I can use that class to define the browser-specific style. This allows you to keep all your styles in one file.
It's all explained in html5 Boilerplate.
264 | Posts |
I'm familiar with the boilerplate, but I prefer to do some things different. I don't want to load IE stuff, a standards compliant browser doesn't need anyway, in the common style sheet.
I propose this because it enables template builders to keep the template clean and still have the advantage of feeding the trolls oldIE's some specific stuff. If someone can explain my first question I can submit a request in the feedback section.
2K | Posts |
294K | Downloads |
16 | Themes |
18 | Plugins |
Why isn’t the css link in the head just linking to the latest minified & g zipped version of the css? (eg: data/_cache/hash.css)
Hmm, good point. I can't think of any reason not to do that.
I propose this because it enables template builders to keep the template clean
Always a good thing, especially as IE use drops. Not sure how quickly I would be able to get to this though, it might help to add the idea to the Feedback area (which I personally use as a to-do list).
264 | Posts |
it might help to add the idea to the Feedback area
I know, so here it is: CSS Conditional (and improved) loading. I was just making sure this doesn't go against some best practices/gpEasy visions.
a good thing, especially as IE use drops
Indeed, and when webmasters see no IE on their sites anymore, with this solution they can just drop the oldIE.css.
Everyone please vote: CSS Conditional (and improved) loading :-)
193 | Posts |
1.5K | Downloads |
1 | Themes |
I'm familiar with the boilerplate, but I prefer to do some things different. I don't want to load IE stuff, a standards compliant browser doesn't need anyway, in the common style sheet.
Even without using the other boilerplate stuff, I use the if statements to add a class to the <html> tag. And I find that I rarely have to write more that one or two lines of browser-specific style for a website (usually IE7). so it's hardly bloated. But that's a personal preference.
As I understand, you want gpEasy to take into account the if statements and just minify and gzip the individual style sheets without combining them. I'm not sure how combine.php handles things now.
Indeed, and when webmasters see no IE on their sites anymore
Don't hold your breath ;-) I'm just waiting for IE7 use to drop. I stopped caring about IE6 support and I can live with 8 and 9.
264 | Posts |
so it's hardly bloated. But that's a personal preference.
I know, but I'm against loading unused css, especially if its only meant for broken browsers, and thats personal too ;-)
As I understand, you want gpEasy to take into account the if statements and just minify and gzip the individual style sheets without combining them.
Sort of, but with combining; The oldIE version is the standard css with the additional IE specific stuff combined. With the example above every browser loads only one stylesheet.
193 | Posts |
1.5K | Downloads |
1 | Themes |
264 | Posts |
gpEasy doesn't have to know. Both are generated but the browser will only reads one.
This system is very simple and doesn't take each version into account. You can eventually combine this with the method from the standard h5bp. In that case all IE's load the second css and in there are the specifics. Feel free to expand the CSS Conditional (and improved) loading feedback issue. I don't know whats easy to implement and what is most wanted.
A new release for Typesetter is in the works with a lot of improvements including the ... Read More
Typesetter 5.1Typesetter 5.1 is now available for download. 5.1 includes bug fixes, UI/UX improvements, ... Read More
More NewsFind out more about our Provider Spotlight
What CMS: Find out what CMS a site is using.
Who Hosts This: Find out who is hosting any web site
WordPress Theme Detect: Find out which theme a WordPress site is using