SVG未対応ブラウザのシェアって今どれくらいか?2014年10月版

先日発売されたiPhone 6 Plusでは従来よりもさらに画面が大きくなったり、Retina iMacの噂があったり、様々な機器でディスプレイの高解像度化が進んでいます。

それらの環境に合わせてピクセルサイズを変えていくつも画像を作るより、いっそSVGのようなベクター形式に移行したい!……でも古い環境が残っててまだまだ使えないんでしょ?
と考えている人も多いのではないでしょうか。


じゃあ実際どれくらいの環境が残っているのだろう?というのを調べてみました。


Twitterや検索から来た人はどうせ最後まで読まないと思うので結論を先に書くと

簡略な結論

2014年10月現在、SVG未対応のInternet Explorer8以下は依然として大きな割合を占めてるものの、iOSAndroidではそろそろSVGが使える環境が整ってきましたよ

という感じです。


PC向けはSVG未対応の環境は26.91%



Androidで未対応の環境は現在12%ですが着実に減少傾向なので。



(簡略な結論ここまで)






以降、グラフのデータ元や詳しい説明などをしてゆきます。

調査の元になったサービス

今回はブラウザやOSのシェアの調査結果を公表しているこれらを利用しました。

ただブラウザのシェアの調査は難しく、またサイトによっても傾向は大きく異なるでしょう。例えば Yahoo! Japan利用者とGoogle利用者でも傾向は違うと思います。そのため、あくまで目安として捉えて下さい。

SVG対応の基準

SVGの機能は多岐にわたりどれを基準にするかは悩むところですが、ここではHTML5でのインラインSVGを表示できるか否かを判定の基準にします。
どのブラウザが対応しているかは Can I useのページでまとまっていますね。

Inline SVG in HTML5 - Can I use...

SVG未対応の環境とは

主要なモダンブラウザでは概ねSVGへの対応はされていますが、現在まで残っているSVG未対応の代表的な環境をピックアップすると、この4つが挙げられます。

IE8以下 Android 2.3.x以下 Opera mini フィーチャーフォン
Internet Explorer8以下


古くはInternet Explorer向けにAdobe SVG viewerプラグインもありましたが、標準でSVGに対応したのは9からでした。シェアが最も大きくおそらく今後も長く残るのはこの環境でしょう。なお将来的にはこのような明るい話題もあります

しかし実際はそれ以降も少なくない割合で残るのではないでしょうか。残念ながら。

Android 2.3.x以下


AndroidSVGが対応されたのは3.0以降でした。それ以前の2.3.x以下は利用者も多かったのでかなりのシェアを占めていたものの、その割合は徐々に減ってきています。

Opera mini


日本や北米、ヨーロッパでは利用者が少ないのですが、日本を除くアジア圏、アフリカ圏の一部ではOpera mini利用者の割合が高いです。

例えば顕著なのがインドネシアですね。
国内ではあまり関係ないでしょうが、海外進出を検討する際には念頭においておくといいかもしれません。

フィーチャーフォン


いわゆるガラパゴスケータイ、スマートフォンではない携帯電話ですね。
ただSVGに限らずJavaScriptや画像サイズなど他の環境と異なる対応が必要な面が大きいので、対処法としてはSVGだけフォールバックというより、従来通りケータイ向けのページを用意する施策になるでしょうか。

フォールバックについて

ちなみに、こうしたSVG未対応の環境へのフォールバックについてはこちらの記事がまとまっています。

SVGをIE等のブラウザ対応を考慮して使う方法まとめ(SVGのフォールバック画像など)|2.IDEA



そんなわけで、以下調査結果

パソコン環境でのブラウザシェア

StatCounterの場合


StatCounterは国別・地域別のシェアの情報や、期間を区切っての範囲指定などが自由に行えてとても便利なサービスです。前述のCan I use...でもシェアの情報はStatCounterのデータを利用して算出しています。

現時点でダウンロードできる最新情報は2014年9月までの統計なので、日本でのシェア情報を取得し円グラフ化してみました。

「その他」はSVGに対応してるがシェアが少なくて描き切れないもの、「不明」は未対応のものとsafari 1.0のような古いブラウザ、あとは中華圏のブラウザで対応状況が判然としないものを含めました。
StatCounterではSVG未対応が6.94%、対応した環境は93.06%となりました。

NetMarketShare - Net Applicationsの場合


同じようにブラウザシェアの情報を公開しているNetMarketShare - Net Applicationsでもデータをダウンロードして円グラフ化してみましょう。

調査期間は同じく現時点で最新の2014年9月まで。ただ地域別の統計情報は有料なので全世界版となります。
こちらではSVG未対応が26.91%、対応した環境は73.09%という結果に。


以下両者の内容を並べて比較してみました。

