When designing for the web, designers and developers are often tempted by new technologies. Recent advancements such as embedded fonts, parallax scrolling, JS animation, SVGs etc. have had varying levels of cross-platform support. Depending on the requirements of your website or application, browser support limitations may become a deal-breaker to including modern UI/UX advancements.
Can I Use
Can I Use, is an excellent tool to evaluate the compatibility of different web technologies. Simply search for your chosen technology, and the site will report on compatibility across browsers. For example, this search on SVGs shows nearly 100% compatibility across tracked mobile browsers:
Scroll down the page for more specific uses. For example, there are breakouts on the SVG search including SVGs as Favicons, Filters and Fonts. Here is more information about Can I Use:
Can I use is created & maintained by @Fyrd, design by @Lensco. Support data contributions by the GitHub community.
Of course, Can I Use is just a starting point, and you should do your own testing on specific code or effects you’re looking to implement.
BrowserStack
We recommend doing a proof of concept for any new, or unknown web technology. One useful tool for evaluating your target browsers is BrowserStack.
With an affordable monthly subscription, you can gain instant access to over 1200+ real mobile devices and browsers. You can test on desktop browsers too, of course. All from within your preferred browser window, on your own computer. Such efficiency.
So next time your client asks for a cool animation effect, or you want to try implementing SVGs in a new way, check out Can I Use and BrowserStack to see if it will work for your target browser list.
Until next time.
PS. If you have questions about user experience, web design or development post your question to our Ask a Question section and one of our contributors may answer in a post. Thanks!