HTMLメールの画像ってどんな仕組みになっているの？

HTMLメールを配信する際、基本の要素は以下のようになります。

①メール／mail.html
配信原稿。画像はサーバに置いた場所から読み取る必要があるため、絶対パスで記述します。

②ミラーページ／index.html
配信されたメールの画像がユーザー環境で正しく表示されない場合のために用意されたページ。内容は基本はメールと同じ※1。
ただしこちらはデータをサーバ上に置くため、画像は相対パスで記述される場合が多い（例外あり※2）。

③LP（ランディング）ページ／lp.html
メール（およびミラー）からのリンク先に表示されるページ。
ミラーページ同様、データをサーバ上に置くため、画像は相対パスで記述される場合が多い（例外あり※2）。

④画像フォルダ／images
メール（およびミラーページ）、ランディングページで使用する画像。

ミラーページへの誘導文言や差し替え用のタグを削除したり、メールとは文字コードを変える場合もある。

ミラーページ、ＬＰページと画像フォルダを違うサーバもしくはディレクトリに置く場合は絶対パスで記述することもあります。これらのディレクトリ構成は、事前にシステム管理者に確認をしておくとテスト配信から本番配信への流れがスムーズになります。

メールはサーバにデータを置かずに、システムを通じて配信されるので、画像の場所は必ず絶対パスで記述する必要があります。
一方、ミラーページ・ランディングページ・画像フォルダのデータはサーバ上に置きます。これらは多くの場合は同じディレクトリ内に置かれるため、画像の場所は相対パスで記述される場合が多いです。