- 記事タイトル部分の見出しデザインが崩れていないか、文字が背景からはみ出していたりしないか確認しましょう。
- previous_post_linkやnext_post_linkなどで前後の記事のタイトルを出力する場合も、レイアウト崩れが発生していないか確認しましょう。
- その他、ウィジェットやプラグイン等でいろいろな場所に記事タイトルが出力されるケースが多いので併せて確認しましょう。
- 用途に応じて、PHPのmb_substrやmb_strlen関数を使って文字列をトリミングするという手もあります。
※その際、データの無害化 (サニタイズ) にも配慮するとより盤石です。
カテゴリー: 極端な例
Posts that have edge-case related tests
Pneumonoultramicroscopicsilicovolcanoconiosis
タイトルが長い英単語の時、コンテンツエリアをはみ出すべきではない。
ラテン文字45字で書かれるこの単語は、辞書に記載されている中では最も長い実用的な英単語とされている。
チェックすべき項目:
- タイトル・コンテンツ・コメント内の改行なしテキストが、レイアウトや機能に悪影響を及ぼしてはなりません。
- ブラウザのウインドウやタブのタイトルをチェックしてください。
- プラグインやウィジェットの開発者の方は、このテキストにより何かが崩れたりしていないかチェックしてください。
改行なしテキストにうまく対応するために、以下の CSS プロパティが役立つでしょう。
-ms-word-wrap: break-word; word-wrap: break-word;
タイトルのない投稿。
しかし、この投稿へのリンクは表示されなければならない。
極端な例: コンテンツのない投稿
極端な例: たくさんのカテゴリー
多すぎるほどのカテゴリーに属している投稿。
極端な例: たくさんのタグ
多すぎるほどのタグを持つ投稿。
極端な例: ネスト化された混合リスト
ネスト化された混合リストでは以下が正しく表示されるようにしてください。
- リストの中のリストは番号付きリストの順番を壊さないこと
- 箇条書きのスタイルの深さは十分であること
番号付きリスト – 番号なしリスト – 番号付きリスト
- 番号付きリストアイテム
- 番号付きリストアイテム
- 番号なし
- 番号なし
- 番号付きリストアイテム
- 番号付きリストアイテム
- 番号付きリストアイテム
- 番号付きリストアイテム
番号付きリスト – 番号なしリスト – 番号なしリスト
- 番号付きリストアイテム
- 番号付きリストアイテム
- 番号なし
- 番号なし
- 番号なしリストアイテム
- 番号なしリストアイテム
- 番号付きリストアイテム
- 番号付きリストアイテム
番号なしリスト – 番号付きリスト – 番号なしリスト
- 番号なしリストアイテム
- 番号なしリストアイテム
- 番号付き
- 番号付き
- 番号なしリストアイテム
- 番号なしリストアイテム
- 番号なしリストアイテム
- 番号なしリストアイテム
番号なしリスト – 番号なしリスト – 番号付きリスト
- 番号なしリストアイテム
- 番号なしリストアイテム
- 番号なし
- 番号なし
- 番号付きリストアイテム
- 番号付きリストアイテム
- 番号なしリストアイテム
- 番号なしリストアイテム