CSS Day 2017
This fifth edition of CSS Day was held on June 16th and 17th at Compagnietheater, Amsterdam. The first day was dedicated to the Browser API and the second day to CSS, the cascading style sheets we all love and hate.
Day one
The day kicked off with a presentation from Rachel Nabors from Edge (Microsoft). She shared her story about “Alice in Web Animations API Land”. We have animations and transitions in CSS for almost 10 years, but unfortunately, this is a very declarative way and not the easiest when you want to make rich animations. However, with Web Animation API we have almost full control over that via JavaScript. Play, pause, replay and chaining sequence of animations is straightforward. The biggest minus of the API is that it is still not very well supported by all browsers and you have you use a polyfill browser fallback.
We are looking forward for more mature browser support in the near future and can not wait to use the API in our projects!
Philip Walton and Tab Atkins from Google spoke about Houdini, one of the most exciting browser features. Houdini is a set of low-level browser APIs which give you control over the CSS browser engine. That means so you can write own CSS properties, create a custom layout, or just have control over browser paint and parse engine.
In near future there will be no need to wait for browser vendors to implement a certain feature. You can implement it by yourself using Houdini APIs. Currently, W3C specifications for Houdini are still in working progress, so we will not see it live soon. However, you can activate some of the APIs in Chrome Canary and play with them.
Chris Wilson of Google showed us how we can improve two of most difficult tasks on the web: credentials (passwords) and payments. A new Credential Management API can help you with user authorization, storing passwords, etc.
Payment Request is here to save us from manual entering credit card and address information every time when we try to order something online. Basically, with PR API you can check out your order with one click. Currently, the API supports only credit cards and Android Pay, but the idea is to support all kind of payment providers such as PayPal and Stripe.
Patrick Kettner at Microsoft Edge held a talk called Progressive Web Apps (PWA). He shared us a story how he built a small PWA in order to calm down his newborn baby: hushlittleba.by.
Ada Rose Edwards at Samsung showed us how easy and fun is to create a WebVR experience. During her talk, we all managed to participate in a live demo, in which 180 people joined in a WebVR world using Google Cardboard.
Day two
There was no better way to start the second day of the CSS conference than a talk by the inventors of CSS: Bert Bos and Håkon Wium Lie. That was a fun story telling what they would change if they started writing the CSS specifications again from scratch today. The mentioned the things they regret and the stuff they are proud of. Probably they would write better specifications for CSS v1, not adding position: absolute, and working on something like CSS grid.
CSS Grid Layout was the main topic on the second day, a few speakers talked about it. In March this year, the grid layout was shipped to almost every evergreen browsers after five years of discussions, specifications and development.
Rachel Andrew gave a very detailed presentation about grid layout sharing a lot of examples and edge cases. Mark Boulton gave great insight on how to design a grid layout. Håkon Wium added that the grid layout probably should have been included in the very first version of CSS.
The funniest talk of the conference was given by Chris Coyier, the creator of CSS-tricks and CodePen.io. He managed to present a few useful but not very well-known CSS properties (shape-outside, offset-path, clip-path) in a really entertaining way: by dancing and singing on the stage.
There are also videos on Vimeo from the conference in case this blog post wasn’t enough.
Originally published at www.elements.nl on June 21, 2017.
