Web制作においては画像加工は必須になっており、その作業を効率することで時短もできると考えています。Adobe系ツールではほとんどのことができると思いますが、ここでは無料で使えるサイトを集めました。
あさんては簡単な加工であれば Figma でやることが多いのですが、やり切れない加工や作業が面倒な場合にこれらのサイトを活用しています。
Table of Contents
Webブラウザが対応している静止画フォーマットは、2023年末時点で、GIF、JPEG、PNG、SVG、WebPの5種類であり、アニメーション系として APNG、AVIF の2種類がサポートされています。
BMP、ICO、TIFF はWebブラウザの観点ではサポートされなくなる可能性がありますので、使用を控えましょう。
また画像フォーマットにより、同等レベルの画質であってもファイルサイズが異なる場合がありますので、画像の特製に合わせてフォーマット変換を行うことで、Webアクセス速度を向上させることもできます。
下記は無料で静止画フォーマット変換を行えるサイトの一覧です。一部、枚数やファイルサイズに制約があるものがありますので、詳細は直接ご確認下さい。
一般的にフォーマット変換を繰り返すことで画質が劣化しますので、できるだけ少ない回数で変換できる手段を選ぶようにしましょう。
| フォーマット 変換 | To | |||||
| JPG | PNG | SVG | GIF | WEBP | ||
| From | JPG | ー | [ I♥IMG ] [ Adobe Express ] [ Media.io ] [ Aiseesoft ] | [ Adobe Express ] | [ I♥IMG ] [ Aiseesoft ] | [ Media.io ] [ さるわか ] |
| PNG | [ I♥IMG ] [ Adobe Express ] [ Media.io ] [ Aiseesoft ] [ さるわか ] | ー | [ Adobe Express ] | [ Aiseesoft ] | [ Media.io ] [ さるわか ] | |
| SVG | [ I♥IMG ] [ Aiseesoft ] | [ Aiseesoft ] | ー | [ Aiseesoft ] | ||
| GIF | [ I♥IMG ] [ Aiseesoft ] | [ Aiseesoft ] | ー | [ さるわか ] | ||
| WEBP | [ I♥IMG ] [ Aiseesoft ] | [ Aiseesoft ] | [ Aiseesoft ] | ー | ||
| TIFF | [ I♥IMG ] [ Media.io ] [ Aiseesoft ] | [ Media.io ] [ Aiseesoft ] | [ Aiseesoft ] | |||
| BMP | [ I♥IMG ] [ Media.io ] [ Aiseesoft ] | [ Media.io ] [ Aiseesoft ] | [ Aiseesoft ] | |||
| HEIC | [ I♥IMG ] | |||||
| RAW | [ I♥IMG ] | |||||
画像処理について機能別にサイトを並べました。今後も役に立つサイトや性能が良いサイトを見つけ次第、追記していく予定です。
画像処理ツールでも簡単にできるのですが、サイト上で提供されているサービスもあります。
サイズ方法の変換としては大別すると従来型のフィルタリングを用いたスケーリング方法と、AI技術などを取り入れた高度なスケーリングの2種類が存在します。フィルタリングやAI技術にも差異があり、画質が重要な場合はいくつかのサイトで試して比較するのが良いでしょう。
Rembg という高精度なAIモデルが無料公開されていることもあり、サイトも無料サービスのものが多く存在しています。
例えば写真から電線を削除するようなときに用います。実際の写真を加工する際に便利なサイトです。
「背景削除」や「オブジェクト削除」でうまく削除できて、PNGフォーマットで出力することも多いのですが、特にイラスト系などではうまく削除ができない場合があります。その際には具体的にどのRGB画素が透過にすべきかを指定して透過PNGを削除することができます。
プライバシー重視の昨今、顔にモザイクをかけなければいけないケースも多くあり、それを自動化できると効率的に対応できます。
使いたい画像がトリミング等で切れている場合に、それを生成する機能です。バランスの良い配置の写真が欲しいときに重宝します。
まだ使いこなししていないのですが、オリジナルの画像に近い画像をAIが生成してくれる機能です。少し使った感じでは、まだ得意、不得意がありそうなのですが、AIの進化は早いので着目はしておこうと思います。
Watermark と呼ばれるテキストなどを画像に透かしとして入れます。権利画像などに用います。「透かしを削除する」機能は「オブジェクト削除」と近しい機能です。
“開発ツール” に関わる関連投稿です。
ブログの管理者 : あさんて
Web制作はやりがい。
食べることは生きがい。
Table of Contents
