Browser support

Browser support

What are browsers? How does features get implemented? Why is this even an issue? Read and find out!

What is a web browser?

Application able to render HTML, executing JavaScript

Browser engines

The leading web browser engines today are Webkit (Google Chrome, Apple Safari), Trident (Microsoft Internet Explorer), Gecko (Mozilla Firefox) and Presto (Opera)

Web standards and specifications

All browser vendors follow the same requirement specification – the documents produced by and for the World Wide Web Consortium (W3C).

There are several maturity levels of a W3C recommendation.

  • Working Draft (WD)
  • Candidate Recommendation (CR)
  • Proposed Recommendation (PR)
  • W3C Recommendation (REC)

Link

Link

Browser support

HTML, CSS and JavaScript are ever evolving standards with suggestions and improvements being added constantly. With different vendors with differing markets and priorities, they do not implement every feature at the same time. There are also a great many different standards discussed at any point in time, making it virtually impossible to implement all features that are in the ... at the same time in the same order. This leads to inconsitensies between browsers, even though all browser engines follow the same specifications.

The standards are created in an iterative manner, where when a standard is proposed the different vendors starts implementing them, even while the standards are still being discussed and properly formalized. This will in effect lead to the browser vendors implementing features that are incomplete and/or unstandardized.

This is solved by prefixing the property, where the an incomplete version of the standard is marked as being incomplete by requiring the developers to use browser specific declarations to implement the properties. See the discussion on prefixing below for a more thorough discussion on CSS prefixing.

Introduction of new standards

All working groups have their own slew of public and private mailing lists that are used to introduce and discuss existing and new standards. In theory anybody can intoduce a standard to the working groups by registering and suggesting the feature to these mailing lists. In practice, however, the process is a bit more complex due to several factors.

Thus, in practice, the way a standard often is produced is by a party, often a major firm or even a browser vendor

Examples of this is how the CSS Generated Content for Paged Media Module and the CSS Compositing & Blending implemented by respectively Opera Software – a browser vendor, and Adobe – a publishing tool developer. In these cases Opera and Adobe themselves developed proof-of-concept version of web browsers (Opera extending their own web browser, Adobe extending the open source Webkit engine) to illustrate and market the feature.

Yes – market the feature.

Thing is, as browser vendors, like all other actors the free market, have to proritize features that are needed and in demand by their customers and stakeholders (web developers, content creators, visual and usability designers, end users +++) due to limited funds. In short – if the feature fails to generate income, the vendors have to

There are numerous examples of established standards that have failed to be implemented in web browsers due to

This can be due to several factors, but the easiest one to identify is the factor where a feature is not marketed well enought for the developers to implement them in their work, and browser vendors not implementing the feature due to developers not implementing, which in turn do not implement the feature due to browser support being low.

A standard might need some marketing to give it the attention it needs to be implemented by browser vendors.

In theory,

Browser vendors are driven by their market, which includes both end users and developers.

Thus, to successfullly introduce a standard, a working prototype to both illustrate the need and feasability of a feature, and a "gold standard" illustrating exactly how an implemented standard looks like in practice

... those who wish to propose a stand

Prefixing

Prefixing is used by the browser vendors to be able to release implementations of future standards before they are finalized and properly formalized.

Here, the actual syntax, techniques and functionality of the properites are in flux, and can be changed on a whim.

This lets web developers try out new properties years before proper standardization, The standardization working groups can also gather feedback from web developers and designers to further iterate on the proposition, and better be able to create the standard that the stakeholders need.

Note that prefixing is not only done on newly introduced CSS properties, but also on newly implemented native JavaScript methods.

Example

-o-transition: height linear 1.5s;
-ms-transition: height linear 1.5s;
-moz-transition: height linear 1.5s;
-webkit-transition: height linear 1.5s;
transition: height linear 1.5s;

A transition is a to let the browser smoothen a transition between a numeric state to another numeric state. If you programatically change the state without a transition, the item(s) will change their state instantaniously. Using a transition, you can declare that the change should take a set period of time, as well as providing a bezier-curve equation to declare the tangential speed the effect should be applied. This will in effect animate the change. The numeric state can be changed either by numerous JavaScript and/or techniques, which will not be discussed here.

As CSS is interpreted top to bottom, the last declaration that is supported by the browser is the one that is applied. This means that there is no harm in declaring several properties after another as it is done in the example. This also makes it possible to have different declarations tailored for different web browsers, which can be useful if a browser needs some tweaking due to inconsistencies. As the unprefixed property is declared last, it is the one that is applied when browsers implement support for the unprefixed property.