iOS 13、ダークモード、およびAppleの新しいiPhone:メールマーケターが知っておくべきことは次のとおりです

公開: 2019-09-20

今日、何千人ものiPhoneファンが、新しいiPhoneを手に入れるためにAppleストアに足を運びます。 さらに、今後数日でさらに多くの携帯電話がiOS 13(Appleの最新のモバイルOS)にアップデートされる予定です。 あなたの購読者がそれらの中にいる場合、それはあなたの電子メールの見た目に影響を与えますか?

新しいiPhoneの画面サイズと解像度は同じままですが(これはメールマーケターにとって素晴らしいニュースです!)、注意しなければならないことが1つあります。iOS13では、AppleはネイティブiOSメールアプリを含む携帯電話にダークモードを導入しています。 —そしてそれはあなたの電子メールがあなたのクライアントにどのように表示されるかに影響を与えるかもしれません。

Appleのアップデートに注意を払う必要がある理由

すべての電子メールの27%がAppleのiPhoneで読ん、Appleの携帯電話への変更、モバイルオペレーティングシステム、およびその電子メールのレンダリングには、電子メールマーケティングの世界に大きな違いを生むことができます。 あなたの聴衆が世界平均に似ていて、あなたの購読者の多くがiPhoneであなたの電子メールを開いているのを見たら、あなたはあなたの電子メールが見栄えが良く、その読書環境で機能することを確認する必要があります。

真新しいiPhoneテストデバイスに数千ドルを費やしたくないですか? あなたはする必要はありません。 最新のiPhoneでのiOS13のメールプレビューがLitmusで利用できるようになったことをお知らせします。

あなたのメールはiOS13でどのように見えますか?

iOS13がiPhone11用のLitmusEmailPreviewsを使用してメールをレンダリングする方法をご覧ください

詳細→

新しいiPhoneの画面サイズと解像度

Appleの9月のリリースでは、iPhone 11、iPhone 11 Pro、iPhone 11 ProMaxの3つの新しいiPhoneが発表されました。

画面サイズがiPhone11の場合は6.1インチ、iPhone 11 Proの場合は5.8インチ、iPhone 11 Pro Maxの場合は6.5インチで、新しいiPhoneの寸法は以前のiPhone(iPhone XR、XS、およびXS Max)と同じです。 。 解像度、ピクセル密度、ピクセル密度比も同じです。

iPhone 11

iPhone 11

iPhone XR

画面サイズ

6.1インチ

6.1インチ

解像度

1,792 x 828

1,792 x 828

画素密度

326ppi

326ppi

ピクセル密度比

2

2

iPhone 11 Pro

iPhone 11 Pro

iPhone XS

画面サイズ

5.8インチ

5.8インチ

解像度

2,436 x 1,125

2,436 x 1,125

画素密度

458ppi

458ppi

ピクセル密度比

3

3

iPhone 11 Pro Max

iPhone 11 Pro Max

iPhone XS Max

画面サイズ

6.5インチ

6.5インチ

解像度

2,688 x 1,242

2,688 x 1,242

画素密度

458ppi

458ppi

ピクセル密度比

3

3

デバイスサイズの変更は、メールマーケターやデザイナーにとって素晴らしいニュースではありません。 過去に特定のメディアクエリを使用してAppleの各iPhoneをターゲットにしたことがある場合、それらはAppleの最新モデルでも同様に機能します。

特定のサイズをターゲットにせず、レスポンシブスタイルをトリガーするためにブレークポイントを使用する場合、そのブレークポイントは以前のiPhoneモデルと同じ414pxであるため、変更を加える必要もありません メディアクエリをtargetmax-device-width:414pxに設定すると、レスポンシブスタイルが3つの新しいiPhoneモデルすべてに表示されるようになります。

 @media screen and (max-device-width: 414px) { /* Insert styles here*/ }

ダークモードがAppleのiPhoneに登場

昨年、Appleはデスクトップオペレーティングシステムダークモードを導入しました。これにより、MacOS Mojaveのユーザーは、すべてのウィンドウ、ビュー、メニュー、およびコントロールを暗いカラーパレットに切り替えることができ、暗い環境やでの作業に適したインターフェイスになります。夜。

iOS 13では、この人気のある機能がAppleのiPhoneにも導入されています。 それがあなたのメールにどのように影響するか見てみましょう。

ダークモードとブライトモードのiOS13のiOSメール受信ボックス

iOS13のダークモードでのメールのレンダリング方法

最初の朗報:MacOSのダークモードと同様に、AppleのiPhoneの新しいダークモードはデフォルトではHTMLメールに影響を与えません。 ダークモードは、個人用およびプレーンテキストの電子メールにのみ適用されます。 HTMLメールで背景色を定義していない場合でも、背景は白でレンダリングされます。 そのため、ダークモードでコードをいじったり、通常のHTMLメールのレンダリングエクスペリエンスをすぐに使用したりすることを心配する必要はありません。

iOS 13ダークモード:プレーンテキストのメールは暗い背景でレンダリングされますが、HTMLメールは影響を受けません。

ただし、明るい色の電子メールの背景は、ダークモードで電子メールを読むサブスクライバーにとって非常に不快な体験を生み出す可能性があります。 画面を暗い受信トレイビューから非常に明るい電子メールに(またはその逆に)切り替えることは、目に疲れてしまい、購読者にとって素晴らしい読書体験にはなりません。

では、読書体験を向上させるために何ができるでしょうか。 MacOSのダークモードでは、メールの設計者と開発者はダークモードを具体的にターゲットにする機会がありませんでした。 代わりに、彼らができることは、明るいビューと暗いビューの両方でうまく機能する色の選択を選択することだけでした。

ただし、iOS 13では、電子メール開発者はダークモードをターゲットにして、ダークモードで開くサブスクライバーにカスタムエクスペリエンスを提供できます。

iOS13でダークモードをターゲットにする方法

今年の夏にiOS13ベータ版で遊んでいるときにemailgeekのThomasSteinerが気付いたように、Appleは、ダークモードに設定されている電子メールクライアントを具体的にターゲットにできるまったく新しいメディアクエリを導入しました。

私たちの実験では、iOSでダークモードをターゲットにするのは驚くほど簡単であることが示されています。

 @media (prefers-color-scheme: dark) { /*Insert all your dark mode classes here, as you would insert mobile responsive classes./ /* Remember to use !important to override inline styles */ }

このメディアクエリを使用すると、ダークモードに設定されているクライアントでメールを開いたときにのみ適用されるカスタムスタイルを設定できます。 つまり、ダークモードで開くサブスクライバーには、さまざまな背景色、フォントの色、さらには画像を使用できます。

実際の動作を見たいですか?

iOS13ダークモード用に最適化された最近のウェビナーメールの1つは次のとおりです。

iOS 13ダークモードで開くと、メールは暗い背景を使用して表示されます。 さらに、暗い背景にLitmusのロゴが表示されるようにするために、このメールでは、ロゴの別のバージョン(白いフォントを使用したもの)を使用して、読みやすく、ダークモードで見栄えがするように設定しています。 。 あなたはここで完全な電子メールコードをチェックすることができます

今すぐiOS13でメールのテストを開始してください

iPhone 11用のLitmusメールプレビューはLitmusアカウントで利用できるため、すぐにテストを開始できます。 まだリトマスの顧客ではありませんか? 今日からリトマスを始めましょう。