agenda 2002-10(上旬) Linkage Weblog

Wired、XHTML + CSSでリデザイン

公開
2002年10月13日

Wired (英語)が、XHTMLとCSSによるサイトの再構築を終えたらしい。scottandrew.comの記事 (英語)で知る。面倒臭いからソースはあまり見ていないのだけど、Mark Pilgrimさんによれば、サードパーティによる広告を除けばValidなXHTMLなんだそうな(参照:Domino @ dive into mark (英語))。私もユーザースタイルシートを使って観て回ってみたところ、噂どおりtableタグは一切使われていないようだ。

私にとっては、「MSXMLでパースできる貴重なニュースサイトが一つ誕生した」といったところ。客観的に見れば、現実に適合する形でXHTML + full-CSSを採用したサイトが誕生した、といったところだろうか。コマーシャルなサイトなのだから、現実的な配慮は不可欠なはずだ。例えばXML宣言が省略されているのは一つの例。そういうわけで、このWired (英語)のXHTMLのコーディングやCSSの使い方などは、クロスブラウザ派の参考になるかも知れない。

一方、日本のWired Newsは、というと……title要素すらない謎HTML。ああ、そうかframeの断片だったのね。それでtitleを記述しないというわけか。「Wired News」でGoogleの「I'm feeling lucky」して得られた結果だから、そんなことは知る由も無い。

読書

公開
2002年10月12日

作者が讀者の意表を突く事を最大の目標に書いてゐる、と云ふ事に氣附いて以來、ミステリもSFも俺の興味の範疇から外れた。

闇黒日記(平成14年10月11日) より

こういう話があります。

  • 公衆トイレから出てきたその男は、首に黄色いスカーフをなびかせており、頭に乗せられた風呂桶には水がたっぷりと入っていたので、バランスを取るのに苦労している。

    たまらなくなって私は尋ねてみた。

    「あなたは一体何をしているのですか」

目をキラキラ輝かせて「それで? それで?」と聞き返してくる相手の反応を楽しむという悪戯。

無意識に感じてゐる事を、まざまざと實感させて呉れるやうな文章しか、讀む氣がしない。

闇黒日記(平成14年10月11日) より

私は精神的経験になるものならどんなものでも読みます。似たような事を下手くそに言い換えている可能性がありますが。

周りには、知的経験としての読書しかしない輩が多くて困ります。

  • 「あの話のこれはどう解釈したら良いのか」
  • 「何故あの登場人物はあの場面であのような行動を取ったのか」
  • 「あの描写にはどういう意味があるのか」

それらを知って「なるほど」と言いたいのか。「なるほど」と言う為の読書など止めてしまえ、……と言いたくて言いたくてたまらない今日この頃なのですが、結局言えない自分がここに。そういう愉しみがあるのも事実。

知性にアイデンティティを感じている人には、未知の感性が沢山ある。ところが、「知る」という行為は頭で知ることだとしか考えないものだから、「感性を知る」という行動は定義さえされないんですな。困ったものです。

某協会の長老たちは素晴らしい人生を送っているのだと言ったら、馬鹿にされました。「敬虔な祈り」といったものを経験したことも無ければ知りたくも無いのでしょう。知ろうしないのは馬鹿であり、故に私はそういうインテリが大嫌いです。ちなみに恥ずかしながら私は無宗教。

一度は経験した感性であっても、頭で否定できればそれらは全部「嘘」。それじゃああなた、理解できない人間が増えてゆくだけですよ。理解できない人たちを心の内でへらへら笑っているくらいなら、「生活者」の人生の方が余程ましだとは思わないか。

何の為の読書か。

何故CSSを無効にする必要があるのか?

公開
2002年10月9日

ウェブページは、全ての閲覧者に同じ見栄えで見てもらうことが不可能です。しかし見栄えは異なっても中身は伝わるように、見栄えに関する情報を内容から切り離すことができます。この見栄えに関する情報がCSSであり、これを無効にすることで、確実にウェブページを閲覧することができるのです。

CSSに対応していないブラウザならば、最初からCSSは無効なので問題ありませんが、CSSに対応しているブラウザには、この「CSSを無効化する手段」は必須です。なぜなら制作者のミスやそのブラウザのバグによって:

  • CSSが原因で内容が読めない

というお粗末な事態になりかねないからです。

WindowsのInternet Explorer5/6は、文字が消える、アンカーをクリックしても何も起らない、などCSSに関して大きなバグを幾つも抱えています。ここで、そのようなバグが露出したウェブページに遭遇した場合、制作者とユーザーのどちらに責任があるでしょうか。

一般的には:

  • 「おたくのウェブページは表示がおかしい」

と、文句を言うのはユーザーです。しかしこれは本当は異常なことです。悪いのは、バグを抱えたブラウザであって、仕様どおりにウェブページを公開している制作者に責任はありません。

視点を変えてみる

