ダークモードへの対応について

SmartNewsでは、iOSのみ設定画面からダークモードに対応した表示に切り替えることができます(※2019年10月1日時点)。

ダークモードとは、画面内の配色を黒をベースにした暗めの色にする機能です。暗いところで画面を見続けても目が疲れにくくなるほか、画面が有機ELのiPhoneではバッテリーの節約につながることもあると言われています。

基本的には、ダークモードにおいてもメディアパートナーの皆さまから配信いただいた記事の視認性は変わりませんが、2点だけ、ダークモードのための対応を推奨している箇所があります。

記事面の【サイトロゴ】とチャンネルを追加する「もっと」チャンネルにおいて表示する【アイコン】の2カ所については、通常のライトモードとは見え方と変わるケースがございます。

 

image3.png

▲左が通常モード(ライトモード)、右がダークモード

 

記事面のサイトロゴについて

対象:SmartNewsに記事配信をいただいているすべてのSmartFormat

記事面のサイトロゴについては、現在SmartFromatにて記事をご提供いただいている、すべての媒体様が対象となります。

推奨:SmartFormat上でダークモード対応を宣言するタグ <snf:darkModeLogo> を挿入する

<snf:darkModeLogo>を挿入いただくと、ロゴのデータを変更せずに以下のようなダークモード対応の表示にさせることができます。

image4.png

宣言するタグを入れない場合も特にデータの変更は不要です。
その場合は、記事面のサイトロゴに白背景を入れさせていただきます。

image2.png

ダークモード対応のサイトロゴの設定タグは、媒体者様で設定いただく必要がございます。詳しい設定方法は、サイトロゴを指定するをご確認ください。

 

「もっと」ページのアイコンについて

 

image1.png

▲左が通常モード(ライトモード)、右がダークモード

 

対象:チャンネルプラスをお持ちの媒体

好きなチャンネルを追加できる「もっと」のページに表示するアイコンの表示について、一部アイコンの視認性が低下する場合がございます。これは、アイコンそのものが黒ベースのカラーで、その背景が透過するようなアイコンデータの時にダークモードの黒背景によってアイコンの境界が曖昧になるためです。

推奨:背景色を変更する場合、色コードを「#F5F5F5」に設定いただくとライトモード時とダークモード時で齟齬が出ません。

アイコンデータの差し替えをご希望の場合、こちらの入力フォームにて、メディアリレーション事務局まで新しいデータ(縦200px×横200pxのPNG形式)をご送付ください。