[Translation from English to Japanese ] 4. Use Bulleted Lists and Text Formatting According to an eye-tracking stu...

Additional info

Startupdatingの記事翻訳です。"〜だ""〜である"調でお願いします。元記事: http://mashable.com/2011/09/12/website-usability-tips/

Original Text / English

4. Use Bulleted Lists and Text Formatting

According to an eye-tracking study by ClickTale, users fixate longer on bulleted lists and text formatting (such as bolding and italics).


These text-styling tools can garner attention because of their distinctive appearance as well as help speed up reading by way of breaking down information into discrete parts and highlighting important keywords and phrases.

What you can do:

Consider breaking up a paragraph into bulleted points.
Highlight important information in bold and italics.

Translation / Japanese

4.中点付きの箇条書きと文章修飾を使う

ClickTaleで行った視点追跡調査によれば、利用者が長く視線を合わせているのは、中点付きの箇条書きと（ボールド体やイタリック体のように）修飾されたテキストだった。

文章のスタイル付けするツールを使えば、読み手の関心を集めることができる。
情報を個々に分け大事なキーワードやフレーズを強調表示することで、文章の見た目を特徴づけるとともに、読解スピードアップに役立つからだ。

次のことを試してみよう。

ひと段落を中点付き箇条書きに分割できるかどうか推敲する。
重要な情報はボールド体かイタリック体で強調表示する。

Translation / Japanese

4.箇条書きリストとテキスト書式設定を使用する

ClickTaleによるアイトラッキング調査によると、ユーザーは箇条書きリストとテキスト書式設定（ボールド体やイタリック体のような）を凝視するという。

これらのテキストスタイリングツールは、特色のある見かけのため注目を集めることはもちろん、情報を個別のパーツに分類し、重要なキーワードやフレーズを強調する事によって読む速度を上げるのに役立つ。

あなたができる事：

文章を箇条書きに分けるるよう検討する。
重要な情報をボールド体とイタリック体で強調する。

Translation / Japanese

4.箇条書きとテキストフォーマを使ってください。
ClickTaleによる眼球追跡によると、人は箇条書き項目とテキストフォーマット（太い文字や斜め文字）に長く目を向けます。

これらの体裁は目立ちやすくまたパーツを分けたり重要語句を際立たすことにより読むスピードを速め、注目を集める事が出来ます。

できること：

段落を箇条書きのに分けること考えてください。
重要な太い文字、斜め文字情報を際立たせてください。

Original Text / English

5. Give Text Blocks Sufficient Spacing

The spacing between characters, words, lines and paragraphs is important. How type is set on your webpages can drastically affect the legibility (and thus, reading speeds) of readers.

In a study called “Reading Online Text: A Comparison of Four White Space Layouts,” the researchers discovered that manipulating the amount of margins of a passage affected reading comprehension and speed.

Translation / Japanese

5.テキストを十分な間隔でブロックする

記号、文字、ライン、文章間の感覚は重要である。あなたのウェブページでどのようにタイプが設定されるかは、徹底的に読み手の可読度（そして読むスピード）に影響を及ぼす。

「リーディングオンラインテキスト：4つの余白のレイアウトの比較」と呼ばれる調査において、調査者は一節の余白の量を操作することは、読みの理解力とスピードに影響を及ぼすと発見した。

Translation / Japanese

5．文章のグロックごとに適切な間隔を入れる
文字や単語、行間や段落ごとの間隔は重要な要素だ。ウェブページの文字がどのように並んでいるかが、読みやすさ（つまり読むスピード）を大きく左右する。

「オンラインの文章を読む：余白のレイアウト４種類の比較」という研究で、研究者らは文の余白が変われば読解度や読むスピードも変わることを発見した。

Translation / Japanese

5.文章の間に十分なスペースを入れる

文字、単語、線、段落の間にスペースを入れることは重要です。どのように文章をウェブサイトに掲載するかで読者の読みやすさ（スピード）は劇的にかわります。

「オンラインテキストを読む：４つのスペースレイアウトの比較」の中で、研究者は文の余白に手を加えることで理解とスピードが向上する事を発見しました。

Original Text / English

What you can do:

・Evaluate your webpages’ typography for spacing issues and then modify your site’s CSS as needed.
・Get to know CSS properties that affect spacing in your text. The ones that will give you the most bang for your buck are margin, padding, line-height, word-spacing, letter-spacing and text-indent.

Translation / Japanese

実践しよう。

・スペースの取り方についてページのレイアウトを評価し、必要に応じてサイトの CSS を修正する。
・スペースに影響を与える CSS のプロパティについて理解する。試す価値があると思われるのは、margin、padding、line-height、word-spacing、letter-spacing、text-indent である。

Translation / Japanese

できること：

・ウェブベージの空白体裁を評価し、サイトのCSSを必要に応じて調整する。
・文章中のスペースに影響するCSSプロパティーについて知識を深める。CSSプロパティーで最も重要なのはmargin, padding, line-height, word-spacing, letter-spacing そして text-indentである。

注意：CSS用語はそのまま使うと思うので文想のまま表示しました。

Translation / Japanese

あなたができること：
・ 間隔問題のためにあなたのウェブ・ページのタイポグラフィを評価してください、そして、必要に応じてサイトのCSSを修正してください。
・ あなたのテキストの間隔を影響するCSSのプロパティを分かるようにしてください。あなたに金を最も多与えるものは、マージン、パッド、行間隔、語間調節、文字間調節とテキスト-インデントです。

Original Text / English

6. Make Hyperlinked Text User-Friendly

One big advantage of web-based content is our ability to use hyperlinks. The proper use of hyperlinks can aid readability.

What you can do:

