web-dev-qa-db-ja.com

リンクまたはヘッダーではない場合、テキストに下線を付けることを許可する要件はありますか

ユーザーが特定のページのコンテンツを追加および編集できるように開発したサイトの1つ内に、カスタム CKEditor を構築しました。ただし、エディターにはデフォルトで下線オプションが付いており、クライアントはテキストに下線を付けることで強調するようにしています。これにより、そうでない場合にすべてがリンクのように見えます。

これはカスタムエディターであるため、下線を引く機能を削除できます(ただし、Ctrl + Uで下線を引くことはできると思います)が、無効にすることをお勧めする前に、下線付きのテキストが実際に使用されていないことを確認したい。

Webサイトでテキストに下線を引くための有効な使用例はありますか-リンクおよびおそらく見出し以外(両方とも注意が必要です)とにかくサイトCSSによる)

私の意味の同様の例を以下に示します(現在のwordpress.comページエディターから取得) enter image description here

興味深いことに、Stack Exchangeテキストエディターにはオプションとして下線がありません

29
JonW

非リンクテキストに下線を引くことは、一種の ユーザビリティ犯罪 です。下線は リンクを視覚化する標準的な方法 です。特に、リンクにデフォルトの青が使用されていない場合、下線は、リンクとは何かについてWebユーザーを混乱させる可能性があります。デスクトップアプリケーションでも、下線が引かれたテキストは「私はクリック可能です」を意味することがよくあります。

下線が引かれている、または色が異なるテキストはリンクである可能性が高いことを誰もが知っています。他の場所に下線付きのテキストを入れて、混乱させないでください。特定の単語に注意を引くには、代わりに強いタグまたは強調タグを使用してみてください。

下線も無視することはほとんど不可能です。コントラストイタリックテキストを強調しますコンテキスト内。イタリック体は、行を読んでいる間だけ気付かれます。下線とBoldを比較すると、段落を読んでいないときでも目を引く。太字のような下線は、テキストをスキャンするときに無視するのが難しいです。

ここで重要なことは、太字と斜体はテキストを強調する2つの重要な方法を提供し、太字と斜体は完全なセットであることです。独自の 使用例 がありますが、UnderlineはBoldと同じ目的を果たしますが、文体的に扱いにくく、読みやすさに悪影響を及ぼします。

Sitepoint は、読みやすさに関するUnderlineのリスクについても説明しています。

下線付きのテキストがリンクであるとユーザーを混乱させる可能性があるだけでなく、下線は読みやすさの問題を引き起こす可能性があります。これは、行が小文字のテキスト(たとえば、小文字のg、j、p、q、 y)、一部のWordの形が不明確になる。

下線は気が散るで、混乱を招く可能性があり、主観的には視覚的に醜くなります。太字と斜体は強調のユースケースをカバーしているため、アンダーラインには明確なユースケースはありませんであり、一般的なコンテンツの非リンクには使用しないでください。

ただし、下線が重要なユースケースもあります:事前定義されたスタイルガイドが下線を要求する場合

