web-dev-qa-db-ja.com

再設計が明るすぎると言っているユーザー?

私たちは最近、人気のあるフォーラムの再設計を開始しました。多くのユーザーは、再設計が明るすぎて読むにはあまりにも明るくて、フォーラムには明らかに良くないと言っています。

これが典型的な投稿とサイトのスクリーンショットです。

enter image description here

大きいバージョン

たとえば、背景の白が古いサイトと同じ白で、テキストを暗くするなど、意図的に古いサイトから大きく逸脱しないようにしました。私たちはフォントを黒くして、それをopen sansに変更しましたが、これにより、サイトのエクスペリエンスが改善され、減衰されないのではないでしょうか。変更された他の唯一のものは、サイトの周りの青です。サイトを明るく感じさせているのでしょうか。

サイトの明るさを低下させたり、読みやすさを向上させるためのヒントはありますか?

私はこれらの関連する質問を通過しました:

そして、私がそのスクリーンショットから変更したことの1つは、純粋な黒の使用を中止し、代わりに柔らかい色合いを使用することです。

8
Alan Hollis

ここでの他の答えとは逆に、サイトの色の選択については特に問題はありません。

私たちは一日中、明るい背景と暗いテキスト(MS Word、StackExhcange、多くのIDEなど)を調べています。

私は、人々があなたのサイトの色について不平を言っていないという直感を持っています。彼らはあなたが彼らのサイトのデザインを変えたと不平を言っています。 「彼ら」のサイトは、ここで重要な要素です。成功したオンラインコミュニティには、これが「自分の」サイトであると感じる大勢のメンバーが含まれます。そして、これは正当化されます。そして、誰かが来てあなたのサイトのデザインを変更するとき、誰もそれを好きではありません。

私の推測では、彼らは変化に対してより動揺している-変化が具体的に何であるかではない。将来、大規模なオンラインコミュニティがある場合は、変更を管理するようにしてください。人々が来ていることを知っていることを確認してください。ベータアクセスを開きます。等。

この時点で、妥協します。テキストを少し明るくするか、背景を少し暗くします。彼らの不満が聞かれ、それに応じていくつかの変更が行われたように感じさせます。

7
DA01

問題の原因は、非常に明るい背景を継続的に見つめていることです。これにより、網膜の細胞が疲労し、読書がほとんど不可能になります。

2つの修正があります。

  1. 非常に明るい大きな背景の使用は避けてください(そうです!)。大きな表面は明るい白以外のものでなければなりません。
  2. 変化。この問題は、明るすぎるものが原因ではありません。 (あなたが同じ白を使用したと言ったように。)それはユーザーによって引き起こされますonly明るい背景を持つものを常に見ています。人々が見るより暗い表面があるべきであるので、目は休むことができます。大きな画像、色付きの背景のタイトル、サイドバー...は、人々が何かを見て時間を費やしている限り、何でも重要ではありません。読書に最適なのは、フォントを非常に大きくすることです。これにより、網膜に多くのバリエーションがあり、適切な平均的な明るさが得られますが、通常は実際的ではありません。背景に微妙な低コントラストテクスチャを与えることもできます。
6
Ville Niemi

UIが改善されたようで、以前よりも実際に読みやすくなりました。画面の読みやすさを向上させるために、serifフォントからsans-serifに変更しました。読みやすさに影響する要素は次のとおりです。

  • 読みやすいフォントの選択

  • 読みやすいフォントサイズ

  • 十分なコントラスト

  • 適切な長さの線

  • 明確なセクション

参照: フォントへの影響と変換時の読みやすさ

しかし、多分あなたの不平を言うユーザーは何か他のものを期待しました。ログインしている場合は、設定メニューで管理できるサイトのさまざまなテーマを使用して、UIを自分で変更できるようにしたいと思うかもしれません。読みやすさと配色に関しては、多くの選択肢があります。白地に黒である必要はありません。以下は、カラフルな背景の黒いテキストのカラフルな例(私がそれらを選択しなかったとしても)で、すべてがcontast比率を超えて読みやすくなっています。

enter image description here

参照: いくつかのコントラスト比で合格する色の黒いテキスト

その他の例は、GoogleのGMailアプリにあります テーマ設定

enter image description here

それは頭に浮かぶいくつかのアイデアにすぎません。もう1つの方法は、調査でユーザーにあなたのブランドの新しいデザインについてどう思うか、そして何が欠けていると感じているかを尋ねることです...

3
Benny Skogberg

私は、セリフからサンセリフへの変更と組み合わされ、事実上白い背景に非常に黒いフォントを使用すると、特に非常に明るいフォントでサイトに移動するときに、ゴーストコントラストの問題が発生する可能性があると思います。

Sans-serifフォントを使用すると、ストロークが一定の幅になるため、全体的にページ上のインクが多くなり、「斜視」効果は非常に濃い灰色になります。これらの例はガイドとしてのものですが、次のような細かい効果があります(左側)。

enter image description here

一方、セリフフォントでは、細部のストロークが細いため、ページ全体のインクが少なくなり、「斜視」効果は中程度から濃い灰色になります。

enter image description here

非常に暗いテキストと非常に明るい背景のテキストを読むとき、別の明るい領域を離れると、ゴーストラインのセットが表示されます。たとえば、次のようになります。

enter image description here

これで、Twitterのフォントはさらに軽くなりましたが、サンセリフですので、全体的な斜視効果は次のようになります。

enter image description here

さて、Twitterはあなたのフォーラムとは異なる行間隔になっていることに注意してください。

誰かがあなたのサイトをしばらく読んでからTwitterに切り替えると

  • a)彼らはすでにハイコントラストから目の疲れを感じています
  • b)ゴースト効果が大きい
  • c)行間隔が異なる
  • d)Twitterのフォントの色が明るい

その結果、ゴースト効果が消える間に目が調整するのに時間がかかるかなり厄介な干渉パターンが存在するために、多くの要素が適切に機能します。

enter image description here

見る場所によっては、干渉パターンが減ったり、複雑になったりして、水泳効果のようになり、一部の領域に焦点を合わせることが難しくなります。

これが間違いなく問題であるとは言い難いですが、これが少なくとも状況を改善していない可能性は十分あります!

ストーリーの残りの部分については、@ BennySkogbergsの回答を参照してください:)

2
Roger Attrill