ちょっと考えてみましょう。

  1. 私はきちんとしたデータ形式に基づいたJPEG画像を作り、公開しました
  2. 多くのブラウザは、きちんとJPEG画像を表示してくれます
  3. 一部のブラウザは、JPEG対応を謳っているにもかかわらず、壊れた画像を表示してしまいます

ここで、その「一部のブラウザ」にもJPEG画像を表示させるためのちょっとした小技があったとします。

  • 製作者である私は、その「小技」を使わなければならないでしょうか
  • ユーザーは製作者である私に「小技」を使うことを要請するでしょうか

常識的に、ユーザーはブラウザ製作会社に文句を言います。または使用するブラウザを変更します。問題は、CSSの場合には、その「ブラウザ」が大変にメジャーであるということです。しかしメジャーであろうがマイナーであろうが、責任の所在は変わりません。一般の多くの製作者は泣き寝入りして「小技」を使わざるを得ないのですが(私も数多く使っています)、奇妙なのは、そのような「小技」を使わないという選択をした製作者を誹謗(信者うんぬん)する似非紳士の存在です。

一部の某ブラウザのバグに付き合った解を求める行為は、Accessibilityの追求とは似て非なるものです。WebのAccessibilityは、あくまで「」をターゲットにしています。マウスを操作できない、目が見えない、音が聞こえない、等々です。決して、「アンカーをクリックしても何も起らないブラウザ」「先頭に処理命令があるとソースを表示してしまうブラウザ」「transparentキーワードを使うと背景が真っ黒になってしまうブラウザ」を相手にしているのではありません。です。

User Agentの機能不全を視野に入れたAccessibilityなど、あり得ません。歩み寄るべきはUser Agentの側であることは明らかです。身体障害をもったユーザーは排除されるべきではありませんが、機能不全を持ったUser Agentは積極的に排除されて然るべきです。

さて、このようなUser Agentのバグに付き合う行為は何と呼ばれるべきでしょうか。泣き寝入りと呼ばれるべきです。配慮と呼ばれるべきではありません。例えばその辺の素人が一晩で作ったブラウザにバグが多数あったとして、一々それに付き合ったウェブページを作る人はいません。ところがそのブラウザがメジャーになってしまったとしたら、一般的に「泣き寝入り」するしかないんです。飽くまで「泣き寝入り」です。そんなものがモラルであるわけがないんです。

ある事例

あるCSS採用ウェブサイトは、Ineternet Explorerにて表示が崩れます。そのサイトの一閲覧者は、ちょっとしたCSSの記述の変更でそのバグをgo awayするhackを知っており、サイトの運営者に知らせたとします。

この後の「運営者」と「閲覧者」両者の取る態度は、前述の:

  • User Agentのバグに付き合う行為を何と呼んでいるか

によって大きく変わってきます。

「運営者」はこれを「泣き寝入り」と呼んでおり、「閲覧者」はこれを「配慮」と呼んでいたのだとしたら……ちょっとした悲劇が起りますが、具体的なflameの内容は想像にお任せします。

問題を解決する簡単な方法

さて、本来なら表示がおかしかった場合には:

  • ウェブページのスタイルで表示しない

このようなユーザー設定項目があり、それを選択することでCSSが無効になるのが望ましいのです。あるいは、ウェブページのCSSを完全に上書きするようなユーザースタイルシートを利用することで、同様の理想が実現します。

CSS対応を謳うブラウザベンダの取るべき処置としては:

  • Mozillaのように徹底的に仕様に忠実たらんとする
  • Operaのように容易にCSSの切替を可能にするスイッチを設ける

このどちらかしかあり得ません。これこそがモラルです。いまいち設定が分かりにくく、オタクっぽい機能でしかないInternet Explorerの「ユーザー補助」は、バグの量と比較してちょっと不十分であると言って良いでしょう。

余談

と、以上ような暑苦しい「思惑」があり、ウェブページのCSSを無効にする方法はこのサイトのトップレベルコンテンツになっているわけです。XSLTする際に公開版からは消されていたようですが、以上の文章はそのソースファイルにコメントアウトしてあったものです。

ちなみに、ON/OFFの切替にするならこのような感じでしょうか。

function usr_toggleCSS(){
 var ss=document.styleSheets;
 for(var i=0,s,l=ss.length; i<l; i++){
  s=ss.item(i);
  if(s.x===undefined){
   s.x=s.disabled;
   s.disabled=true;
  }else{
   s.disabled=s.x;
   s.x=undefined;
  }
 }
}usr_toggleCSS();

しばらく試してから.urlファイルを公開する予定です。

誤訳

公開
2002年10月5日

確かこのジョークは譯した段階で面白さがかなり削がれる型のジョークだ。世界一を冠するには相應しくない。

白光日記 to 某方面 より

しかしそのジョークの日本語訳がまずかったとしたら。

原典
A couple of New Jersey hunters are out in the woods when one of them falls to the ground.
Yahoo WIRED NEWSの訳
米ニュージャージー州のハンター2人が狩りに出た。1人が木から落ちてしまった。

