bitstorm.org

Weblog by Edwin Martin about frontend webdevelopment and related topics

Push the web forward

On January 12th, 2016, Microsoft stopped supporting Internet Explorer 9 and 10. As a webdeveloper, it might be time to stop supporting IE9 and IE10 too. At the time of writing, in January 2016, the worldwide market share of IE9 and IE10 is less than 1.3% for each browser. Check the statistics from your own site, because the IE usage on your site might even be less.

Two years earlier, Microsoft already stopped support for IE8. At that time I wrote an article about which features you can use when you dropped support for IE8. The list of new features you could use was quite large. Now, when dropping IE9 and IE10, the list of new features is even larger!

Below you’ll find all new features supported in Chrome, Firefox, Safari, Internet Explorer 11 and Edge.

CSS

While all the other browsers supported impressive CSS effects for years, we had to wait until version 10 to see it in Internet Explorer. Now we can use these features without workarounds or fall-backs:

We finally can bring our webpages and interfaces to the next level. But there’s more. We now also have some new layout modules:

IE also introduces Grid layout, were you can define where elements should appear in a grid, very powerful for making responsive websites. But here IE is the leader of the pack and we have to wait until other browsers will support Grid layout as well. IE also introduces Regions to let text flow from element to element. Here we also have to wait since it’s only supported by IE and Safari right now.

Some other CSS features we can use now:

As a bonus, IE can now support more than 31 style sheets per webpage (yes, that limit existed) and pixel values can now be specified in decimals.

HTML

Most HTML improvements are about forms.

These new form elements and attributes also need two new CSS pseudo classes and one pseudo element:

With the Constraint Validation JavaScript API, validation of the form can also be controlled by JavaScript.

And with the new FormData API, forms can easily be send to the server with the updated XMLHttpRequest 2.

There are also a couple of new attributes:

Conditional comments are no longer supported and are now treated like the other browsers do: as comments.

Binary files

JavaScript always had a hard time dealing with binary data. This is fixed with the addition of the following API’s.

Webapps

Writing a webapp and running it on all devices sounds ideal, except when webapps are very restricted. A lot of API’s are added to make webapps more capable.

EcmaScript 2015

A small subset of EcmaScript 2015 (ES6) can already be used.

Zepto and Polymer

Now we can finally use some modern JavaScript libraries and frameworks. For example Zepto, a lightweight jQuery replacement.

A interesting framework that can now be used is Polymer, build on top of Web Components, a set of powerful and promising web standards still in development.

HTTP

The following two security features require changes in the webserver, so they’re probably more interesting for system operators:

HTTP/2, formerly SPDY, is the next version of the HTTP protocol with several improvements, so now is a good time to update your webserver.

Other improvements

Safari is the new IE

In the past, the features you could use on your website were limited by IE. While other browsers supported many features for years, you had to wait for support in IE before you could use them, or use workarounds or fall-backs.

Now it’s the other way around and IE11 ships with some nice new features not always supported in the other browsers. The most absent browser here is Safari. Once a browser ahead of the rest, now it looks more like it takes the place IE used to have.

Features in IE11, Chrome and Firefox, but not in Safari, are:

Take a look at caniuse.com to see which features are supported in which browser.

Conclusion

Internet Explorer and its successor Edge made great progress and catched up with the other browsers. The web platform is becoming more and more mature and the horizon of a webdeveloper becomes wider and wider. Which new features can improve the website you’re working on? Share it with the rest of your team and push the web forward.