A look into open web standards

A look into open web standards

By | July 4th, 2012
No Comments on A look into open web standards

We spoke to the father of CSS on what the future of the open web looks



\related stories

From what we understand, CSS3 is now being developed in a modular fashion, so parts of it can become standardised while other modules are still being worked on. What are some of the CSS3 modules that are near being recommended?

Yes, you’re right, CSS3 is modular. And it’s probably about somewhere between 20 to 30 modules. And we can’t do all of them at the same time. Some are being actively developed by all browsers and they are the ones that are closest to being mature, whereas others are more experimental. Some of them may never really become a standard. So there’s little bit of everything in it. I think it’s due to the success of CSS that it has attracted all these people who wanted to do stuff. So they come and say yes I want to do something in CSS3. We make it easy for new people who want to get involved and create a new module. But we do not necessarily commit to implementing it. But I can show you some of the things that we have implemented in Opera, and that some of the other (almost all) browsers have implemented. For example, border radius in CSS3 is one of the more mature functions. This is something almost all browsers have now, which makes it possible to just say a simple one line code that you can have a rounded border. I was initially against this, and was one of the features suggested in CSS1. I personally thought this was old school and newer designs wouldn’t prefer it. It reminded me of stuff done in the 1970s. But I discovered that many people actually want to have rounded borders and so we decided we would just do it. It’s now possible to give variations to the visual impression. This was something web developers and designers would otherwise have to use images for. That’s exactly what CSS is about. It’s about replacing images. That’s what we’re trying to do. Another example, would be CSS transitions. Using CSS transitions, we can create simple animations, by, writing, again a few lines of code. This would otherwise take a lot of effort in JavaScript or Flash. This is much simpler to do and is also supported across the board. Besides, Flash wouldn’t have worked on all devices anyway right? But these kind of things will work across all devices very soon.

If future additions to CSS will be via modules, will there ever be a CSS4? What would necessitate such an increment? Could features be dropped / clarified?

Right, CSS3 is very different form the CSS 2 and CSS 1 were developed. They were single specifications. CSS3 being modular, it makes it hard to answer the question, when will CSS3 be done, because it will, never, really be done. Also with time, some of the stuff, like rounded borders, may be people would want to do more complex stuff with rounded borders. May be for that, there could be a CSS4. In some areas, for example selectors, the way we select elements, we’ve already started work on a CSS4 module. But that’s mainly because the CSS3 module is done. It’s working perfectly fine, and we don’t want to touch it. When we want more functionality, we’ll have to develop further and we’ll need a version 4. We are going to see these things be developed in parallel. The big focus now, the buzzword is really CSS3, along with HTML5. Those two go hand in hand. HTML5 will make the web more smart and CSS3 will make it more beautiful. That’s a fantastic combination: smart and beautiful. But there will be HTML6 and CSS4 as well.

While CSS continues to gain new features, its core syntax has remained pretty much the same. As such we now have SCSS and LESS. Is there any chance CSS will take a similar route in the future in terms of syntax? Or perhaps a syntax similar to JSON so that it can be parsed with greater ease.

Yes those are frameworks for writing CSS. I think they make sense for preprocessing. That is allowing authors to use more compact code on the server side, and then they parse that code to expand it into normal CSS. I think some of those ideas are very good. May be we should have even had them in CSS in the first place. But the focus in the beginning was to make it very simple. We had to make it very simple for browsers to support these things. We couldn’t put in all the features we wanted. Like, for example, border radius was something where I said, no we can’t do that! One thing was I didnt like the design, but the other thing was that it would have been expensive for browsers to implement it. Often we are then being asked, should we change the CSS syntax? Put these things to CSS itself. May be we should, I don’t know. Sometimes it’s hard to do that though, because if you change the language now, you could make incompatible additions. Old browsers such as IE 6,7,8 and Opera 11 and such browsers will not be able to understand the new code. So we tend to be a bit conservative there and not change the code too often.

So you plan to retain CSS the way it is?

I wouldn’t say keep it the way it is, because we are adding things all the time. But we have to be sure that when we make the changes, it is really worth what we’re doing. That the benefits far outweigh the costs. There is also a limit to how many things we can put in there. There’s limit to what our developers can add support for. It’s not just programming, we also have to do testing. We have to do education, and make sure these things are used correctly. I can show you an example. The page for the Acid test is rendered differently by different browsers. It doesnt really matter which browser is doing it right or wrong or best or worst. The point is that since they look different, the author is going to have problems. This is where we really need feedback from people who are reading the specifications, and writing test pages and early documentation to make sure that the browsers do it right. It’s much cheaper for everyone, it’s much better for everyone if we can fix those problems early on in the development instead of late. What we saw with IE4, 5 and 6 was that they didn’t fix the bugs. They left the bugs in. That almost created two languages. One Microsoft dialect and one open and standardised.

