フォクすけブートキャンプ＋

ITmedia エンタープライズ：Firefoxを鍛え直せ！　フォクすけブートキャンプ：第1日目：1分でFirefoxをしなやかに――WellRounded

見違えさせると言っても、一生で何度使うとも知れないようなエクステンションを紹介するわけではない。無駄な脂肪は誰も求めていない。本当に厳選されたエクステンションでFirefoxを見事に生まれ変わらせるのが週末にのみリリースされる本連載だ。ようこそ、フォクすけブートキャンプへ。

といいつつ真っ先に紹介するのがWellRounded :: Firefox Add-onsというのは絶対にうけを狙っている。
ITmedia エンタープライズ：Firefoxを鍛え直せ！　フォクすけブートキャンプ：第3日目：広い画面を手に入れろ――Autohide

しかし、Firefoxをフルスクリーンモードにすると、ナビゲーションバーが上部に残ってしまう。

いいや残らないね。私のFirefoxにはナビゲーションバーがないから。アドレスバーはメニューバーにドッキングさせて検索バーもない。Add-onだって殆ど要らないな。かえって重くなる。今インストールしているAdd-onをちょっと再検証してみようか。
All-in-One Gestures :: Firefox Add-ons
このAdd-onのおかげでナビゲーションバーが消せるので、これだけはどうしても外せない。コンテンツの表示領域の確保は最重要課題の一つだからね。他にもマウスジェスチャ系はあるが、ページ最上部へ移動、最下部へ移動にジェスチャあてられるので優位性がある。ただしオプションで、ジェスチャの軌跡を描かないようにしないと最低なことになる。
Configuration Mania :: Firefox Add-ons
もう設定は変えたし、アンインストールすべき。
Context Search :: Firefox Add-ons
文字を選択して、コンテクストメニューを出して、選択、選択。はっきり言ってコンテクストメニューはセレクトボックス以上に選択しづらいガジェットだ。なんであんなに四角くてちっこいんだよ。でっかいリングメニューにしてくれるAdd-onがあればこういう拡張も生きるんだが。どちらにしろ必要ない。文字を選択したら、好きなFirefoxのウィンドウのアドレスなり検索ボックスなりにドラッグドロップして検索すれば事足りる。
Download Statusbar :: Firefox Add-ons
これは今現在個人的に有用。オプションでパーセント表示だけにして、細くして色を変えてやると可愛い。というかデフォルトのTool → Downloadsが酷すぎ。
DOM Inspector
われわれ（誰）のりーさるうぇぽん。これがないと言い様のない不安に襲われる。テーブルレイアウトを破壊したり、汚い広告を消して印刷したり、idやclassを調べたりできる。
Greasemonkey :: Firefox Add-ons
個人的には面白いけれども全然おすすめできない。パフォーマンスへの影響が図りしれん。世に出回っているスクリプトも、基本的におもちゃとかハックだし。その辺をちゃんと天秤にかけて使うべき。まあ要らないか。
Stylish :: Firefox Add-ons
これ要らなかった。最初便利かなと思ったけど、せっかく書いたCSSがroamingっておい。@importもうまくいかなかったし、そもそもuserContent.cssとかで間に合うよ。GUIの便利さってのはあるが中途半端なのでCSSを書かない人には敷居が高すぎるし、十分活用している人にとってはCSSの同期を取りにくかったりする。ってこと。
そんなわけで、私にとって必要と言えるAdd-onは二つしかなかった。Add-onを検討する前に、Firefox本体の持っている機能の活用を考えるべきだろう。スマートキーワードは定番（404 Blog Not Found:Firefox - スマートキーワードをSmarterに）だ。誰かが言及済みだろうが、bookmarkletにkeywordをつけると、まるでコマンドラインユーザーインターフェイスのようだ。というかCUI。「%s」を活用すると、インタラクティブなbookmarkletを作れる。まー「詳細は後ほど」だ。

Googleハック他

Google with keyboard用のGreasemonkeyスクリプト

for (var a,i=0,j=1,links=document.links,len=links.length; i<len; i++)

    (a = links[i]).className == "l" && a.setAttribute("tabindex", String(j++));

Googleの検索結果の最初のアイテムにtabindex="1"、次のアイテムにtabindex="2" and so onするGreasemonkeyスクリプト。 わざわざ書いちった。だって探すの面倒くさいんだもん。

実はFind As You Typeがあるから、スクリプトを書かなくても特に不自由ははないんだけど、あれASCII打つと一文字ごとにページがちょこちょこ移動してウザいのよ。

近況

SpreadSheetML、所謂XML Spread Sheetのスキーマを読む羽目に。これを任意の形式に変換するXSLTを書けるようになれれば便利な入力環境が一つ増えることになるので、まあWordMLのときよりは面白い。ドキュメントよりXML Schemaで確実に読んでおきたいけど、苦手なんだよあれ。Relax NG で読みたい。

