Web design

Hot in web standards: January/February 2013

Lea Verou on the latest developments at the W3C, including First Public Working Drafts of the picture element and HTML Templates

New year, new standards developments. It seems that everyone is still in full gear to accomplish their New Year’s resolutions, because there are tons of things that have been happening simultaneously for the past two months in the restless standards world. Below, I’ll only try to cover some of the biggest news.

Update on W3Conf

The second W3Conf, W3C’s annual-ish conference for web designers and developers, took place in San Francisco on February 21-22 and was a huge success. The attendance was almost double that of the first one and everyone was very excited about the talks and the way it was organised. The talks covered a large spectrum of topics and several cool new specs were discussed, such as CSS Filters, Pointer Events, new CSS layout modules, Offline Web Applications, Device Orientation API, ECMAScript 6 and more.

Opera switches to WebKit

Unless you’ve been hiding under a rock in the past few weeks, you’ve certainly heard the news about Opera’s bold decision to stop development on its own rendering engine and adopt Chromium, and thus, WebKit. This was met with brouhaha and mixed reactions from the community. Some authors were happy that they now only need to develop for one engine less. However, most were concerned about where the web is headed and a potential WebKit monoculture in the future. As far as web standards are concerned, having fewer different implementations isn't a good thing. A W3C spec needs multiple interoperable implementations to advance to Proposed Recommendation status, and with fewer engines, there are fewer chances of that.

Bigger focus on testing

Tobie Langel, previously Facebook’s W3C Advisory Committee representative joined the W3C Team as a Facebook-sponsored W3C fellow, to help with testing efforts. Langel wrote an extensive blog post about his plans and it sounds like great developments lie ahead to make testing of specs more thorough and efficient and to meet the needs of modern web app development. If this sounds interesting, and you’ve started thinking how you wish you could help too, you could attend a Test The Web Forward event, have fun and do your part to help make the web more interoperable.

Pointer Events goes to Last Call

In the previous installment of this series, we discussed the FPWD of Pointer Events, a new set of events, interfaces and a CSS property (touch-action), which attempt to bridge mouse and touch interaction in an elegant way. So much hard work has been put into this spec that it’s already at Last Call stage, just one step before Candidate Recommendation (CR). You can read more about it in the extensive WebPlatform.org documentation about it.

First Public Working Draft of the <picture> element

We covered the turmoil around extending HTML5 to cater for the responsive images use case in the July-August installment of this series. This discussion has finally produced a first public working draft of an HTML5 extension, which attempts to combine the most popular solutions suggested then: a srcset attribute and a <picture> element with multiple <source> children. The combined solution consists of a <picture> element with multiple <source> children, which have srcset attributes or regular src elements. Best of both worlds! In case you want to read more about why this is useful, there is a document which outlines use cases and requirements. It'll give you plenty of ideas about how we could take advantage of this feature once it’s implemented.

First Public Working Draft of HTML Templates

The WebApps Working Group recently published a FPWD of HTML Templates. This introduces a <template> element which will let us do native client-side templating, freeing us from the overhead of all these templating JavaScript libraries that have been cropping up everywhere in the past few years (effectively proving that there is a strong need for something like this). Assuming this gets implemented, it may revolutionise the way we develop web application UIs in the future.

New pseudo-element and pseudo-class

We got decent HTML5 placeholder support a couple years ago. However, until recently, there was no standards-compliant way to style the placeholder text. Browsers applied a grey colour to it by default, which could look very hard to read with certain input styles. As a workaround, every browser supported a proprietary pseudo-element or pseudo-class to provide authors the flexibility of changing this predefined style.

There was a lot of heated discussion in the CSS Working Group in the past couple of months about this, mostly centered around the debate of having a pseudo-class vs a pseudo-element. Ultimately, the answer was both, as there were use cases to support each of them. The good part? It’s one of those features that already have implementations, so cross-browser support is just a matter of time.

Space dropped from border-image-repeat

If not implemented, the sad ultimate fate of every feature in specs will be to get dropped. This time, the weakest link was the space keyword in border-image, which would space the border-image tiles as appropriate so that we get an integer amount of tiles shown, ie no tiles get cut off in half. There were no implementations, so to enable the Backgrounds & Borders spec to move on, the feature was dropped. This serves as a reminder of how implementations can make or break a specification. If you really care about a feature and want to see it implemented, open a bug report and politely ask browser vendors to implement it, or vote on the existing one if it has already been posted.

Geometric SVG attributes to be added as CSS properties

If you’ve ever used SVG, you may have noticed how some of the elements’ attributes correspond to CSS properties as well and others do not. The ones that didn’t were the attributes that defined the geometry of each element. For example r, cx, cy, d, width, height etc. The CSS Working Group resolved to add those as well. This will make it much easier to write CSS-based animations for SVG, whereas until previously, SMIL and JavaScript were the only ways of animating these attributes.

Status updates

Besides the document status updates outlined above, there are several more that progressed in the past two months, such as:

Thanks to Doug Schepers for his suggestions and feedback

Words: Lea Verou

Lea works as a developer advocate for the W3C. She has a long-standing passion for open web standards, which she fulfills by researching new ways to use them, bloggingspeakingwriting, and coding popular open source projects to help fellow developers.

Advert

Log in to Creative Bloq with your preferred social network to comment

OR

Log in with your Creative Bloq account

site stat collection