閲覧/Web/プロジェクト/導入段落の移動
問題
デスクトップ版サイトでは、infobox（基礎情報ボックス）は記事本文に対して2番目の位置づけになっています。しかし、モバイル版サイトでは、infobox が記事本文よりも前、つまり一番最初に配置されてしまっていました。 モバイル版におけるこの配置では、閲覧者は、主題についての文脈や導入文よりも先に、詳細データに触れることになります。 閲覧者は infobox の後ろまでスクロールしなければ、導入部や、infobox を理解するための文脈となるような紹介文に到達できません。 この問題は、特に閲覧者が慣れ親しんでいない主題の場合に大きくなります。読もうとしている記事かどうかを確認するために infobox をスクロールする必要が生じます。
提案
infobox の前に記事の導入部を移動する。 目標:
- 読もうとしている記事かどうか、閲覧者が確認できるようにする。
- デスクトップ版サイトとの一貫性があるよう、記事の文章をページの最初に配置する。
- 主題の詳細データに触れる前に、導入部の段落の内容に触れられるようにする。
この変更の結果、モバイル版の閲覧者は内容を素早く読み取れるでしょう。また、多くの infobox にはページの描画を遅くするような画像が含まれているという点でも改善されるでしょう。
例外
- リストで始まる記事 - Planetのような記事では、リストを infobox の前に表示する。
- infobox がない - 変更なしです。
- 文章の前に画像がある - 変更なしです。
- infobox がHTML要素の中に入っている。 - 変更なしです。 - 例外として
mw-stackクラスのDIV要素があり、Template:Stackのような例があります。
例
-
モバイル版サイトの古いバージョンでは、infobox があり、導入部に適した情報はほとんどない。（意訳） -
モバイル版サイトにて、お知らせ用テンプレートと infobox が先に表示されるようになりました。 -
モバイル版サイトにて、infobox の前に導入部の第一段落が表示されるようになりました。 -
導入部の段落が infobox の前に提供されており、主題の背景や文脈が提供されています。
関連する Phabricator でのタスク
- Improve top of the article user experience （記事上部のユーザーエクスペリエンスの改善）
- Move first paragraph
<p>above infobox template on small screens （小さな画面における、第一段落<p>より先にある infobox テンプレート） - Move first paragraph before infobox on stable （第一段落を infobox の前へ移動）
よくある問題点
以下のような問題があると infobox は移動しません。
適切でないマークアップの中に infobox が入っている（意訳） 例:
'''{{Infobox company
修正法: 以下のような検索クエリで、この問題が生じている対象記事を探すことができます:
https://en.wikipedia.org/w/index.php?search=insource%3A%2F%5C%27%5C%27%5C%7B%5C%7BInfobox%2F&title=Special:Search&profile=advanced&fulltext=1&advancedSearch-current=%7B%22namespaces%22%3A%5B0%5D%7D&ns0=1
Some wikis don't use the infobox class for infoboxes.
Fix: add the infobox class to infoboxes (even if not present in the CSS stylesheet).