FixScroll0.8をリリースしました。
変更点は2つです。
(1)ユーザーレビューにいただいた以下の対応しています。
画面上下の端以外は想像以上に快適でしたが…他のアドオンと併用する際には注意が必要そうです。
具体的には Firebug や Adblock Plus の「ブロック可能項目一覧」のサイズ(高さ)変更ができないのです(別ウィンドウ表示は可能)。
この点が解消されないと常用は「厳しい」と感じました。
サイズ(高さ)の変更に対応はしたのですが、上下に追加された要素を表示OFFする際のイベントを捉えるのが個別対応になっているため、Webconsole・Firebug・Adblock Plus以外のものは表示領域が元通りになりません。その場合、ツールバーのFixScrollボタンをOFF/ONするか、Windowをリサイズするかすれば元通りになります。
(2)ページを最後までスクロールした際に、表示エリアを分割している線を太くしました。
最後まで行ったかどうかをスクロールバーを見ないでも分かるようにしました。
あとは細かいバグつぶしです。
最新版がAMOに表示されるまでは時間がかかるため、すぐにアップデートする場合はGitHub - ono4ji/fixscroll: 読みやすいスクロールを目指すFirefoxのアドオンから最新のバージョンをダウンロードしてください。
CSSでのminWidth、minHeightは子要素から親要素には引き継がれない
アドオンレビューいただいた指摘、WebコンソールやFirebugとの競合解消のメモです。
Twitterでこんなことつぶやいたが真っ赤なうそでした。すいません。
単にtabのstack内にinsertしていたcanvasに対してminサイズを指定していなかっただけでした。
昨日fixscrollのfirebugとの競合を調べて分かったこと。tabbrowser内にposition:absoluteでbrowserとcanvasを指定しているため、tabbrowserと同じ階層に追加されるelementのサイズ変換を邪魔してしまう。
最終的な対応
- stack.style.minHeightを設定
- canvasBox.style.minWidth, canvasBox.style.minHeightを設定
今回の対応で必要になったのは、splitterを使って要素の大きさを自由に変えられるようにすること。
現状
試したこと
- canvasに対して、style.minWidthとstyle.minHeightを指定。
->何も変わらず。
- canvasBoxに対して、style.minWidthとstyle.minHeightを指定。
->sidebarのsplitterでサイズ変更できるように
- stackに対して、style.minWidthとstyle.minHeightを指定。
->WebコンソールとFirebugのsplitterでサイズ変更できるように
まとめ
自分がCSSの解釈をできていないことが原因でした。
無職のプログラミング CSSの max-width/min-width/max-height/min-height についてまとめてみたにもあるように、親子間でのwidth,height,min,maxあたりは相互に関係性を持っている。
子要素に指定してやれば親要素はそれを加味してくれると期待していたが、そうではなかった。(親の指定を子が引き継ぐようなオプションはある)親要素に指定する必要あり。とはいえ、splitterからすると完全な親に対して指定している訳ではないのに動作している。tagや属性によっても動作が異なるのではないかという想定。
今日か明日には本対応を入れたバージョンをリリースする予定です。
->12/19にリリースしました。遅れてすいません。
スクロール考察その2
前回はスクロールが何で今の姿になったのかを書いたので、今度はスクロールの何が問題か、ということを考えていきたいと思います。
コンテンツが動くこと
ほとんどはこれです。
電子での大きな特徴でもありますが、本来静止している状態で見るものが動いてしまうことが問題だと思っています。動画は本来動いているものが動いているだけなので問題なしです。ただ、動画の表示されている領域がごちゃごちゃ動いていたら酔ってしまいそうです。(手ブレしている動画を見ているようなもの)
私にとって普通のスクロールをしている瞬間は、本を読んでいるときに横から揺すられているような不快感を感じてしまいます。読みたいのに邪魔するなよと。
それを防止するために大体はキーボードでスクロールを行うようにして、自分のスクロール量を把握して極力短い時間でスクロールするようにしていました。
人間のコンテンツを認識するときに働く脳のエリアは静体視力とつながっているのではないかと。おそらく数千年ほど紙という文化で培われてきたものだと思うのですが、文字情報や画像情報を読み取るときには静止した状態がベストなのです。
だからこそ、電子書籍の媒体はスクロールではなく、完全なページングの手法をとっています。(出版業界の人からするとただ紙と同じように管理したいだけなのかもしれませんが)
WEBサイトから消えたマーキー
ちょっと違うかもしれませんが、私にとってはマーキーもスクロールも同じような印象を受けます。
なぜマーキーが消えたって?読みにくいからでしょう。
なぜスクロールが気持ち悪いかって?マーキーと同じ理由でしょう。
コンテンツを動かさない方法
一時期、Webサイトのページは最初の表示分で収まるようにするという意見がでていました。今でも商業製品のページだと多かったりします。
やっぱりユーザーが一目で情報を得られるのと、スクロールする手間を省けるのが大きいです。またデザイン的にいろいろな環境を考えずに、一番凝れるのでデザイナー冥利に尽きるのもあるのだと思います。
ですが、スクロールなしだと、どのくらいのボリュームかも分からないし、クリックなどのアクションをして情報を得ていくのは普通の文章だとなかなか難しいのもあり、スクロールを利用するページのほうが多いのが現状です。
じゃあ、どうしよう。コンテンツは動かしたくないけど、情報は次々に表示していきたい。
というところの解決を目指しているわけです。
スクロール考察の前に、自分の立ち位置
私の感じている問題意識は「パソコンとか電子機器の画面って読みにくい、見にくいなぁ」です。
といっても全部が全部というわけではなく、特に感じている「本」 VS 「パソコン・携帯」での読書なり、ブラウジングといった文章を読んでいくときのすんなり感の差や自然感の違いに特に問題を感じています。
#電子書籍が増えている最近でもこのもやもやした感覚はなくなりません。
本が完璧という訳ではなく、本には本の方向性、電子には電子の方向性を持って進歩していくのが良いと思っています。その中で、関心の大部分を締めているのがスクロールです。
これまでもみんなと同じ普通のスクロールで生きてきて、慣れているので自分の生活の中で使わない日はないです。ただ、アドオン開発後のデフォルトブラウザは常にFirefoxです。デイリーユースしているのは、ただただそれが自分にとって使いやすいから。私の感覚ではFixScrollが自然なのです。
しかし、FixScrollが最後の解だとは思っていなく、このアドオンがきっかけで電子機器のUIを向上させる試みが加速してくれても本望です。「最近のスクロール熱くねー」みたいな会話が出てくる日を心待ちに^^
スクロール考察その1
アドオンの正式リリースが待ち遠しいので、スクロールに対して思っていることをメモしていくことにしました。
とんでもない偏見と間違った解釈だとしても、言い切りたいと思います。
まずは今のスクロールができた自分なりの仮説。
時代はCRT/ブラウン管が出発点です。白と黒の時代からカラーまで。
macがマッキントッシュだった頃もCRTだったので、CRTはコンピュータができてからの付き合いのはず。(その前はパンチ紙で会話していたのかも)
CRTには焼きつきという問題がありました。同じ画面を表示し続けると、画面を表示する機能が失われてしまいます。(それを防ぐために、スクリーンセイバーという機能も生まれました)
スクロールもCRTの焼きつきを防ぐために今の形になったのではないかと考えています。スクロールすれば、同じ画面でも少しずれるため、焼きつきの防止になります。
そんな昔の制約に縛られた機能が今も残っているのがスクロールなのだと考えています。(キーボードのキー配列と同じです。)
今のスクロールの地位を確立したもの
それは映画です。エンドロールは今のスクロールと同じです。
きっと昔は、OHPみたいなもので手動でくるくる回してエンドロールを表示していたはずです。それが今も残っています。
#ただ、映画を見終わった後にあのエンドロールを見ながら感動するのは不思議です。
#どんな形でもいつか載りたいと思ったものでした。(裏方的な意味で)
中でも特に影響があるのはスターウォーズ。あの文字が流れていくプロローグです。
最初も最後もスクロールしてます。スクロールは芸術的には良い方向なのだと思います。表現上は、です。
スターウォーズは好きですが、プロローグは嫌いです。あそこに書いてある文字を一回で読めたことがありません。ここで、「スクロールは、人が文字を読むのには不適切なもの」と感じるきっかけをくれたのです。
FixScrollの解説動画を作りました。
Twitterでつぶやいてくださっている方がいて、どんなものなのか言葉だけでは伝わりにくいということで、解説動画を作りました。
BTOパソコンの横断検索サービスをβ版リリースです。
この前BTOパソコン買った時に、いろいろな会社のサイトを行ったり来たりで不便だなと思ったのがきっかけでサイト作ってみました。
基本的なオプションに絞っていますが、条件を入力して検索すると複数社のサイトから該当するパソコンを検索できます。まだ3社しか対応できていないですが、これから徐々に拡張していく予定です。
課題も山積みなので、しばらくはひっそりと開発を続けていく予定です。
要望などいただけたら優先して開発するかもです。
パソコン買うときにチラッと使ってもらって、他社比較はもちろん対象企業内比較にも使ってください。
(自分で買うときに条件と会社を決めていたが、どのラインでオプション選ぶのがいいのか調べるのに時間がかかったのが一番歯がゆかったです。これも解消できるようには作りました。)
カ○クコムとかにも同じような検索機能がありましたし、その他のサイトも見てみましたが、詳細オプションまで調査対象にしていなく、ベースオプションに対して検索できるものしか見つかりません(調査不足かも)。全ライン全オプションの網羅検索というのが狙いです。
良ければお試しください。
名前の由来はスペック=specification->略してspec-if。スペック+if(条件)で機能的に近いかなと思って命名しました。