So one of the things we challenged Microsoft when they announced IE7 was to fix the bugs in there and not just think of adding new features of changing the user interface. You really need to get your standard support better. That’s when we launched this Acid 2 page where every pixel on the screen is a test. So it looks fine on other browsers, but in IE 6 it looks really red like a bloody face. We won’t say we intentionally made it that way, but we probably just highlighted the red to scare people a bit (smiles). Then IE 7 came out and it looked a little better, but the magical thing happened. In IE 8 they fixed it! They somehow felt they had to support this test. This is an example of one web page changing how a giant behaves. This is due to the continued pressure from the web community. Microsoft was always asked when they presented their new browser when they would support Acid 2. They realised they had to deal with it. It was just too embarrassing not to do so. I believe really in the web community, as far as keeping browsers honest. I think we need a strong web community to make sure that browsers develop in the right direction at least in terms of standards.

CSS is now being used even outside of web applications, for example in GTK+. What are your thoughts on that? Is it a testament to the popularity of CSS, or its versatility?

Well, in order to make something a programming platform, you need a programming language as well, and CSS is not a programming language. You have a programming language for the web and it’s called JavaScript. And along with HTML and CSS, those three are really the foundation of the web. That’s what those who want to write web content will have to deal with. It’s a little bit of a competition between CSS and JavaScript I would say, because we try to get some of the things people do in JavaScript into the CSS side. For example, animation and similar effects are now part of CSS. We make it easier to do things. But then we work together. We need JavaScript, we need a programming language to offer programmers what they would like to have. The biggest competition is probably native apps. We believe instead of getting into a contract with an Apple or a Google, it is better for developers to use the web as a platform. They can reach more people that way. But in order to make them come to the web, we need to offer them something that they want. For example on the iPhone they’ve been able to talk to the camera.

What do you feel are some of the most exciting features that might come to CSS?

Microsoft did something in 1995. They donated a bunch of fonts to the web. Anyone could use them. They didn’t have to be using Windows. You could use Linux or Mac and still be able to use those fonts. So these fonts are typically installed on every computer. So a lot of the stuff we read using western languages use these fonts. But they’ve been used so much that we now want to see some change. So we’ve now added support for web fonts. So from within CSS, instead of pointing to a type font, you can link to a font URL. That means you can fetch a font from the web, download it and use it to display your page. Again it’s all very simple, something like one and a half line of code. This would make the web more beautiful and a visually rich place. A lot of stuff that used to be done in JavaScript is now moving towards CSS. This is now evident in the way forms would be designed. A developer no longer needs to code the forms in place, but just use a couple of lines of code and the form is ready. Also, Wikipedia announced that it added 11 Indic languages using web fonts, so that’s another encouraging development. Similarly, such innovations will change the way we experience content on the web. [Opera evangelist Shwetank adds] Even with languages such as Hindi, sometimes it gets difficult to read online. What these fonts can do is make it easier to read. CDAC has released some fonts that make it easier to read. So, it’s not just about style, but also about readability when it comes to web fonts.

 Are there any features that have been outright rejected from CSS? Could you provide any example(s) off the top of your head?

We are cutting a few things. Things like run-ins in CSS2 were cut. But that’s stuff that wasn’t really used. So as such there’s nothing that was used by people that was cut. More or less, it was stuff that was in the spec, but never really took off, or we found other ways to do it. In the process of making this standard, a lot of ideas are discarded. For example, I discarded rounded borders in CSS1. Back then it was just two of us making the specifications (smiles), so we had a lot of power. Now, there’s a lot more people, so nobody can make that decision, still there’s a lot of discussion, debate and consensus building. There are calls to throw away a particular feature. We can’t do this now, or we can perform a particular function this way. But it’s all done in the open and that’s encouraging. These kind of specifications get better if more people contribute.

How could individuals get involved?

Well, there are mailing lists. For example, www-style@w3.org. That’s where discussions about CSS take place. There’s a similar mailing list for HTML5. Just by subscribing to a mailing list, you can get all the information you need. You’d probably get about 30 messages a day when there are discussions going on. We’ve seen a lot of students getting started with the mailing list, and end up working for Opera, Mozilla or Google.That could be something more people would be interested in.

