高木浩光＠自宅の日記

■ 毎日INTERACTIVEを救出せよ!!

4月7日の日記「終わってしまった「毎日INTERACTIVE」」の通り、移転した毎日INTERACTIVEはもう読みに行く気が失せていたのだが、久しぶりに訪れてみると、文字の大きさが普通に近くなっていることに気付いた。スタイルシートの指定は「font-size: 94%」となっている。まあ、このくらいなら許容範囲か。（以前は何パーセントだったのだろう？）

しかし、横幅が固定であるため右端が切れ、横スクロールを強いられるだけなく印刷が不可能という問題点は改善されていない。印刷できないのでは報道サイトとして使い物にならない。

そこで、Bookmarkletを使ってスタイルシートを一時的に追加することにより、この問題の回避を試みた。

このサイトの場合、TABLEとIFRAMEの横幅が決め打ちされているところに問題がある。そこで、次のように、横幅を100%にしてやればよい。

table {
    width: 100%;
}
iframe {
    width: 100%;
}

これをBookmarkletにしたのが以下だ。このURLを「お気に入り」に追加しておけば、ページを表示した後にこれを選択することで、毒牙から逃れられる。

javascript:document.createStyleSheet("javascript:'table { width: 100%2525; } iframe { width: 100%2525; }'").v

スタイルシート文字列からBookmarkletを生成するには、Jesse Ruderman氏の「Make a User Style Bookmarklet」が便利だ。

さらに、

iframe {
    height: 0;
}

とすると興味深いことになるが、これはちょっと私からお勧めすることはできない。

見出しの一覧がまだ小さくて読みにくいので、これらも含めて文字サイズを普通に戻してしまおう。ついでに行間を調整して、リンクから下線を消す愚行を矯正しよう。

javascript:document.createStyleSheet("javascript:'table { width: 100%2525; } iframe { width: 100%2525; } p.article { font-size:100%2525; line-height:130%2525; } a.bullet, a:visited.bullet, a:hover.bullet { font-size: 100%2525; text-decoration: underline; }'").v

というわけで、私のリンクバーはこんなふうになった。

tableのwidthを100%にする「横幅固定を解除」は、あちこちのサイトで使ってみると面白い。ITに強いITmediaでさえ、横幅固定という愚かなデザインをしている（ウインドウを最大化してみるとわかる）のだが、このBookmarkletでwidthを100%に変更してみると、そう悪くないレイアウトになる。最初からこういうデザインにしてもよいのではなかろうか。