一体どこに、「木から落ちてしまった」と書いてあるのだろう。be out in the woods(森に出かける)、falls to the ground(地面に倒れる)。何故ハンターが木に登らなければならないのか、とか、余計な疑問が出てきてしまう。設定に不自然さを感じさせてしまったら駄目だよ。

原典
The other guy whips out his cell phone and calls the emergency services. He gasps to the operator: “My friend is dead! What can I do?”
Yahoo WIRED NEWSの訳
仰天した連れのハンターが携帯電話で『息 がない』と緊急通報した。

「息がない」というより「死んでしまった」。オチとの関連でかなり違いがあるような気が。というか、どこに「緊急通報」と書いてあるのか。「緊急」じゃあない。どうやって助けるのかを聞くために電話をしたのではなくて、連れの死にパニックに陥って電話したのだ。重要な「フリ」だと思うのだけどなあ。

原典
“Just take it easy. I can help. First, let's make sure he's dead.”
Yahoo WIRED NEWSの訳
『落ち着いて。大丈夫。まず死んでるのか確かめなさい』

make sureをただ「確かめる」と訳してしまったら台無しなのであって、できるかぎり「確実にする」「念を押す」といった誤解の可能性を孕んだ訳にしなければならない筈。「間違いなく死んでいることを確認して」とか(駄目か)。

とはいっても、やはり譯した段階で面白さがかなり削がれる型のジョークであることに変わりなかったりする。純粋なストーリーそのものの面白さとは違うから。ただ:

さて、1位になった次のジョーク、ジョークを解さないという日本人たちに「世界一」と受け取れるだろうか。

「世界で最もおもしろいジョーク」のオンライン調査結果発表(WIRED NEWS) より

このようなつまらない「煽り」を裏付ける為に原作を改竄するのは気に入らない。この訳で笑う日本人はまずいないだろう。何か嫌らしい意図を感じてしまったという話。

追記など

  • このRedneck Huntersというジョークは多くの世代、地域に満遍なく好評だったのだそうで、「世界一面白い」と言うと語弊があるようです。
  • 妙な翻訳をしていたのはYahooではなくHotWiredのWIRED NEWSだったそうで、Web日記や電子メールでご指摘いただきました。有難うございます。
  • Yahoo Newsの記事は一定期間後消されてしまうのだそうで、今後は記事の提供元にリンクすることにしました。教えて下さった方、有難うございました。
  • というか、何でYahoo Newsは記事の提供元にリンクしないのでしょうか。ハイパーテキスト的に奇天烈極まりないのですが。
  • URLに信頼性がなく、ローカルで完結された(サブ)サイトは衰退の一途だと私は見ていますが。

もう一つのRedneck Hunters

H-man AND NOW(Short Communication:Oct. 1, 2002-Oct. 31, 2002)
私にはこちらの方が面白く感じられました。

そういえば、XHTML1.0 Strictなジョークサイトというのがありました。OK、白状しろ、うちのサイトの検索機能でイカソースと入力したのは誰だ等々。

Mozillaのview-sourceのbody要素のidは#viewsource?

公開
2002年10月4日

MozillaのユーザースタイルシートであるuserContent.cssに次のような指定を追加してみる。

body:before{
 content: "id attribute of body: #" attr(id);
 display: block;
}

で、「view-source」してみると……最上部にid attribute of body: #viewsouceと表示された。(Mozilla1.1で確認)

つまりこれは、body#viewsouceを親としたセレクタを利用することで、view-source画面の表示スタイルをカスタマイズできるということだろうか。

このネタは、[css-d] CSS signatures (英語)の一連の話題から仕入れたもの。CSS signaturesというのは、サイト固有のid属性のことで、HTML文書のbody要素全てに記述する。ドメイン名等のドット(.)をハイフン(-)に置き換えるなどして一意性を確保しようということらしい。例えば、<body id="www-google-com">等々。

ユーザースタイルシート使いなら結果は自明な通り、このアイデアを採用することでユーザーはそのサイトにだけ特別なスタイルを定義してやることができる。……ってこのアイデア、かなり前に東方不敗で見た気がするのだけどー。

とりあえず、言い出しっぺの(css/edge (英語)の)Eric A. Meyerさんが妙に熱いので、このサイトでもやってみたくなってしまった。<body id="purl-org-jintrick-personnel">とか。

何の話だ。

フレーム内リンク歓迎スタイル(IE限定)

公開
2002年10月3日

フレーム内に表示されると、font-sizeが小さめになってコンパクトに。

body{
 font-size : expression((self===top)?'100%':'90%');
}

font-sizeの他、左右のmarginやpaddingも小さめにするとよいかも。

同様に、フレーム内リンク拒絶スタイルは以下ようになる。

body{
 display : expression((self===top)?'block':'none');
}

ところで、==(等価演算子)は、JScriptではデータ型の自動変換を許容してしまうので、その辺りを厳密に知らない私などは、自動変換を行わない===(識別演算子)の方を使う。間違いないからだ(宗教