広告あり

デザインデータを軽くするために気をつけていること【画像編】

WEBデザイン

画像を多用したデザインデータを作成していると、とんでもないデータサイズになっていたりしますよね。データが重たいと作業する人の気分まで重くなり、モチベーションが下がり、作業スピードも落ち、それに付随してクオリティも…なんて事態に繋がりかねません。

質を落とさず、いかにサイズを抑えられるか。

Webサイトのデザインをしているとき、これを常々気にしながら他の方の意見を参考にしつつ自分なりのやり方を模索しているところです。

そこで本日は、デザインデータ軽量化のために気をつけていること。特に、画像の適切な使い方についてまとめていきたいと思います。

Sponsor

その1. 大きな画像は必要なだけの大きさにリサイズする

最近のスマホやデジカメで撮った写真は、そのままの状態だと不必要に大きすぎる事が多々あります。必要なサイズを把握しておいて、必ずリサイズします。

画像をバウンディングボックスで縮小したところで、画像のデータサイズ自体は変わらないっていうのは意外と知らない人もいるんじゃないでしょうか。見た目の割に要領を食っていたりするので要注意ですよ。

この処理だけでもかなり軽くする事ができます!

その2. 画像圧縮サービスを使用する

無料で画像を軽量化してくれる画像圧縮サービスがいくつかあります↓

私はこのあたりのサービスをよく使っています。一度に20個まとめて投下できる上に、そこまで画質を落とさずに軽くしてくれますよ。

その3. ラスタライズ 化する

IllustratorやPhotoshopでデザインする場合に限られてしまうのですが、オブジェクトツール内のラスタライズ を使用すると画像やオブジェクトのサイズを抑える事ができます。

ただし、ラスタライズ 化することによってオブジェクトは画像化されるなど一部の機能が制限されてしまうため、使用対象は編集する予定のないものに限定しましょう。

さいごに

デザインデータを軽くするために気をつけていること、についてまとめてみました。

自分だけでなく、受け取る側にとってもスムーズに扱えるような、思いやりのあるデザインデータを作成していきたいですね。

今後も試行錯誤を重ねて、アップデートしていきたいと思います〜。

コメント