[whatwg] A link[scoped] usecase

Tab Atkins Jr. jackalmage at gmail.com
Fri Mar 2 11:11:18 PST 2012

On Fri, Mar 2, 2012 at 10:58 AM, Kang-Hao (Kenny) Lu
<kennyluck at csail.mit.edu> wrote:
> (12/03/03 2:13), Tab Atkins Jr. wrote:
>> @import is just fine - it lets you modularize your files without having to
>> change/add <link>s in all your documents.
> I don't understand this statement. Could you explain more?

For example, say your website started small, so all the CSS was in one
file.  Over time it grows, and you realize it's getting hard to read,
so you'd like to refactor it into several smaller files.

If all you have is <link>, this means you have to go through your site
and add all the new files to every page.  With @import, you can just
have the "main" CSS page import in the sub-files, and everything works

(Arguably you should be using a preprocessor at this point to
concatenate your files, but @import still works there as a directive
to the processor.)

>>> The argument here is that I think <style>@import</style> might have
>>> usability problem (and also you need more work if want to switch the
>>> style. This could happen, for example, when the theme panel as described
>>> in this use case is a <div> with a <select>.). A reader of html5doctor
>>> had the same problem too[2] and I can certainly image other people being
>>> confused by this.
>> What usability problems are you suggesting?
> I don't have the resource to do a well-designed usability experiment
> here, but I am almost very sure if you:
> 1. Gather a bunch of Web Developers who didn't know <style scope>.
> 2. Teach them <style scope>.
> 3. Ask them to build something like the one described by GZhang.
> The first thing most people will try is <link scoped>. After they fail,
> the experienced ones will find the <style scoped>@import</style>
> solution on Google, and the less-experienced ones might start to do XHR,
> which doesn't seem like a very good solution.

Right, @import isn't often used.  But <link>-in-<body> isn't used
either.  The @import solution isn't any more difficult than <link>, so
I think tutorials can fill in the gap here.


More information about the whatwg mailing list