Today CSS is 20 years old. Interview with Haakon Wium Lee (Part 1)

On this day, twenty years ago, the current CTO Opera, Hawk Wyum Lee, published a proposal for cascading style sheets for HTML . If Paul McCartney was a web developer, and wrote the song "Orchestra of the Sergeant Pepper's Lonely Hearts Club" today, then probably he would have made something like:

It was twenty years ago today
That Håkon wrote a doc to say
That if the Web's gonna last a while
Then we need a way to define style.
So may I introduce to you
a way to add visual treats:
It's Sergeant Håkon's Cascading Style Sheets!

But when we came to Paul's house and asked him to sing this song for us, he refused and sent the dogs named FontTag and Bgcolor to us. Therefore, in order to celebrate such a round date, we went to Håkon and asked him a few questions about the past, present and future of CSS.

You came up with CSS 20 years ago. Are you satisfied with how your child grew up?
')
Yes, I am very pleased. CSS is the cornerstone of web standards, and thanks to it, pages look much prettier. The fact that HTML itself is still alive and flourishing is also possible due to the success of CSS. But, as always with young people, there is still room to grow.

People often quote your words about what CSS you offer to save HTML. Explain this thought, please.

HTML would be completely different if not for CSS. Layout designers with experience in the desktop environment, including myself, having come to the web, were completely confused due to the lack of the <color> and <font> tags. When in 1993 I first published a document on the web, I had to convert the text into pictures - this is how it looked . If things went on like this, the web could turn into a giant fax machine, where all the text would be transmitted in the form of pictures. It would be a nightmare for blind users or search robots. I proposed CSS in order to prevent this by giving authors the opportunity to create expressive design without clogging up HTML.

In the original version of the specification, a mechanism for specifying the “influence” was proposed, which looked like this: h1.font.size = 24pt 100% . Such logic of work was supposed:

The value in percent in the end of the line sets the desired level of influence (here - 100%). If this is a top-level style sheet (that is, it is under the full control of the user), the request for the level of influence can be completely satisfied, for example, all headers will be displayed in Helvetica font. If the level of influence is requested in the subordinate styles, it is satisfied to the extent allowed by the superior.

Why was this mechanism abandoned?

He was proposed to find a compromise between the preferences of the author of the document and the readers. The inspiration came from the idea of ​​the MIT Media Lab - in the future, televisions should have controls that control not only brightness and color, but also levels of sex and violence or, say, left and right political views. The mechanism of influence assumed the creation of a similar “slider” at one end of which the author completely controlled the display of the document, and the reader at the other. A browser had to mix their preferences in a given proportion, so that everyone was happy. This worked well for some properties (for example, font-size ), but created problems for others (for example, font-family ). In the very first response to the CSS proposal, Bert Bosh criticized this idea:

The idea that the two design options can be mixed, leading to a certain average style, seems to me absolutely wrong. What if my blue text on a yellow background is mixed with someone's favorite yellow on blue? Green on green? Or imagine a page with headings typed in avant-garde decorative fonts, and paragraphs of text typed by Helvetica.

I answered :

Some attributes are mixed better than others. A typical case of using a “weighted average” is to soften the author’s attempts to isolate something, for example, by changing the font size, and yet bring his thought to the reader. No one is obliged to use this opportunity, but at least “100%” does not differ in any way from a binary unit, binary logic leaves no room for maneuver. Computer interfaces generally seem to me too binary.

Of course, Bert was right (he is almost always right) that this proposal creates more problems than it solves, and had to be abandoned.

The same question about writing property names through dots, in javascript style. Why was he refused?

I wonder what you call it "javascript style". When I wrote my proposal, JavaScript has not yet been invented, so I could not take this syntax from there. In fact, the X-resources from the X Window System, another project from MIT, served as a source of inspiration.

There were two reasons why the CSS syntax went from font.size to font-size . First, the hyphen made the code more similar to plain text in English, that is, more readable. Secondly, in DSSSL and DSSSL-Lite property names were written with a hyphen. James Clark, who wrote the first draft of DSSSL-Lite, participated in the first W3C style sheet conference , and Bert and I borrowed a hyphen from DSSSL. But this syntax has a drawback - a hyphen is used as a minus sign, which can confuse the parser.

