今日は、現場であった体験をもとに画像の種類とその特性について触れていこうと思います。
現在三択の質問内容に対して答える性格診断アプリを開発現場で作っているのですが、その際下部に三択のTabがあり、ディレクターから参照リストにないオリジナルのアイコンを入れるよう指示がありました。その挿入予定の画像ファイルをみると画像ではなく、パスをはじめとするコードがギッシリ書いてありました。普段ですと挿入予定の画像が見れるはずなのに「？」マークを頭に浮かべ、画像ファイルをよくみると拡張子が「SVG」という見慣れないものであることに気が付きました。普段は「JPEG」や「PNG」などの拡張子の付いている画像を使っていたため、見慣れない拡張子が気になり、調べてみました。
その結果がこちら → https://ferret-plus.com/8445
どうやら特徴としては、伸縮・拡張性に優れた画像形式であり、レスポンシブデザインと好相性なものであるとのことです。また、HTML上で書いたclassをCSSで読み込んだり、JavascriptでAjax通信を行うSPA形式のwebページ・アプリケーションとの整合性も確かであるということです。ここ最近、JavaScriptフレームワークを使用したSPA開発が流行しているため、関連するフレームワーク・ライブラリとともにセットで使用していこうと思います。
ちなみにPNG等その他の画像に関してはこちらに詳しく載っています → https://sole-color-blog.com/blog/103/