・Indicate which links have already been visited by the user by styling the :visited CSS selector differently from normal links, as suggested by Nielsen, so that readers quickly learn which links they’ve already tried.
・Use the title attribute to give hyperlinks additional context and let users know what to expect once they click the link.
・For additional tips, read >Visualizing Links: 7 Design Guidelines.

Translation / Japanese

6. ハイパーリンクをユーザーフレンドリーにする

ウェブベースのコンテンツは先進的なものであるが、その大きな理由のひとつは、ハイパーリンクが利用できることである。ハイパーリンクを正しく使うとリーダビリティーを向上できる。

実践しよう。

・すでにユーザーによって開かれたリンクを CSS セレクタ :visited を使って通常のリンクと異なるスタイルにする。どのリンクを試したか、読者に一目で分かるようにすることがニールセンによって提唱されている。
・title 属性を用いてハイパーリンクに補足情報を付加し、リンクをクリックすると何が起きるかユーザーに分かるようにする。
・さらなるティップスについて、Visualizing Links: 7 Design Guidelines を参照していただきたい。

Translation / Japanese

6.ハイパーリンクをユーザーフレンドリーにする

ウェブコンテンツの大きな利点にハイパーリンクがある。適切なパイパーリンクの使用は文を読みやすくする。

できること：

・Nielsenの提案に従い「:visited」を使ってどのリンクがすでに訪問されたか未訪問のリンクとの区別を表示する。それによってユーザーはどのリンクをすでに踏んでいるか判断出来る。
・リンクに関係のあるタイトルをつけることによってユーザーが分かりやすくなる。
・詳しくは>Visualizing Links: 7 Design Guidelines

Translation / Japanese

6.ハイパーリンクされた文章を利用しやすくする

インターネットを利用したコンテンツの大きな利点の一つは、ハイパーリンクを利用出来ることである。ハイパーリンクを適切に利用すればさらに読みやすくなる。

出来ること：

・Nielsonが提案しているように、訪問されたCSSセレクタを通常のリンクと異なるデザインにして、ユーザーがすでに訪問したリンク先を示す。そうすれば、読者はどのリンク先をすでに試したのかすぐにわかる。
・タイトルの特性を利用して、ハイパーリンクに文脈を追加し、リンクをクリックすると何が起きるのかユーザーに分かるようにする。
・さらなるヒントとして、Visualizing Links：7デザインガイドラインを読んでほしい。

Original Text / English

7. Use Visuals Strategically

Photos, charts and graphs are worth a thousand words. Using visuals effectively can enhance readability when they replace or reinforce long blocks of textual content.

In fact, an eye-tracking study conducted by Nielsen suggests that users pay “close attention to photos and other images that contain relevant information.”

Translation / Japanese

７，ビジュアルを戦略的に使用する。
写真、表、グラフは千の言葉に勝る。多段落のテキストコンテンツを置換する、または補強するためにヴィジュアルを効果的に使用することで、可読性が向上する。

事実、Nielsenらによるアイトラッキングの研究は、ユーザーが関連性のある情報を含んだ写真や図に強く注目することを示唆している。

Translation / Japanese

7．視覚効果を戦略的に使う
写真、チャートやグラフを用いれば、百聞は一見にしかずだ。長い文章をそれらの視覚効果に変えたり、もしくは長い文章を視覚効果で補うなど、視覚効果を有効に使えば、リーダビリティーは向上する。

実のところ、ニールセン氏が行なった視標追跡研究から、ユーザーは関連のある情報が含まれている写真やイメージ図に細心の注意を払っていることが示された。

Translation / Japanese

7.視覚を効果的に使う

写真、表、グラフは言葉よりもかなり分かりやすい。長い原文を視覚効果を使うことにより読みやすくできる。

実際に、Nielsenによって実施された眼球追跡でユーザーは「内容に関する写真や画像によく注目している」ということが分かっている。

Translation / Japanese

7.視覚を戦略的に使う

写真や図表、グラフは1000の言葉に相当する。視覚を効果的に使うことで、テキストコンテンツの長い固まりを置き換えたり、強化する時の読みやすさを向上させることが出来る。

実際、Nielsenが実施した視線追跡研究は、ユーザーは「関連性のある情報を含む写真やその他の画像に細心の注意を払っている」ことを示している。

Original Text / English

Users, however, also ignore certain images, particularly stock photos merely included as decorative artwork. Another eye-tracking study reported a 34% increase in memory retention when unnecessary images were removed in conjunction with other content revisions.

What you can do:

・Make sure images you use aid or support textual content.
・Avoid stock photos and meaningless visuals.

Translation / Japanese

しかし、ユーザーもまた特定のイメージ図や、特に飾りとして使われているにすぎない陳腐な写真などには目もくれない。別の視標追跡研究では、不要なイメージ図が他の内容修正とともに削除された場合、記憶保持率は34％向上していることが報告されている。

できること：
・使用するイメージ図は文章の内容を助け、サポートするものであること
・陳腐な写真や意味のない視覚効果は避けること

Translation / Japanese

しかしながらユーザーはただ単に装飾しているだけのストック写真などの画像には注意を払わない。別の眼球追跡調査の示す結果では、34%が不必要な画像を取り除くことにより記憶力を向上さすことができた。

できること：

・画像が本文を分かりやすくしているか確かめる。
・ストック写真や意味のない視覚効果を避ける。

Translation / Japanese

しかしながら利用者は、ある種の画像、特に単なる装飾に過ぎないストックフォトは無視します。
アイトラッキングの研究では、不要な画像をコンテンツから取り除いた場合、記憶の保持が34％高まると報告されています。

あなたが出来ることは

・掲載する画像が、本文を読む上で役立つものであることを確認しなさい
・ストックフォトや意味のないイメージは避けなさい