# DomainConnectでの画像変換について

## 画像リアルタイム変換・最適化機能について

当サービス（Domainconnect）では、画像ファイルのURLにパラメータを付与することで、リアルタイムに画像のリサイズ、フォーマット変換、圧縮率の調整を行うことができます。

変換された画像はエッジサーバーでキャッシュされるため、2回目以降のアクセスは高速に配信されます。

料金は無料です。

### 基本的な使い方

画像URLの末尾に `?` をつけ、続けてパラメータを指定します。複数のパラメータを指定する場合は `&` で繋ぎます。

例:

Plaintext

```
https://example.com/images/photo.jpg?w=800&q=80
```

***

### 利用可能なパラメータ一覧

| **パラメータ** | **説明**                                                                | **指定例**     |
| --------- | --------------------------------------------------------------------- | ----------- |
| w         | 画像の幅 (width) をピクセル単位で指定します。                                           | `?w=300`    |
| h         | 画像の高さ (height) をピクセル単位で指定します。                                         | `?h=300`    |
| q         | 画像の品質 (quality) を `1`〜`100` で指定します。数値を下げるとファイルサイズが軽量化されます。（デフォルト: 80） | `?q=60`     |
| fmt       | 画像のフォーマットを変換します。(`jpg`, `png`, `webp` など)                             | `?fmt=webp` |

***

### 詳細仕様

#### 1. リサイズ (`w`, `h`)

画像のサイズを変更します。

* 幅 (`w`) のみ指定した場合:
  * アスペクト比（縦横比）を維持したまま、指定した幅にリサイズされます。
* 高さ (`h`) のみ指定した場合:
  * アスペクト比を維持したまま、指定した高さにリサイズされます。
* 幅 (`w`) と 高さ (`h`) の両方を指定した場合:
  * 「Cover」モードで動作します。指定されたサイズになるように画像を拡大・縮小し、はみ出た部分は自動的にトリミング（中央切り抜き）されます。画像の歪みは発生しません。

#### 2. 画質調整 (`q`)

画像の圧縮率を制御します。Webサイトの表示速度を向上させるために有効です。

* 範囲: `1` (低画質/軽量) 〜 `100` (高画質/重量)
* デフォルト: 指定がない場合は `80` が適用されます。
* 推奨値: 通常のWeb表示であれば `60`〜`80` 程度が推奨されます。

#### 3. フォーマット変換 (`fmt`)

元の画像の形式に関わらず、指定した形式に変換して配信します。次世代フォーマット（WebP）への変換に利用できます。

* 対応フォーマット: `jpg` (または `jpeg`), `png`, `webp`
* 利用シーン: 背景透過が必要な場合は `png` や `webp` を利用してください。写真などのファイルサイズを劇的に減らしたい場合は `webp` が有効です。

***

### 具体的な使用例

**ケース1：サムネイル用に幅を300pxにする**

アスペクト比を維持したまま小さくします。

Plaintext

```
https://example.com/banner.jpg?w=300
```

**ケース2：正方形のアイコンとして切り抜く**

幅と高さを同じ値に指定すると、画像の中央を基準に正方形にトリミングされます。

Plaintext

```
https://example.com/profile.jpg?w=150&h=150
```

**ケース3：WebP形式に変換して軽量化する**

元の画像がJPEGやPNGであっても、WebPとして配信します。

Plaintext

```
https://example.com/photo.png?fmt=webp
```

**ケース4：画質を落として通信量を節約する**

モバイル回線向けなどに、画質を50%に落として配信します。

Plaintext

```
https://example.com/hero-image.jpg?q=50
```

***

### キャッシュとパフォーマンスについて

* キャッシュ:

  一度パラメータ付きでアクセスされた画像は、変換後の状態でサーバーにキャッシュ（保存）されます。同じパラメータでの2回目のアクセスからは、画像処理を行わずキャッシュを返すため、非常に高速に表示されます。
* オリジンへの負荷:

  画像処理は当サーバー上で行われるため、オリジンサーバー（元の画像があるサーバー）へのCPU負荷はかかりません。