Google material图标字体-完全支持浏览器的指南？

Question

我想使用谷歌的材料图标https://design.google.com/icons/作为字体，但我担心浏览器的支持。有关于使用哪种CSS、回退等的指南吗？我需要做浏览器嗅探吗？已知的限制是什么？

<link href="https://fonts.googleapis.com/icon?family=Material+Icons"
  rel="stylesheet">

<i class="material-icons edit_icon">more_vert</i>

对于IE9和更低版本，他们说要使用下面的代码片段，但在IE11的ie9模拟器中它是空白的。它在实际的IE9中有效吗？

<i class="material-icons">&#xE5D4;</i>

我需要做浏览器嗅探吗?或者我只需要两者都包含，而浏览器知道只显示一个？

这个页面和这个Why Google Material Icons Can't be Shown on Mobile一样列出了移动https://github.com/google/material-design-icons/issues/179的问题。它们提供了不同的解决方案。

有没有经过充分测试的权威指南？难道这个世界还没有准备好将这些图标用作字体吗？

Answer 1

一般来说，对于浏览器支持来说，图标字体是最好的，它们可以一直追溯到IE6。

Google Material Icons正在使用最先进的东西来帮助屏幕阅读器的人们理解图标是什么，例如。面孔的图标：

<i class="material-icons">face</i>

这被称为连接，并不是很好的支持(IE10)，但它仍然很好，这取决于您的客户/项目需要什么。之前我们使用aria-hidden来阻止屏幕阅读器说出图标的id。Here is an article that may be useful further reading.