Organized by London Web Standards, the event took place at Ravensbourne College, an authentic venue by the Thames in South London. It included talks from browser representatives, breakout sessions and more.
Worth checking out the lovely sketchnotes done on a continuous piece of paper by Makayla Lewis. An artwork similar to RSA Animate videos, very inspiring.
by Molly Holzschlag @mollydotcom
From a recorded video, Molly talked about the danger of a WebKit monoculture for the Open Web and how it goes against its principles. She strongly believes that browser competition is a good thing and just as open standards are good for the web, so is the existence of multiple browsing engines. In addition, she highlighted that regardless of the engine war, monoculture goes away if we do our jobs collaboratively and responsibly.
WebKit Monoculture Isn't Breaking the Web: You Are
by Alp Toker @atoker, Webkit
After Molly’s talk, Alp presented an almost opposite point of view. He was very positive and showed that WebKit is very successful for several good reasons. It is fast, efficient, portable, flexible and aims for compliance with web standards, in addition, it can be plugged into other applications.
Alp explained that WebKit is a multiculture itself and it has so many variations. As an open source project it’s changing all the time and constantly evolving due to its nature of collaborations. He defends the idea that the WebKit open source project is a massive generator of web browser diversity. His advice was to question everything: browsers, authorities and standards.
Although currently WebKit has the largest desktop browser market share of any layout engine at 47.6% (Safari, Chrome), this figure is likely to change after Google's announcement about Blink.
Internet Explorer - Touch the web
by Martin Beeby @thebeebs, Microsoft IE
Martin highlighted how the way people interact with the web is changing due to new devices that allow the combination of different inputs in HTML5. For instance, the Aspire S7 is a 10-point touchscreen laptop that has different kinds of inputs but a single user agent. In other words, touch is no longer just about mobile and tablet.
When it comes to touch, people have high expectations and the “idea of touch” is about human connection. As computer sensors are fairly limited, the challenge is about making them feel as responsive and magical as possible. He also mentioned how gesture discovery is harder on the web than on native apps.
Martin showed some of Microsoft’s research and guidelines on touch as well as the new specification called Pointer Events. He shared some libraries such as the great Hand.js, that allows your code to work on every browser independently of the input method utilized (touch, mouse or pen), and modern.IE, an online tool to help you test web pages in modern and old versions of IE, allowing you to scan and find common coding problems.
State of the Mobile Web
by Paul Kinlan @Paul_Kinlan, Google Chrome
Paul stressed the importance of web development for mobile, as statistics show the percentage of mobile traffic is constantly increasing. For instance, two out of three people use Facebook from mobile.
Paul talked about performance and how UI Jank leads to less engagement on the web. As a good example he showed The Making of Facebook in HTML5 and how challenging it was for developers.
In the second part of his talk, Paul shared some compatibility statistics for features in web technologies on mobile, proving that the mobile web is a rich platform. All data was taken from a website called On Mobile I Want to Use.
Business as usual: bringing the world wide web to the whole wide world
by Andreas Bovens @andreasbovens, Opera
Andreas talked about two recent announcements from Opera: the switch to WebKit and Blink which is a fork of WebKit. It might sound a bit confusing, but he confirmed that Opera will actually use a combination of both engines, as some components are swappable in WebKit ports, as explained by Paul Irish. Their browser is under full construction and they are doing adjustments in multiple layers, but of course, they’ll stay in sync with Chromium.
Following this topic, Andreas showed the Opera Mobile Beta v14 for Android and some of the new features, including Automatic Text Wrap, @supports a native detection via CSS, input type color, video & audio fullscreen and inline options, WebGL enable and the Off-Road mode, the former Opera Mini.
Making your HTML5 efforts worthwhile
by Chris Heilmann @codepo8, Mozilla Firefox
Chris started off by talking about the broken promises of HTML5. After that, he raised an issue: we have great browsers and dev tools, yet we still create poor mobile experiences. Chris believes we are blinded by products and forget to optimize websites for all devices. Users shouldn’t need to buy a new device in order to get a new browser. He stated that the internet is for everybody and we should keep it that way.
Targeted at new emerging markets, the new Firefox OS is an affordable option where no credit card is needed. One of its key features is searching for apps by content. Chris showed the simplicity of its web API and explained the difference between the three levels of access: Hosted apps, Privileged apps and Certified apps.
Keep informed about upcoming events in our Events section on Awwwards
Breakout session 1:
Front end web architectures that won't bite (you in the ass)
by Steve Workman @steveworkman, PA Consulting Group
Breakout session 2:
Rendering without lumpy bits
by Jake Archibald @jaffathecake, Google Chrome
Jake delivered a great presentation about rendering of browsers and provided loads of useful tips and hacks on how to make the most of graphics performance and how to make the hardware do the hard work for us.
He used different Developer Tools to inspect the process of rendering, starting from the code (DOM) and passing through different steps such as parse HTML, recalculate style, create render objects (Layout), create pixel data (Paint), create layers in the GPU (Composite Layers) and more.
Jake explained a bit about how screens work and the concept of frame rate. He set as our goal 16.67MS, which is good enough for animations and touch responsiveness. One piece his advice was to favour requestAnimationFrame over setTimeout.
That was my personal favourite talk and I can't recommend it enough, have a look at the slides.
Battle of the Browsers
by Seb Lee-Delisle @seb_ly, CreativeJS
Panel Q&A Discussion
The conference finished up with a panel Q&A discussion with browser representatives. It was a good end to a great event and I'm looking forward to next year.