How did Bert Bosh get involved in the project, and how did you work together?

Bert Bos wrote a review on my original proposal. His experience and interests were a little different from mine, but when he published his own proposal , we quickly realized that both options should be combined. It was at this time that CERN transferred the web to the public domain and the W3C consortium was formed. I was creating a W3C branch office at INRIA and immediately hired Bert. Most of the CSS1 standard was born on a marker board in the Sophia-Antipolis technology park. Until now, fighting with another complex technical problem, I dream that Bert and this board were next.

While enumerating the people who made CSS a reality, I should mention Thomas Reardon and Chris Wilson from Microsoft. Thomas was the Internet Explorer program manager, and from the very beginning he was excited about the idea of ​​making style sheets part of the web. Chris Wilson is a programmer who has been involved in implementing CSS in IE3. The CSS implementation in IE3 was rather far from the standard, but we must not forget that this browser was released before the CSS1 specification was completed. Simon Daniels (also from Microsoft) wrote several impressive demos for IE3, and in the end, the three of them convinced the leading software company to support the young standard.

Have there been alternative offers? What was your better?

There were about a dozen alternative style syntax sentences. But not all of them were suitable for use in the web because of its specificity. For example, browsers render a document sequentially, as it loads, and should be able to do it even if styles are not yet available. In addition, on the Internet there are many different devices, and you can not write a separate style sheet for each of them. So the style language should support a scalable and responsive design. This is an exciting topic for research, I even defended my thesis in which I compared different approaches to the organization of style sheets.

Of course, the second question I can not answer impartially. I’m sure that there are several things in CSS that make a language especially suitable for use on the web: cascading, pseudo-classes and pseudo-elements, parsing rules with direct compatibility, support for different types of media, emphasis on the use of selectors and, of course, the unit of measure em .

What was your (and Berta) biggest mistake?

In my dissertation, a whole section is devoted to CSS flaws. Yes, they are, including our fault. But the biggest problem of the first version was not the design of the language itself (in my opinion, it is pretty good), but its implementation in browsers. The situation is well described by Jeffrey Zeldman:

If Netscape 3 ignored the CSS rules for the <body> element and added arbitrary fields to the structural elements of the page, and IE4, although it worked with <body> correctly, but got confused with padding , how was it necessary to write CSS code? Some developers preferred not to write it at all. Others wrote one file, taking into account the shortcomings of IE4, and the other with hacks for Netscape 4.

Of course, part of the blame lies with Microsoft and Netscape, but we too - I, Bert, W3C - could have avoided many problems if we had published not only the specification , but also the test suite from the very beginning. The first real test for CSS appeared only in October 1998, when Todd Farner published the Acid test . The test was unusual and visual - developers could immediately understand whether the browser passes the test or not. At the beginning, no browser could go through it. But then, under strong pressure from the CSS community, the situation began to improve. The WaSP project has played a key role in improving standards support. Opera browser has also contributed, showing that it is possible to implement CSS correctly. When I saw how well Opera supported CSS (much better than Microsoft and Netscape), I joined Opera.

Before that, one of the Opera chips was that their browser was placed on a single diskette (1.44 MB). In those days, the phrase "placed on a floppy disk" was a cool advertising slogan. With the addition of CSS, one floppy began to be missed. "Almost fit on a floppy disk" sounded not so cool.

The original Acid test became a model for Acid2 and Acid3 , which followed the same recipe: a webpage with a sly layout, which immediately shows how well the many features of a language are supported. The impetus for the development of Acid2 was an open letter to Bill Gates , where he fervently spoke in support of compatibility. Making IE7 compliant with standards seemed like the next logical step, and Acid2 became our challenge to Microsoft . Honestly, other browsers also had problems, and Acid2 found errors in all of them. Microsoft ignored Acid2 in IE7, but - sometimes miracles happen - IE8 went flawlessly. Just like all modern browsers.

---

The second part of