Wikipedia:井戸端/subj/一部の縦に長い表にスクロールバーを導入し見かけ上短縮する提案

一部の縦に長い表にスクロールバーを導入し見かけ上短縮する提案 編集

一部の記事にあるような縦に長い表(例えば、アニメ等におけるキャラクターリストなど)ですが、PC版では上から記事を読んでいく場合スクロールがとても大変な状況になっています。(例えば、艦隊これくしょん_-艦これ-けものフレンズの記事におけるキャラクター一覧)キャラクター一覧は、コンテンツにもよりますが、基本的に記事から除去すべきとは言いにくい状況にあり、また独立記事にするかといわれれば特筆性の面で否定され、記事が見にくい状態となってしまっています。

そこで、他のWIKIからの引用で申し訳ないですが、ニコニコ大百科/艦隊これくしょん~艦これ~の中央部、「サーバー群」での表のようなスクロールバーを利用することによって、表の高さを軽減し可読性を高めるという提案になります。

表を長くせざるを得ない状況であり、かつ記事において常にすべての内容を表示する必要はない表といったものにおいて、スクロールバーあり表を導入することはできないでしょうか? Wikipediaにおいて導入可能かは私のほうで判断できないのですが、ご意見等お願いできればと思います。--Pengin会話2017年12月11日 (月) 16:54 (UTC)[返信]

  •   追記 
Template:Collapse topを使用した場合にはSpecial:PermaLink/66597030のように、
Portal:テレビ/執筆依頼のようにした場合にはSpecial:PermaLink/66597068のように、
なります。(尚、どちらも僕の利用者ページ傘下の下書き用ページで、固定版リンクです)--ただのしかばね / / 2017年12月11日 (月) 23:42 (UTC)[返信]

────────────────────────────────────────────────────────────────────────────────────────────────────何度もスミマセン。個人的には、Portal:テレビ/執筆依頼のやり方が良いと思います。
<div style="background-color:#ddd; border-bottom:dashed 1px #000; border-left:solid 3px #000; padding:2pt 1em">'''リスト名'''</div>
<div style="overflow-y:scroll; width: full; height:400px;">
<div style="padding-left:1em;">

