What It's Purpose?

Can I Use is a website meant for developers to research what front-end applications they can use for their web page to provide the most accessible platform possible. The website will tell the developer whether the technique they want to use is compatible or not with any web browser they desire, even the ones with incredibly small userbases.

How do I Use the Info?

Let's put the site to a quick test to see how to use it. The test subject is the '@keyframes' rule. Keyframes are the ability to provide marks for animations, essentially points of change of some sort. These are widely supported, being supported by almost all modern browsers (on their most recent updates), just over 97% of users use compatible browsers. This info gives the developer an insight into how they can implement certain CSS code into their website or page, and work around which browsers do or don't support what they need. This info also can help the developer work around any issues that may arise with the code if certain browsers don't support it without a webkit. There's also the ability to test the compatibility in all of the browsers that Can I Use have data for. One more use is to find similar code that relates to the code the developer is trying to research, which can further benefit the developer when trying to figure out how they can make their website as accessible as possible.

CSS Variables and Clip

We'll test two more properties, CSS Variables and Clip. CSS variables are a great way to streamline the use of color or add a dynamic piece to your CSS, applying different colors to the same code through different classes or IDs. 'Var()' is the code used to determine that a previously created variable is to be used inside those parentheses, which will look like this: '--test-variable', meaning it would be 'var(--test-variable)'. CSS variables are very widely supported, but not universally. Internet Explorer, while being phased out, doesn't support variables at all. Other smaller browsers, like Opera Mini, also don't support it. However, most recent updates (2010 and after) of the popular browsers do support Variables.

Clip is a property that allows a mask to be placed over content that is absolutely positioned. This clip will cover up all of the space outside of the specified area of the content, rendering only the space inside on the screen. Clip, like CSS variables, is not supported by Internet Explorer and Opera Mini, but almost all other modern versions of browsers (2010 and after) do support the property.

To Summarize

A quick summarization is that Can I Use is a useful guide to what properties work in what environments. Essentially, it's a place where developers can quickly research the compatability of what they're developing with any browser it may function with, as well as how popular all the browsers and their versions are. It's a useful reference for any front-end developer looking to maximize accessibility!