MLA形式 本のタイトルに下線が必要です。 MLA形式を使用している人々に下線のないエディターを与えることは残酷です。 [〜#〜] apa [〜#〜] にも下線が引かれます。

36
Ben Brocka

はい、有効なユースケースがあり、そのすべてはおそらく下線が特定の意味を持つ非常に特定の分野の仕事/研究にあります。

例:ユーザーがCKEditorで RuleSpeak[〜#〜] sbvr [〜#〜] ドキュメントの表記システム)で記述したい場合、規約により彼らは条件に下線を引きます。

これらのドキュメントに通常表示される画像:


Example Rulespeak notation

PS。質問に対する興味深いコメントの1つに、SOエディターでは下線を許可していません。そのようなSEサイトを見つけることができませんでしたが、確かにそれを想像できましたwould下線を許可します(例 http://typography.stackexchange.com/ が候補になります)。

12
Jeroen

ウェブサイトでテキストに下線を引く有効なユースケースはありますか?

はい、あなたの質問には答えが含まれています:

クライアントは、テキストに下線を引くことでそれを強調するように自分自身を引き受けました

したがって、強調は、一部の人々にとって有効なユースケースのようです。私は、この人々があなた(またはより広く合意されたガイドライン)に従って間違っていることも、ここでのポイントだとは思いません。それはあなたがあなたのクライアント/ユーザーに与える自由とあなたが考えている発信品質との間のトレードオフの問題です。

下線付きテキストを無効にすることをお勧めする前に、本物の使用がないことを確認したいと思います。

足を切る前に芝生の上を歩かないようにユーザーに教えるかもしれません...

テキストの編集を許可すると、誤解を招く下線を追加するよりもはるかに強力な権限がユーザーに付与されます。ツールの「誤った」使用を防ぐことが目的である場合は、ユーザーに教え、編集/承認ワークフローを検討することを検討してください。

6
FabienAndre

「U」ボタンが選択されたテキストを<u>要素に配置すると想定すると、その使用例は非常に狭い場合があります。最新の WHATWGのHTML仕様から

U要素は、明確にレンダリングされているものの、明確にレンダリングされているものの、テキストではない注釈を含むテキストの範囲を表します。

ほとんどの場合、別の要素がより適切である可能性があります。強調を強調するには、em要素を使用する必要があります。キーワードやフレーズをマークするには、コンテキストに応じてb要素またはmark要素を使用する必要があります。本のタイトルをマークするには、cite要素を使用する必要があります。明示的なテキスト注釈でテキストにラベルを付けるには、Ruby要素を使用する必要があります。西洋テキストで船名にラベルを付けるには、i要素を使用する必要があります。

ただし、要素のデフォルトのレンダリングを再スタイルする必要があることも強調しています(CKEditorボタンも変更する必要があることは明らかです)。

ビジュアルプレゼンテーションにおけるu要素のデフォルトのレンダリングは、ハイパーリンクの従来のレンダリング(下線)と競合します。作成者は、ハイパーリンクと混同される可能性があるu要素の使用を避けることをお勧めします。

これが、<u>要素を使用するために考えられる唯一の理由です。私の直感は、テキストを<u>タグ内に置くのではなく、実際に下線について尋ねていることです。この場合、信頼できるものは見つかりませんそれが望ましい理由の例。

5
Niq

いくつかのマイナーなEdgeケース(上記のRuleSpeakなど)がありますが、Webテキストの下線機能の全体的な有用性は低くなっています。

必須の機能の候補にはならない、他の多くの限界テキスト装飾関数(スモールキャップなど)があります。上で引用したタイポグラフィと使いやすさの理由から、下線はおそらくそれらに加わるべきです。

あなたのスクリーンショットには下付きまたは上付き文字が表示されていないことに気づきました。これは、多くの著者にとって下線よりもはるかに役立つでしょう。

マイナーな可能性すべてに完全に対応する必要がある場合を除き、編集ツールバーはできるだけシンプルで使いやすいものにしてください。

1
David More

私が年次報告書のウェブサイトを構築していたときに、私はこれにわずか数回遭遇しました。残念ながら、表示しようとしたリンクは現在は無効になっていますが、レポートには特定のテキストに下線を付ける必要があり、ヘッダーの一部ではなかったり、リンクだったりする場合がありました。

ただし、テキストは財務テーブルの行ヘッダーセルにのみ表示されます。したがって、それらはヘッダー(行ヘッダー)であるが、HXタグを使用せず、単に下線付きのテキストの文字列であると主張するかもしれません。

(上で説明した理由により)下線ではなく別のフォーマットを使用するかどうかを問い合わせたことを覚えており、「いいえ!」下線テキストをそのまま使用してください。

1
Sahbas Has

短い答え:非表示にして<em>を使用すると、SEOとアクセシビリティが向上します。

長いです:

下線は、手書きと活字原稿の時代に強調を示すために最初に導入され、後で別の種類に設定するためのマークアップインジケーターとして使用されました。これにより、強調ではなくアンダースコアをマークアップインジケータとして使用する傾向が始まりました。次に、テキストを斜体または太字にすることで強調が実装されました。

現代に早送りします。 HTMLドキュメントでの下線<u>とイタリック<i>および太字<b>を使用することは、1つまたは3つすべての方法で強調を示すための大きな標準でした。これらのタグは、テクノロジーの進歩により<strong><em>をサポートするドキュメントのアクセシビリティが向上し、下線タグが削除されたため(すぐに削除されました)、テキストの下線は、リンクであること(「これは別の何かに(またはつながる)べきである」のマークアップ時代に関連する)。

アクセシビリティは現在、米国とカナダの多くの企業にとって強力な要素であり、要件です。準拠するには、<strong>を使用して重要な単語を強調し、<em>を使用して重要なフレーズを強調します(<em>を1つの単語にすると、テキスト全体が読みにくくなるため)

サイドノート:スパイダーは、<strong>タグと<em>タグを使用して重要で強調されたフレーズも検索します。これらをサポートすると、SEOに役立ちます。

したがって、サイトのユーザーと、ユーザーがアクセス可能なページを必要とするかどうかを確認してください。次に、エディターを使用するユーザーを見てみましょう。それらのユーザーは、従来のタイプライターの背景と現代のワープロの背景のどちらから来ていますか?

出典:
http://en.wikipedia.org/wiki/Underline
http://education.yahoo.com/reference/dictionary/entry/underscore
http://www.netmechanic.com/news/vol6/html_no12.htm

0
James Wilkinson

下線が適切なケースを少なくとも3つ提案できます。

  1. 下線付きのテキストの目的は、文字通りまたは比喩的に「空白に埋められた」何かを示すことです。イタリックも太字もこれを伝えていません。さらに、行末は問題になる可能性がありますが、下線は、下線で結合された2つの連続する単語または単語のグループと、別々に下線が引かれる連続する単語または単語のグループを区別する機能を提供します。このようなセマンティックの区別は、連続したリンクに役立ちますが、他の場合にも重要です。代替の背景色やボックスもこのような区別をするために使用できるかもしれませんが、それらはしばしば下線よりも気が散ります。

  2. 特にステータスレポートテーブルでは、アイテムに関する多くのindependent情報を区別し、特定の基準を満たすものを一目ですばやく特定できるようにする必要があります。下線は重要な強調形態ではありませんが、セリフとサン、太字と光、イタリック/斜めとローマ/直立、プレーンと色付きの前景を使用した場合よりも、より多くの独立した次元を組み合わせる必要がある場合は、プレーンな背景と色付きの背景。下線を追加すると役立つ場合があります。

  3. 1つは、下線を利用し、文書のセマンティクスを調べて他の形式の強調表示が適切かどうか、および文書内のテキストに下線が引かれた単語を参照しているかどうかを判断したくない既存の文書を複製することです。

0
supercat

答えはおそらく、はい、いいえです。下線が有効で正しい例がありますか?たぶんそうです(私はそうは思いませんが)。あなたはそれをすべきですか?いいえ。下線はリンクにリンクされすぎており(ホバー時のみであっても)、これを解除することは、ユーザーの脳が忘れることができない「習慣」です(私たち全員がそうしなかった場合を除きます)。

0
The Question