というわけで、他にも実生活上色々用事がありサイトの再構築をやっている暇がない。休日を充てられないし。だがHyper Linkについて思うところが沢山あって、こんな糞ブログでは書ききれないし、でも書きたいしという葛藤が。今度は実験サイトじゃあなく、ちゃんとしたウェブページ群を作りたいんだ。

フォーム部品を不適切に使うな

Defeated By a Dialog Box (Jakob Nielsen's Alertbox)

Interaction techniques that deviate from common GUI standards can create usability catastrophes that make applications impossible to use.

一番ありがちなのが、セレクトボックスのアイテムを選択した瞬間、スタイルシートが切り替わったりするやつ。あれは選択に失敗しやすいガジェットなんだから、切り替えの実行には別途ボタンを用意すべし。それ以前に決定のためのガジェットではないだろうが。スタイルシート切り替えくらいだからまだ被害はないが、少しはGUI標準を知ってくれ。

前にも書いたっけ?

あと、「タブ」というのは本来同じリソースについて、複数の異なる視点での表示に切り替える為に使うもの。今現在使っているこのはてなダイアリの「日記を書く」では今書いている記事を「編集」「プレビュー」をタブで表示切り替え可能だが、これは良くできている。なんだか思いがけず「はてな」を褒めてしまったな。ところが、タブブラウザのそれは非常に出来が悪い。極めて多くのユーザーが使い勝手の悪い方法でタブを使用している。すなわち全く関係のない情報をタブで並列してしまっていたり、Googleの検索結果のリストとそのリンク先とをタブで並列させてしまったり。それではリストを逐次選択しづらいだろうに。

Tabs are supposed to be used for rapid switching between alternative views of the same information object.

この問題の原因は色々ある。その中でユーザーの無知というのは殆ど問題とするにあたらない。それは複数の本質的な原因による中間結果の一つであるためだ。先日上げた「さいどばー」の件、つまり末端のウェブコンテンツごときが横幅を奪うこと、はその最も大きな原因の一つだ。

ブログのサイドバーは要らない

記事本文（いわゆるpermanent link / permalink）に関して、「サイドバー」は100%要らない。要ると思っているのは100%勘違いである。エゴで固執するなら「さいどばー」に相当するリソースへのハイパーリンクを提供すればいい。Web2.0なんだろ? だったらそのリンク先を得意のAjaxとやらで上手に扱えばいいじゃないの。もっともその程度にAjaxなんて全然必要ないけれども、かっこよさげだろう? わらい。

煩悩是道場の中の人は情報の消費者の視点で記事を書かれているが、サイドバーは「ブロガー」として見ても要らないものである。せっかくのPCのマルチタスク機能の利用を妨害してまで横幅を消費する価値が、「さいどばー」にあるのかどうかを考えればわかる。ある記事を参照しながら何かを書くときウィンドウを左右に二つ並べないのは、多くの人にとって「並べることができない」からだ。その原因がサイドバー。今でこそCSSでレイアウトされているから、これを無効にすればなんとかなるが、昔はテーブルでレイアウトされていて殆ど手の施しようがなく、自分でスクリプト（今で言うGreasemonkeyスクリプトのようなものをIE+Proxiomitronでやっていた）を書くしかなかった（※）。しかし今だって例えばFirefoxならView→Page Style→No Styleを知っている人がどれほどの割合でいるのだろう。知らない人にとっては手の施しようがない。

高解像度のディスプレイを買えば解決する問題だがそれを要求するのはどうか。モバイル機器を利用する人だっている。それ以外にも書くのもうんざりするくらい色々な「必然的」環境がある。そもそも横1600px以上のモニタを購入して「ウィンドウを二つ並べられるようになったぞ！」というのは悲し過ぎるだろう。わらい。

そして多くの人がマルチタスクを妨害される状況に慣れてしまっている。恐ろしく馬鹿げたことだと思う。最近少し嬉しかったのは、Windows Vistaのヘルプアプリケーションが「サイドバー」を使用しなくなったことだ。それを参照しながら他のアプリケーションを操作するんだから当たり前すぎるくらい当たり前なんだが、ようやく気づいたのだろう。

この記事に反感を抱く前に、ウィンドウを二つ並べての作業を可能な環境を借りてやってみればわかる。私は10年以上やっているし、あるユーザビリティの権威もやっているらしい。昔はマルチモニタを使っていたが、今は高解像度のモニタに投資を惜しまない。恐らく周辺機器でもっとも投資価値が高いものの一つだ。それも視覚障害者でないかぎり普遍的にだ。私は頭の出来が悪いらしく四つ以上のウィンドウを開いているとかえって混乱するが、そうでないなら素晴らしく投資効率が上がるだろう。

ブログの記事なんてものは情報の末端なんだということを良く自覚すべきだと思う。本文と、十分に関連性のあるリンクがあれば良いのであって、情報のターミナル（カタカナの「ターミナル」）になったつもりでいるのは恥と知るべきだ。

以上、最近1200×800pxのノートを使う機会が多く不満が再燃した、という話。まあ別に普通の読み物系ならガッカリするだけだが、プログラムのソースコードをpre要素で紹介したりするブログがサイドバー系だった時には軽ーく殺意を抱くことを覚えておいてくれ。ああ、別に私に殺意を抱いてくれてもいいよ。私は何のコミュニティにも参加していないし、暗黙的な徒党も組まない。今は何のしがらみもない。

※ 最近「論理マークアップ」なんて役に立たないとかなんとか書いている化石ブロガーを発見したが、履歴から消えてしまってリンクできない。SEOがどうとか言っていたな。SEOの観点から論理マークアップが役に立たないのは、論理マークアップが駄目なのではなくてSEOという行為自体が糞だからということに気づいていなかったみたいで、なんだか筋が通っていなかった印象がある。

追記。Hatena::agenda - 「ブログのサイドバーは要らない」の反論にこたえる

HTML5をハイパーテキストの観点から批判する

font要素があったっていいくらいじゃないかというか、どうでもいい部分だ。

HTML5は初めて読んだ。断言する。HLink（またはそれに準じるもの）が使えないならHTMLを再定義する価値はない。Link Typesをみると、prefetchとかnofollowとか、性懲りもなく非論理的なリンクタイプが定義されている。というか、それってリンクの型じゃなくてコマンド名じゃねーかよ馬鹿。こいつらリンクの概念が頭の中でごっちゃごちゃで、何がHTMLの価値なのか全く理解していまい。Hatena::agendaの読者はHTML5を参照しなくていい（って言いたい気分）。

笑うべし。NielsenがAlert boxで言っているfat linkすら実現できないようだ。面倒くさいから自分のJavascriptコードからコピーすると、こういうのが「リンクタイプ」だろ。

const POINTER_TYPE = 1;

const REFERENCE_IMAGE_TYPE = 2;

const REFERENCE_DOCUMENT_TYPE = 4;

const TOC_LIST_TYPE = 8;

例えば REFERENCE_IMAGE_TYPE は文書の理解の助けになるような参考画像へのリンクを表しているが、こういうリンクの型をHTMLで明示することによるメリットの一は、そのリンクをどう利用するかをユーザーが選択可能になる点にある。文書の流れを重視してembedで表示するか、ポップアップで表示するか、それともサイドバーのようなペインに置いて、常に参照しながら文章を読み進めるか。これらをユーザが選択可能になる。UAは「参照画像をどのように扱いますか？マスター」と聞きゃいい。これが「リンクに意味を付加する」ってことで、言い換えると、製作者がその終点アンカーにリンクした「意図」ともいえる。決してUAに対する命令なんかであってはいけない。

リンクタイプexternal？ドメイン内外なんて本質的に重要でないし、タイプ分けなどしなくてもUAがURIで容易に判別できるだろ。大笑いだな。

邦訳HTML支援について

「入力は簡単に、利用は快適に」を目指して、HTMLのスキーマ（4.01DTDの脳内サブセット）、愛するJavascript1.7で書かれたDOMの拡張、そしてスタイルシートを提供する。

利用者（自分）はただ一つのHTML文書を作成し、一行のscript要素を追加すれば、Firefox等のブラウザで「ヘルプアプリケーション」を利用できる。

このセットは、強力に邦訳文書に特化しているといえるわけではなく、普遍的な部分が大きい。Web2.0の馬鹿らしさを知っている人なら私の意図も分かると思うが、私は早くくだらないブログへの依存症を克服し、サイト作りに復帰したい。二年前煙草をやめて沢山の時間を取り戻したように。

正しくHTMLを書こうと心がけている人に5つの質問 に答える

正しくHTMLを書こうと心がけている人に5つの質問 : 雑記帳 : der Gegenwartに答えてみる。自分の認識を整理するのに役立ててみた。

HTML文書を制作する際に使用しているプログラムをお答えください。（Webプログラムも含む）
意地悪しないで書くと、Microsoft IMEと様々な入力環境。
採用しているDTDとその理由をお答えください。
最近はHTML4.01。文書インスタンスはこのDTDに基づいて省略できるところはすべて省略して書き、Javascript1.7でHTMLの非力なリンクトラバーサルを補うのがマイブーム。
何故正しくHTMLを書いているのですか？
間違えて書かなければならない理由がないから。自然なこと。
W3CとWHATWG、どちらに期待してますか？
リンクのセマンティクスの強化に主に力を入れている方に期待するだろう。どっちなの?
あなたにとってHTMLとは何ですか？
「文書にメタデータを与える方法」というのが現在の私の認識。「ハイパーテキスト」としてのメタデータの語彙が非常に少ないのが謎。そこが不満。