svgが次第に広まりつつある中で,問題となるのがieとandroidです.これらは比較的最近バージョンですらsvgをサポートしないものがある上,かなりのシェアを占めているがために無視出来ない存在です.その為,これまではjavascriptを使ってブラウザ環境を調査し,svgのサポート状況によってsvg画像と代替のpng画像とを切り替えるといった処理を行なっていました.しかしこの方法ではjavascriptが動作しない環境ではどうしようもありません. 本記事ではスクリプトレスでこの画像の切り替えを実現させようというもので,svgの使い方のシナリオごとに対処策を探るものです.特に懸案だった背景画像におけるフォールバックが解決したため,ほぼすべてのケースで対処可能となりました. ※01/22補足)この記事はスタイルとともにスクリプトについてもう少し広がりそうなので,別記事としてまとめました. ※
![スクリプトレスなsvgのフォールバック手法・まとめ](https://cdn-ak-scissors.b.st-hatena.com/image/square/d095d29a0e063b0ea907e36b9cc3f45754b826f9/height=288;version=1;width=512/http%3A%2F%2F3.bp.blogspot.com%2F-aZwg2-5jA6I%2FUP08PnpmYeI%2FAAAAAAAAAPI%2FidpjehlCV1w%2Fw1200-h630-p-k-no-nu%2FScreenshot_from_2013-01-21%2B21%3A57%3A46.png)