こちらでも時々文中で使用している ←このようなアイコン、SVG(Scalable Vector Graphics)という種類の画像ファイルで、ファイル名の後に.svgという拡張子が付いています。
2001年からある技術ながら、表示するのに専用アプリケーションが必要だったりしてしばらく人気がなかったらしく。
管理人も昔、開けない変な画像という状態で出会って?いて、ずっとそういう感覚でおりました💦
しかし、最近どこかのWebページで再会!?し、 気になったので・・・
早速検索などしてみますと、いつの間にかWordやExcelなど、一般的なソフトウエアで扱えるようになっておりました。
その画像の特徴がWebサイトのスマホ表示の進化とも相性が良かったりで・・・近年ますます勢力拡大中なのだとか。
ということで、
早速使っております。
唐突ですが、SVGは、ベクター画像という仲間に属しております☆
と、わかった風に書いてみましたが、管理人は、実際にWebの学習をするようになるまでは、この仲間分けには興味がありませんでした。が、いまやこれは結構使える知識なんではないかと思っています。
Web講座テキストなどで知ったのですが、画像ファイルはざっくり以下の2種類に分かれていて・・・
ラスター画像/Raster graphics (ビットマップ画像)
色のついた小さい点をパーツのように扱い、その配置具合で表現された画像。
主な拡張子(ファイル名の後ろに付く文字列):
.jpeg – 写真でよくあるタイプ。
.png、.gif、.tiff – WindowsのPCに付いているお絵描きソフト”ペイント”で書かれたイラストを保存するときに出てくるファイル形式の選択肢などに登場。
.webp – 最近見かけることが増えてきた、写真も軽量でWeb向きになる方式、”ウエッピー”。
( ※.pdf は、作成の経緯により、ベクター/ラスターどちらの場合もあるようです。)
得意:
画像が鮮明で、微妙な色合いが表現できる
不得意:
画像を大きくしたとき、ギザギザしてぼやけた状態が目立つことがある。データ量が多くなりがち
ベクター画像/ Vector graphics (ベクトル画像)
円や直線などのような解析幾何学的な「図形」の集まりとして表現された画像。
主な拡張子(ファイル名の後ろに付く文字列):
.cgm – CAD図面など、技術現場で登場。
.emf – Power Pointの画像保存時に選択肢で登場。
.svg – 資料や、Webページ作成時のアイコン作成で登場。
( ※.pdf は、作成の経緯により、ベクター/ラスターどちらの場合もあるようです。)
得意:
拡大、縮小しても形がぼやけない
不得意:
写真など、微妙な形や色の変化がたくさんある画像は表現しきれない
なのだそうです。
実際はこんな感じです。
一方、SVGは、ベクター画像なので・・・
大きくしても、小さくしても様子に変わりなし
〇こちらでもアイコンを使わせていただいている素材サイトをご紹介☆
SVG、JPG、PNG形式のアイコン素材を(再配布禁止などの使用条件を守って)無料ダウンロードできる
ICOOON MONO https://icooon-mono.com/
尚、SVGは、いまやExcel やWordにも(私の使用しているExcel ・Wordではドラッグアンドドロップではなく、図の挿入ですが)使えて、Power Pointにも使えるようになっているとか。
こちらのページを作成しているWordPressというCMS (過去関連記事→専門知識はいらない? CMSって何者? )では、安全上の配慮から、ひと手間かけないと使用できない状態ではありますが、一応使えております。
画像ファイルのSVG(Scalable Vector Graphics)、いつのまにかメジャーになってたんですね。
「参考にするなら記事が書かれた時期に気を付けてねー」という先生のお言葉、納得です💦