StatCounterNetMarketShare - Net Applications
Browser Versionシェア小計Browser Versionシェア小計
SVG未対応IE 8.03.84%6.94%IE 8.022.25%26.91%
Safari 5.00.58%IE 6.03.23%
Safari 4.10.19%IE 7.00.68%
IE 7.00.17%Safari 5.00.34%
IE 6.00.11%Firefox 3.60.23%
不明2.05%不明0.18%
SVGに対応IE 11.030.52%93.06%IE 11.017.13%73.09%
Chrome 37.024.23%Chrome 37.010.06%
Firefox 32.07.78%IE 9.09.34%
Chrome 36.04.95%Firefox 325.94%
Firefox 31.04.91%IE 10.05.58%
IE 9.04.23%Firefox 313.92%
IE 10.03.80%Chrome 36.03.06%
Safari 7.03.15%Safari 7.02.27%
Safari 5.11.63%Chrome 35.01.64%
Safari 6.11.18%Chrome 32.00.85%
Chrome 35.00.55%Chrome 31.00.80%
Opera 12.10.49%Opera 12.x0.76%
Opera 24.00.46%Safari 5.10.64%
その他6.52%その他11.10%

こうした違いは何故出るか?というとStatCounterはページビューを基に、NetMarketShare - Net Applicationsではユニークビジター数を基に算出をしているためこのような結果になるわけです。どちらが正しいかといった問題ではありませんが、大目に見積もっておいた方がいいでしょう。
またInternet Explorerのバージョン別の割合を見ると、未だに8以下の利用者は多いことが分かります。現状としてはそれらの環境への対応は必要でしょう。

スマートフォンタブレットでのシェア

iOSの場合

iOSのシェアは開発者向けにこちらで情報を公開していますが
https://developer.apple.com/support/appstore/
iOSではSVG対応は比較的早かったため、現在のiOSのシェア状況を鑑みると特に問題なく使えるでしょう。

Androidの場合

Androidはこちらでバージョンごとのシェアを公開しています。
Dashboards | Android Developers
この情報を元に、ここ一年半ほどの推移をグラフにしてみました。

DonutÉclairFroyoGingerbreadHCICSJelly BeanKitKat
1.62.12.22.3 -
2.3.2
2.3.3 -
2.3.7
3.x4.0.3 -
4.0.4
4.1.x4.2.x4.34.4
2013年03月0.1%1.7%4%0.1%39.7%0.2%29.3%23%2%
2013年04月0.1%1.7%3.7%0.1%38.4%0.1%27.5%26.1%2.3%
2013年05月0.1%1.5%3.2%0.1%36.4%0.1%25.6%29%4%
2013年06月0.1%1.4%3.1%0.1%34.1%0.1%23.3%32.3%5.6%
2013年07月0.1%1.2%2.5%0.1%33%0.1%22.5%34%6.5%
2013年08月2.4%30.7%0.1%21.7%36.6%8.5%
2013年09月2.2%28.5%0.1%20.6%36.5%10.6%1.5%
2013年10月1.7%26.3%0.1%19.8%37.3%12.5%2.3%
2013年11月1.6%24.1%0.1%18.6%37.4%12.9%4.2%1.1%
2013年12月
2014年01月1.3%21.2%0.1%16.9%35.9%15.4%7.8%1.4%
2014年02月1.3%20%0.1%16.1%35.5%16.3%8.9%1.8%
2014年03月1.2%19%0.1%15.2%35.3%17.1%9.6%2.5%
2014年04月1.1%17.8%0.1%14.3%34.4%18.1%8.9%5.3%
2014年05月1%16.2%0.1%13.4%33.5%18.8%8.5%8.5%
2014年06月0.8%14.9%12.3%29%19.1%10.3%13.6%
2014年07月0.7%13.5%11.4%27.8%19.7%9%17.9%
2014年08月0.7%13.6%10.6%26.5%19.8%7.9%20.9%
2014年09月0.7%11.4%9.6%25.1%20.7%8%24.5%

SVG未対応のAndroid2.3.x以下は合計12%ほど。ただこれは地域別ではなく全世界での統計なので、国内の場合ではシェアは異なるでしょうし、12%は少なくない割合ではあります。
ただ先日こうしたニュースもありました。

「パズドラ」,2014年12月に対応OSをiOS 6以降/Android 4.0以降に引き上げ予定 - 4Gamer.net
スマートフォン向けの人気ゲーム「パズル&ドラゴンズ」が12月頃から対応OSをAndroid4.0以降にするとのこと。推移のグラフを見ると分かる通り、Android3.0以下は順調に減ってきていますから、そろそろ切り捨ててもいい時期なんじゃないかなー、とは感じています。

まとめ

Internet Explorer8以下の割合は日本だともう少し多いような気もしますが、懸念の一つだったAndroidについてはそろそろ使える環境が整ってきた、と言えるでしょう。
ただ今回はHTML5のインラインSVGが表示できる = SVG対応としました、しかし実は Can I use...SVGのページを見ると分かるのですが、SVGの全ての機能をサポートしたブラウザは未だにありません
SMILアニメーション、SVG fonts、HTMLの要素へのSVGフィルタ、SVGfavicon指定などなど、SVGの機能は非常に多岐にわたることもあり、また他の似たような仕様との兼ね合いもあって今後もSVGの全ての機能をサポートしたブラウザというのはきっと出てこないんじゃないかなー、と私は考えています。それにSVG対応がされたとは言っても、ブラウザの差があったり、まだまだ不具合があったりなんですが……。
とは言え、基礎的な部分での実装はかなり進んでいますから、十分実用化できるようになってきたのではないでしょうか。