マークアップ・エンジニアのためのSVG入門 第1回 SVGコードの基本 この記事ではまずSVGのコードとしての基本と、さまざまな実装方法を概観してみましょう。それぞれの特徴を捉えられると、実装方法の選択が適切にできます。 はじめに SVGは、Android2.0系やIE8では対応していませんので、今の段階で気軽には使いづらい技術です。しかし、iOS Safari向けのWebページなど、限られた環境に向けては効果を発揮します。今回はマークアップエンジニアが知っておくべきSVGの仕様や使い方を見直してみましょう。 画像でありテキストである 「SVG=スケーラブルなベクター形式」は、SVGの大きな特徴です。このことは多くの人が認識しているでしょう。 ラスタ形式は特に拡大に弱く、拡大するとドットが目立つ。一方、ベクター形式は拡大しても画像の劣化はない。 SVGにはソースコードが存在し、これにより画
![マークアップ・エンジニアのためのSVG入門 | 第1回 SVGコードの基本](https://cdn-ak-scissors.b.st-hatena.com/image/square/bea2b810965bdd81c0dc57a81cf00bd8ec28270e/height=288;version=1;width=512/https%3A%2F%2Fcodegrid.imgix.net%2Fimage.png%3Fixlib%3Djs-3.8.0%26w%3D1200%26h%3D630%26mark%3Dhttps%253A%252F%252Fcodegrid.imgix.net%252F~text%253Fixlib%253Djs-3.8.0%2526w%253D1000%2526txt%253DSVG%2525E3%252582%2525B3%2525E3%252583%2525BC%2525E3%252583%252589%2525E3%252581%2525AE%2525E5%25259F%2525BA%2525E6%25259C%2525AC%2526txt-fit%253Dmax%2526txt-size%253D57%2526txt-font%253DHiragino%252520Sans%252520W5%2526txt-color%253Dfff%26mark-x%3D90%26mark-y%3D195%26blend%3D%2523D81D1B%26blend-mode%3Doverlay%26txt%3D%25E3%2583%259E%25E3%2583%25BC%25E3%2582%25AF%25E3%2582%25A2%25E3%2583%2583%25E3%2583%2597%25E3%2583%25BB%25E3%2582%25A8%25E3%2583%25B3%25E3%2582%25B8%25E3%2583%258B%25E3%2582%25A2%25E3%2581%25AE%25E3%2581%259F%25E3%2582%2581%25E3%2581%25AESVG%25E5%2585%25A5%25E9%2596%2580%2520%257C%2520%25E7%25AC%25AC1%25E5%259B%259E%26txt-align%3Dtop%252Cleft%26txt-font%3DHiragino%2520Sans%2520W5%26txt-size%3D30%26txt-pad%3D100%26txt-color%3Dfff)