フォントサイズを強制的に変更しないでください
新しいサイトにアクセスするたびに、ブラウザのフォントサイズ設定を絶えず変更したくありません。
混雑したページの見栄えが良いことを証明しないでください
情報に満ちたページがあるサイトは視覚的に魅力的ではありません-ひどいです。 ページをあらゆる種類のもので埋めても、ユーザビリティにプラスの効果はありませんでした。 それはただ怠け者の母親があなたに私たちの頭にすべてのこの情報をダンプさせることです。 正確に何が最も重要かを事前に考えて決定してください。 私たちはあなたのためにあなたの仕事をしたくありません。
スクロールが悪いのでこすらないでください
この場合、すべてのサイトが悪いためです。 Webページのスクロールは絶対に大丈夫です。 なし。 本のページをめくることに何の問題もないように。
テキストは重要ではないことを教えてはいけません
一般にWebデザインと呼ばれるものの95％はタイポグラフィです。
眼鏡をかけ始める必要はありません
代わりに、スクリーンに向かって鼻をこするのをやめて、椅子に背を向けて（！）、リラックスした姿勢でこの記事を読み続けてください。
5つの簡単なルール
1.長いテキストのブラウザプリセットフォントサイズ
現在読んでいるテキストのフォントサイズ[つまり、元の-約。 ヒース]-大きくない。 これは、ブラウザがデフォルトで設定するサイズです。 ブラウザを作成するとき、この特定のサイズのテキストを表示すると想定されていました。
フォントを増減するためにボタンを押す必要はありません。 設定を変更 したり、設定を変更 したりする必要はありません[オリジナルでは、「設定」という単語が使用されました。 ヒース]。 読みたいだけです。 私たちはあなたが私たちの好みに適応することを望みます。
最初は、大きなフォントサイズで適切なサイトレイアウトを作成することははるかに困難です。 しかし、この複雑さは、よりシンプルでアクセスしやすく、理解しやすいサイトを作成するのに役立ちます。 サイトに情報を詰め込むのは簡単ですが、シンプルで使いやすいものにすることは困難です。 最初は、ブラウザのフォントサイズがどれだけ大きいかにショックを受けるだけです。 しかし、しばらくすると、100％または1 em未満のテキストを読みたくなくなるだけです。 最初は大きいように見えますが、慣れるとすぐに、ブラウザがデフォルトでそのようなサイズを使用する理由を理解できます。
2.より多くの空きスペース
テキストを呼吸させます。 空きスペースの使用は、デザイナーのばかげた癖ではありません。 これは好みの問題ではありません。
設定されたバーの幅は、フォントのサイズに比例する必要があります。 太すぎる線は目を疲れさせ、心理的な悪影響を引き起こします。 また、列が狭すぎると、読み取りの連続性が損なわれるため、迷惑になります。 目を頻繁に動かして線を変更すると、読み手から離れてしまいます。テキストの周囲に空気が存在すると、ストレスが軽減され、テキストの本質に集中するのがはるかに容易になります。 ブラウザウィンドウ全体を埋める必要はありません。 空のスペースが良く見えるという事実は、副作用ではなく、機能設計の論理的な結果です。 ウェブページはジャンクだらけだと言ったのは誰ですか？
Joseph Muller-Brockmann、「モジュラーシステム」
列幅の問題は、デザインやフォーマットの選択の問題だけではありません。 可読性の問題も同様に重要です。行幅が大きすぎないこと、およびテキスト列の左右に十分な空きスペースがあることを確認してください。 これにより、目が1行の終わりを越えて別の行の先頭にジャンプしやすくなります。 フォントのサイズやブラウザウィンドウのサイズを調整する必要はありません。 Webページを開いたら、読み始めたいだけです。 スケーラブルな幅のテキストのストリップは素晴らしいです。 画面の左端から右への無限のテキスト行-実際にはそうではありません。
Joseph Muller-Brockmann、「モジュラーシステム」
基本的なルールは、1行あたり10〜15ワードです[ロシア語セットでは、これらの数字はわずかに異なる場合があります。 テキストのストリップの幅は、スペースを含めて45〜75文字であると考えられています。 ヒース]。 フォントサイズが100％のラバーレイアウトでは、ほとんどの画面解像度の標準的な推奨事項は、ブラウザーウィンドウの幅の50％の幅の列です。
3.見栄えの良い行間
それが読書の専門家の言うことです。
上下の線が目で同時にキャッチされるため、垂直方向にきつく絞られた線は読み取り速度を低下させます。 目は別の線に焦点を合わせることができず、読者はこれをしてはいけない場所にエネルギーを費やし、その結果、彼はより速く疲れます。 リードが大きすぎる場合にも同じことが当てはまります。標準リードが小さすぎます。 行間隔を広げると、テキストが読みやすくなります。 通常の推奨事項は、標準の140％をリードしています。
4.明確な色のコントラスト
これは言及する価値はありません。 ただし、次の色の組み合わせがWebページに適していると確信している場合：
- 明るい灰色の背景に灰色のテキスト、
- 白地にシルバー色のテキスト、
- 黄色の背景に灰色のテキスト、
- 赤の背景に黄色のテキスト、
- 赤の背景に緑のテキストなど...
テキストが「点滅」し始めるので、画面からの読み取りのコントラストが高すぎることも悪いことに注意してください（#fffの背景に対して＃000）。 ＃333に対して#fffがちょうどいいでしょう。
5.テキスト画像なし
テキストを検索し、テキストをコピーして保存し、読み取り中にマウスカーソルでテキストを選択できるようにします。 写真形式のテキストは美しく見えるかもしれませんが、Webの視覚的な美しさは重要ではありません。 主なものは相互作用と情報であり、情報は読みやすく、使いやすく、拡大縮小し、引用し、転送しやすいものでなければなりません。
写真にテキストが含まれていないウェブサイトのデザインを適切に作成できない場合、最初からやり直す必要があると思います。