構文翻訳ページ用サイドバー

概要

Wiki構文翻訳ページ用のサイドバーを作成する

デザイン

• 何度もサイドバーから項目を選択するので文字を押しやすく大きくしたい
  • ただ文字を大きくしただけではレイアウトが崩れる？サイドバーそのものの横幅も広く
  • 上記の対応はPCにも必要か？

新しいサイドバー

擬似クラスhoverを用いた折りたたみ式サイドバー
スマホではある要素を押して指を離してもPCで例えればその場にカーソルが残った状態になるので、hoverを用いて折りたたみ式のサイドバーを作る事が可能。

技術面

利点

• ページ履歴に跡を残さない。（※原稿版ではハッシュがついたサイドバーを開閉するとURLにハッシュがついたものとそうでないものを閲覧した履歴が残る）

欠点

• hoverを用いている為、カーソルを外すとサイドバーが瞬時に隠れてしまう
  • PCにおける折りたたみサイドバーの使い勝手をどこまで重視するか
  • タブレットにおいても上記の特性により使い勝手が悪くなる可能性がある？

デザイン面

課題:

• サイドバーの背景を暗くする演出が原稿版のサイドバーと違う
  • 新しいデザインとして見れないか？
  • 背景用の要素を増やす事はコンセプト（サイドバーの為に特別な要素を用いなくて良い）に反するか？