Meta Refresh 2015

To give the audience an idea of what CSS Blend Modes are, give them deep knowledge of how they work (right down to the algorithmic level), and inspire them to take their designs on the web to the next level using this technology.

Outline

Blend Modes have been a common feature in most image editing programs on the desktop platform, but we’ve never had them as part of the web platform, until now. Now we have them as part of CSS. This means a potential to really change graphic design on the web by layering various web elements in novel and interesting ways to produce the designs of the future.

In this talk, we’ll go over everything one needs to know about CSS Blend Modes. We’ll look at the algorithms of a few notable blend modes to illustrate what goes on behind the scenes, as well as see how they work with the stacking contexts in a web page. We’ll also take a look at what other web page elements apart from images can be used with blend modes (you’d be surprised) as well as best practices for maximum cross-browser compatibility. In the end, we’ll talk about the future of this specification and how it can effect the future of web design.

Requirements

Moderate proficiency in CSS. Basic mathematics.

Speaker bio

Shwetank works in the Developer Relations team as well as the Extensions Team at Opera. He is also part of the W3C Mobile Web for Social Development Group and the W3C Web Education Community Group. He promotes open web standards and best practices amongst the developer community at large. Over the years, he has written several articles about web standards and techniques in various publications like .Net Magazine, Dev.Opera, Developer Fusion and more, and has given more than 100 talks in 10 countries.

He likes browsers, extensions, open web technologies, and Batman.