Microsoft Outlook で表示すると、メールの見た目が異なります

このページで学べること

Microsoft Outlook では、他の受信トレイと比べて一部のメールの見た目が異なる理由と、Outlook でメッセージの表示（レンダリング）の一貫性を高めるためのヒントをご紹介します。

Outlook のレンダリング エンジン

Outlook の一部のバージョンでは、メールを表示するために Webkit（HTML を想定どおりに解釈してレンダリングする最新のブラウザ エンジン）を使用しますが、多くのバージョンではレンダリング エンジンとして Microsoft Word を使用します。

Microsoft Word で表を編集したり、画像のサイズを変更したりしようとした直近のことを思い出してください。Word を使用する際に直面する書式設定の課題は、Outlook の受信トレイにおけるメールが直面する課題と似ています。

このため、メールは Outlook では、Klaviyo で最初にデザインしてプレビューしたときと比べて、少し異なって表示される場合があります。

Outlook 向けにメールを最適化する場合は、Klaviyo に組み込まれた受信トレイテストを使用して、さまざまなデバイスや受信トレイでメッセージをプレビューします。

Outlook 向けにメールを最適化する

Outlook では、次の問題が発生する場合があります：

• div とテーブルセルの背景画像はサポートされていないか、表示されません。
• CSS の float と position 要素が無視されます
• テキストの影はサポートされていないか、表示されません
• これらの要素のサポートが不十分なため、パディングとマージンが通常と異なる
• これらの要素のサポートが不十分なため、CSS の幅と高さが意図どおりに表示されません
• ネストされた要素の背景色が誤って表示される、または無視される

最近のバージョンの Outlook 向けにメールを最適化するには、確立されたガイドラインがないため、多くの時間と広範なテストが必要になる場合があります。また、これを行うには画像の配置方法に大幅な変更が必要であり、他のメールクライアントやデバイスでのメールの表示が崩れる可能性があります。

Outlook 向けの画像サイズ調整

Outlook の受信トレイでよくある問題の 1 つに、画像が引き伸ばされたり大きくなりすぎたりすることがあります。これを避けるには、テンプレート内のすべての画像に幅を設定してください。

1. 画像ブロックを選択します。
2. 画像レイアウト > W フィールドに数値を追加してください。全幅画像の場合は 600 px（または、スタイル セクションで確認できる、メールに設定されている任意の幅）を使用してください。
   

3. その後、変更を保存します。

Outlook での GIF

Outlook はメールで GIF をサポートしていません。Outlook では、動く画像を表示する代わりに、GIF の最初のフレームを選択して静止画として表示します。

Outlook がオーディエンスに与える影響を理解する

Outlook を使用してメールを開封しているオーディエンスの割合を確認するには：

1. Klaviyo の [キャンペーン] タブに移動します。
2. 最近送信したキャンペーンをクリックします。
3. キャンペーンの概要の [デリバビリティ] タブをクリックします。
4. メールドメイン別パフォーマンス セクションを確認して、Outlook を使用してメッセージに反応した受信者の割合を確認してください。

その他のリソース