</div>
</div>
で挟む感じですね。サンドボックスで試したところ、この縦幅だと15行になるみたいですので、20行程度だと逆に見づらく感じる人もいるかも知れません。30行を超えるリストの場合に、使用するのが良いのではないかと思います。--ただのしかばね / / 2017年12月12日 (火) 00:06 (UTC)[返信]

  返信 わざわざ例まで作っていただいてありがとうございます。ただのしかばねさんの例だと、表をDiv要素で分けてそのうえでそのDivをスクロール可にするという方法ですよね。一応、自分も例を用意してみるべきかなと思ったので、表自体がスクロールできるようになるタイプを作成してみました。(利用者:Pen_bo/sandbox#艦娘)こちらの方法は、表自体にCSSを適用して、縦の表示サイズを300pxまでに制限するものになります。こちらのタイプの場合は、既存の形を崩さずに短縮できるのかなと思っていますが、どうでしょうか?--Pengin会話2017年12月12日 (火) 05:32 (UTC)[返信]
  追記 ざっくりと作り方です。
{| class="wikitable"の部分に
style="display: block; overflow-y: scroll; max-height: 300px;"を追記し
{| class="wikitable" style="display: block; overflow-y: scroll; max-height: 300px;"とすることでスタイルの適用を行っています。この場合縦300pxを超える場合、スクロール可能な表になります。--Pengin会話2017年12月12日 (火) 05:38 (UTC)[返信]

  情報 Help‐ノート:脚注/過去ログ2#脚注スクロール廃止の提案で2009年5月に全廃止された機能と同一のものを指していると思います。このときに「インラインスクロールがあると全体スクロールとカブって操作性が非常に悪くなる」といった意見も出されているようです。 / 個人的には「そんなに長くて記事単独内部の可読性に難点があるなら、初期設定で一覧表自体を折り畳んで『必要に応じて必要な方だけが適時開いて確認出来る設定にしておく』方がいいのではないか」とも思います。--Nami-ja (会話 / 履歴) 2017年12月12日 (火) 08:24 (UTC)[返信]

  コメント まず、Template:Collapse top本文中では絶対に使用しないでください。Navboxの仕様を借用しているため、モバイル版ではその部分の情報が丸ごと欠落します(表示されない)。ただのナビゲーションであれば欠落は問題ないですが、重要な本文が無くなってしまうことは避けねばなりません。モバイル版がきちんと運用され利用される前に作られたテンプレートですから、昔の記事にあるのは仕方ありませんが、新たに使うのは言語道断。
次に、overflow-y:scrollもなるべく使わないでください。モバイル版では問題ないですが、印刷時には隠れた部分の情報が印刷されず欠落します。どうしてもスクロール化したいなら、Help:脚注部分をスクロール化するのように「デフォルトではオフの、使いたい人だけが使えるガジェット」として実装してください。閲覧環境は人それぞれなのに、ある環境では見づらいから~というのを根拠なく全体化して、検証もせずデフォルト実装してはいけません。
基本的に、ウィキペディアの基本表示というのは私ら素人よりずっとUIやアクセシビリティに詳しい人が作っているので、あまり弄るべきではないです。--Starchild1884会話2017年12月12日 (火) 21:54 (UTC)[返信]
折り畳み方式はTemplate:Collapse topという事になるので、overflow-y:scrollの方が良いかと思いましたが、コッチにも別の弊害が有ったのですね。情報、感謝します。
それでしたら、執筆依頼や加筆依頼などにおいては(印刷する人がいるとは思えないので)問題ないけれど、通常の記事においては避けた方が良いですね。
そして、閲覧環境云々については、以前やらかしてしまった事が有るな、と……「『不都合なようでも、総合的に考えると、現状が最善なケースが多い』という感じ」が、今回も当てはまるのですね。
   ガジェット化するにしても、実際の記述に手を加える必要が有ると思うのですが、その辺りはどうなるのか分かりますか? 僕は完全に素人でして、ガジェットがどういう仕組みで構築・実装されているのかも、よく分かっていないのです。個人的には、オンに設定を変更した人のみ、overflow-y:scrollの動作になるというのが、良いと思うのですが(横スクロールはやりづらいので。横か縦かも選べるなら、それが一番いいとは思いますが、難しそうですし)。--ただのしかばね / / 2017年12月13日 (水) 00:15 (UTC)[返信]
  返信 (Starchild1884さん宛) 本筋から外れまくりな上に遅レスで恐縮ですが、今ふと疑問に思いましたので。「モバイルで表示出来ないテンプレートを本文中で絶対に使用してはならない」とする合意形成ってどこで為されましたかご存知でしょうか? 「モバイルで表示出来ない種類のテンプレートを一切使用してはならない」とするならば、全ナビゲーションテンプレートと{{Ambox}}を利用する冒頭注意系テンプレートが対象に含まれるはずなんですが。H:MOBILEをご覧頂きたいのですけども、モバイルビューで閲覧不能か表示不具合のあるPC用のテンプレートは莫大な数に上りますので、それほど重要性の高い決定が既に為されているのであれば議論の経緯を参照したいな、と思いまして。--Nami-ja (会話 / 履歴) 2017年12月22日 (金) 20:13 (UTC)[返信]
  コメント 本筋から外れますが、本文中に長々と表が現れること自体に違和感を覚えます。表が無くても理解できるように本文を構成し、補足として表を作るなら記事の末尾(脚注の前)に「別表」として纏めて置いて欲しい。まぁそんなルールは無いので、私はこうなったら良いなと思っているというだけです。--mit freundlichem Gruß LudwigSKDiskussion/Beiträge2017年12月13日 (水) 00:37 (UTC)[返信]
末尾に『別表』セクションを作り、そこにTemplate:Anchorを付けた上で長いリストを記載。現在有る位置には、同テンプレートを使ってのページ内リンクを貼っておく。
これも確かに、状況次第では最適となる『可能性』がある案だとは思います。デフォルトでは現状の表示で、ガジェットをオンにした場合に別表表示となる。そういう事が出来たら良いかも知れない、と思いました。--ただのしかばね / / 2017年12月13日 (水) 00:55 (UTC)[返信]
  返信 (LudwigSKさん宛) ありますよWikipedia:スタイルマニュアル (表)Wikipedia:アクセシビリティが該当します。…どちらも未だ草案ですけども。仰っておられる内容は「ユーザーアクセシビリティ」そのものですね。--Nami-ja (会話 / 履歴) 2017年12月13日 (水) 03:38 (UTC)[返信]
  コメント けものフレンズ#フレンズ一覧艦隊これくしょん_-艦これ-#登場キャラクターも『ゲームを実際に遊んでいるか、これから遊ぶ方のためにどのキャラクターにどんな利点があるかに主眼を置いた一覧になっている』ので、表そのものがWP:NOTMANUAL、「ゲーム攻略法を百科事典解説と混同した状態」になっている虞はあると思います(実際にそのキャラクターを使って遊んだ匿名プレイヤーの経験的情報、独自研究の成果でありWP:NOR違反)。◆百科事典の観点ならば「キャラクターのゲーム使用上の利点」ではなく「(百科事典的に文章でそれぞれのキャラクターを解説するものとして)ゲームキャラクターと他出版物などと比較した場合のそれぞれの相違点、元になった史実艦船や動物と比較しての特徴のデフォルメポイント、他同様ゲームと比較しての本ゲーム上でのキャラクターの特色の文章解説」などに主眼を置くべきで、『表自体を作成した目的が、それこそゲーム攻略ウィキと混同状態に在る』のではないかな、と思います。──ここまで徹底的にゲーム攻略サイト代わりに利用されて来たものをこれから改訂するのは容易ではなかろうと思いますが、似た前例として現時点で15年続くMMORPGゲームとして有名なラグナロクオンラインがあるのですけども、このゲームは数千を超えるアイテムがゲーム内に登場してプレイヤーに密接に関係するのですけども「アイテム一覧は記事上に一切ありません」。ゲームシステムの特色を列挙解説する形の記事になっており、表は完全排除された状態で記事として成立しています。--Nami-ja (会話 / 履歴) 2017年12月13日 (水) 03:38 (UTC)[返信]
素朴な疑問なのですが、なぜ表が長いといけないのでしょうか。そもそも項目が多いものは表も長くなるでしょうし、その多さ・長さはある意味仕方がないような気もします(たとえばロシアの都市に「多すぎるから30にまとまれ!」とかいうほうがそもそも理不尽なような気がします)。
また、文章だと読みにくいから表を作成しているはずで(たとえば、「AA天皇は第X1代天皇、在位000年から001年、生年00年、没年00年、別称QQ天皇、諱はWWW。BB天皇は第X2代天皇、在位000年から001年…、」なんて文章が延々(100人越えて)続くよりも、明らかに表のほうが(たとえ100段越えの表だとしても)見やすいし理解しやすいはずです(天皇の一覧#一覧表))、表は、すでに可読性を高める配慮がなされている部分であると思います。
そして、表も記事の一部であり、文章や箇条書きと同等なのではないかと思います。で、文章にスクロールバーをつけよう、という提案は、おそらく否決されるのではないかと思います。(たとえば日本の歴史の中で、「明治までスクロールするのがダルいから、平安とか鎌倉とか畳んでください!」とか要求しても、「いや目次から飛ぶとか頭使いなさいよ」といわれて終わるような気がします)。繰り返しになりますが、表も記事の一部であり、文章や箇条書きと同等なのではないかと思います。表だけ畳まれるのは何か違うような気がします。--ノフノフ会話2017年12月13日 (水) 08:07 (UTC)[返信]
  コメント ご提示のような一覧ページが表になっていても問題ないと思いますよ。私は長大な表は別表にして末尾に追い出して欲しいと書きましたけれど、一覧ページはページ自体を分離して追い出してある訳ですから。ただロシア#地理ロシアの都市の一覧が、天皇天皇の一覧が、そのまま入っているような記事が結構あるんですよね。本提案冒頭に例示されている艦隊これくしょん_-艦これ-けものフレンズのように。その表の後にまた本文が続くのです。
それに表を箇条書きにしたって読み易い訳ないじゃないですか。本文として構成し直すというのは、天皇#天皇の歴史の様になって欲しいのです。その上で、一覧性が高く比較し易い天皇の一覧がある。末尾に別表でも良いし、別ページでも良い。でもその一覧が、天皇#天皇の歴史の代わりにあったら邪魔じゃないかな、と。まぁマンパワー的に無理ですよね……ただの願望です。--mit freundlichem Gruß LudwigSKDiskussion/Beiträge2017年12月13日 (水) 09:03 (UTC)[返信]
  コメント 表自体が、本文内の箇条書きや本文と同等なのではないかとおっしゃっていますが、私はそうは思いません。表に箇条書きや本文にできるだけの情報量があり、またそれができるのであれば、表は作られないわけですしただの列挙である表は邪魔になると思います。記事とするには無理があったり、またそのための情報が足りない場合に作られるのが表であり、必然的にその優位性は本文や箇条書きよりも劣ってはいるのではないでしょうか? また、本文は目次から飛ぶことができたとしても、同じ見出し内の文章内に表がありその後文章がさらに続く状況においては、「目次で飛べよ」というのは不可能にかんじます。--Pengin会話2017年12月14日 (木) 12:42 (UTC)[返信]

少々忙しかったので返信が遅れました。すみません。今でている案を整理すると以下のようになりますかね?

  • 表を標準でスクロールにする(印刷等で問題が出る可能性あり)
  • ガジェット機能として実装する(実現できるのかは不明)
  • 表をページ末尾に移動させる(今のところ実現性に問題はなし)
  • 現状維持
  • 表を折り込む(使用できない端末があるため不可)

一応ですが、表自体の意義や文章化などは議題として少しずれている気がしたのでここには含めてません。

  コメントMawaruNekoのコメントここから)ガジェット化について、ガジェットは管理者にしか追加できませんが、Wikipedia:カスタムCSSWikipedia:カスタムJSは各利用者が利用できますので、それである程度実験をすることが可能です。その上で、ガジェット化する場合について考慮すべき点をいくつか述べます。
  • 記事中の表にはwikitableクラスがついている場合が多いので、wikitableクラスの付いている(長い)表にスクロールバーをつけることを考えます。
  • 単純にCSSで済ませる場合には、カスタムCSSに以下を追加します。
    table.wikitable { max-height: 300px; overflow-y: scroll; display: inline-block; border: 0; }
    
  • display: inline-blockを指定すると、スクロールバーが表の真横に表示されます。display: blockにすると、ページの右端に表示されます。
  • overflow-y: scrollを指定すると、小さい表にもスクロールバーが表示されます。overflow-y: autoにすると、ブラウザによってはサイズの上限を超えた場合のみにスクロールバーが表示されるようになりますが、スクロールバーが表の内側に表示されてしまうため、スタイル崩れを起こしてしまいます。
  • カスタムJSを使用すると、サイズの上限を超えた場合のみに(上記の問題を起こさずに)スクロールバーを表示することが可能です。User:MawaruNeko/TableScroller.jsにサンプルを作成しましたので、お試しください。--MawaruNeko会話) 2017年12月16日 (土) 15:45 (UTC)--MawaruNeko会話2017年12月16日 (土) 15:47 (UTC)微修正[返信]