サポートページ aero-right

小さく表示させたい画像が、スマホでは大きく表示されてしまいます。対処法はありますか?

Benchmark Emailは、スマートフォンでの表示を自動的に最適化(レスポンシブ対応)する仕様となっております。 そのためフォントサイズや改行が最適化され、受信環境に左右されず読みやすいメールを配信することができます。 しかしながら、「小さく表示させたい画像(ロゴマーク)が、スマートフォンでは大きく表示されてしまう」といったお悩みを時々耳にします。 例えば、ロゴ画像の大きさを下記のようにしたとします。(PC画面での表示の場合)   これをスマートフォンで見た場合、以下のようになりました。 このロゴ画像を、スマートフォンで見た時だけ下記のように少し小さくしたい、という場合の対処方法をご紹介します。   スマートフォン版の表示サイズだけを小さくする方法   使用する画像を、左右の余白を含めた画像へ置き換えることを試してみてください。 今回の例で使用したのは、W50×H73のロゴ画像です。 W50×H73 この画像の左右に空白を足し、追加で2種類の画像を用意します。 W400×H73   W500×H73   ※この画像作成はBenchmark Email上では行えません。画像編集ソフトで作成してください。 実験として、これらの画像を並べてメールデザインを作成します。   まずはPC版での見え方を見てみましょう。 3つの画像の見え方に変化はありません。 では次に、スマートフォンでの表示を確認します。 PC版では同じ大きさに見えていた画像ですが、モバイル版では見え方に差が出ています。 画像の横幅を変えて、お好みの表示サイズへと調整してください。 注意点 ・スマートフォンと一口に言っても、機種やOS、メーラーによって見え方は変化します。 ・今回は表示確認をBenchmark Email上のプレビュー機能で行いました。プレビュー機能での表示はイメージであり、厳密にスマートフォンと同じとは限りません。サイズを拘って調整される場合は、メールを自分のアドレスへ配信するなどして確認してください。 ・W600以上の画像はPC版での表示も変わってしまいます。(幅がPC版枠を超えるため、全体が縮小された結果、小さく表示されます。) ・サイドの空白枠は0で実験を行っています。

テンプレート&メールエディタ 画像ギャラリー 12月 19, 2018