What kind of an approach, inclination or skill should such individuals have, before they can get involved?

First of all, they need to be interested in web technologies. They need to be looking under the hood. You know, there’s the view source. They should be looking there to try to understand the code. They should probably be quite skilled in reading code, whether that is HTML, CSS or JavaScript so that they understand how the web works before they make any suggestions. But the web is quite simple. The whole concept called View Source has simplified it further and made it possible to look underneath the hood. So if you’re really interested, it should take you about half a year to get you up to speed. From then on, you should be able to contribute. We also have created a curriculum called the web standards curriculum. We recently moved it to W3C. It’s available on a W3C wiki and is available under Creative Commons. So anyone can get started and learn about HTML,CSS or JavaScript. If people are experienced, and they feel they can contribute, they can go ahead and contribute to that wiki as well.

What are you thoughts about CSS frameworks, such as Foundation Bootstrap, Blueprint and 960GS? Is there any you’d prefer over the others?

I cant comment on them individually. I’ve been using some of them and I think they make sense. It makes it more compact and faster for authors to develop. It’s healthy to see that people are concerned of the syntax and want to improve. In some cases it makes sense to include them in to the CSS syntax. But it has a huge cost for us to do so because of the backwards compatibility issues. What the server frameworks have shown us that the features can be added without changing the CSS language.

What about CSS do you think is responsible for its success as a web standard? Were there / are there any alternatives?

Well there were some alternatives. Some people thought you could use JavaScript for anything. You could use it to set colour and fonts in JavaScript and that you don’t need CSS. I, of course, didn’t agree with that. I think it’s very important to have a simple language, which has a low barrier of entry and can be used without JavaScript. Sometimes, you might even want to turn JavaScript off, for security reason or some other reasons.

CSS is not a programming language. It’s a declarative language. It’s a simpler language and you can still style things with CSS. So I think, having a simple little language was a compelling feature. I think some of the visual stuff that we’re able to do is important for some people. To do hover effects such as change colour is not just visual fluff. It’s really very simple and easy to do with CSS. CSS is very important for us because, if we didn’t have CSS, probably HTML would have turned into something different. Probably it would have turned into a page description language. May be, we would have even had a font tag! May be we would’ve even turned the web into a giant fax machine! Fax machines send images. They turn text into images and send them over phone lines. In fact a group of authors around 1995 actually did that. They converted text into images and just used them on their pages. Well, for an author it might make sense, but from a user’s perspective, images take a lot of capacity and time to download! Then you can’t search them. Imagine what would’ve happened! We wouldn’t be able to search text, or index pages. What about the blind? How would we read out websites aloud to them? CSS came in time and gave authors means to express themselves better. If they didn’t have CSS, probably they wouldn’t have had the means to express themselves and would’ve been using images instead. So it’s not only about creating compelling visual presentation, but it’s also about saving HTML. The two really work hand in hand: HTML and CSS.

What do you think CSS will look like another 15 years from now?

I think the web is still young. Well 15 years, may seem a long time, but I’ll say the web will be around for 500 years! And 500, is not a very random number. It’s very convenient to say that. Because in 500 years, I will not be around (smiles)! But also, I’ve chosen it because if you go 500 years back in European history, you’ll find Gutenberg. And we saw how Gutenberg’s invention really transformed Europe. We had the renaissance, the reformation, the industrial revolution. These things would not have happened without access to a book! That change has lasted 500 years! And Gutenberg’s books are still going to be with us, but now we have the web. While the printing press was a European invention, and it mostly changed Europe, the web has the potential to change the whole globe! So I think it’s set a new metaphor. In 500 years time, the web will still be able to read pages we create today.

Could you comment on the kind of work other open companies such as Mozilla are doing in this field?

Yes, there’s some interesting work happening with CSS! If you take some of the features demoed by Mozilla, we could run them on Opera, and vice versa. We’re working with the Mozilla people. I have a lot of respect for them! I know many of them personally and we meet when we need to discuss standards we sit around the same table. So I think there is a lot of mutual respect among us! And if we want to make the web the platform to be, we ought to work together.

Topics: , , , , ,
Nash David
I’m fascinated by open web technologies, and its endless possibilities. I use Windows for work; want to switch to an Android smartphone, and get an iPad soon. Write to me at editor@devworx.in, or tweet: @nashpd.