Studencheskie Programmisty

http://nodaguti.usamimi.info/ にアクセスした時に、単純にリダイレクトするのは面白くないと思ったので「サイト入り口」的な感じにしてみた。

なんとなくフォクすけのロゴを置いてみた。ENTERキーをフォクすけに持たせるのに結構苦労し、かなり時間がかかってしまった。慣れない画像編集なんてしないで素直にそのまま置けば良かった...

本当はふぉくす子を住ませたかったんだけど、画力がだいぶ足りなかったｗ
まあまたそのうちいい画像があったらということで。

鳩丸ご意見番 - なぜ BLOCKQUOTE でインデントしてはいけないのかを読んで、昔からあれだけ言われてることだし blockquote を今どきインデントに使ってる人なんているのだろうかと思い、以下のようなCSSをユーザースタイルシートに入れてここ２，３日過ごしてみた。

blockquote[title]:after{
  content: "\300E" attr(title) "\300F";
}
blockquote[cite]:after{
  content: "(" attr(cite) ")";
}
blockquote[title][cite]:after{
  content: "\300E" attr(title) "\300F(" attr(cite) ")";
}
blockquote{
  border-left: 4px solid !important;
  padding-left: 1em;
  margin-left: 1em;
  background-color: #ccc !important;
}
blockquote:before{
  content: "Quotation: ";
  display: block;
  font-style: italic;
  font-weight: normal;
  text-decoration: underline;
}

すると、 漢検1級挑戦記という酷いサイト（別に中身が酷いとかいうわけではなくて、ソースが酷いということ）に遭遇した。
blockquoteを3重にしてインデントしている。よくよくソースを見てみると、

<META name="GENERATOR" content="IBM WebSphere Studio Homepage Builder Version 11.0.3.0 for Windows">

というように書いてある。一条戻橋：漢検準１級合格法も、ホームページビルダーを立ち上げてみよう（ホームページは難しくない）も、IBM WebSphere Studio Homepage Builder だった。

上のホームページビルダー11が発売されたのは2006年12月1日だ（「ホームページ・ビルダー 11」が発売--利便性向上、ポッドキャスト対応に:ニュース - CNET Japan）。

それに対し、blockquoteをインデントに使うなということを指摘した冒頭のサイトは2000年3月23日、手持ちの(株)シーズ『改定新版 HTML ポケットリファレンス』(技術評論社,1998年)にも同じようなことが書いてあるから、少なくとも1998年にはblockquoteは正しく使いましょうということが言われていたことになる。

最近のバージョンで直ってるのかどうかは知らないが、自動でHTMLを生成するならせめてきちんと正しいHTMLを出すくらいのことはして欲しいものだ。

CSS3 の target 疑似クラスで脚注を動的に表示する - lucky bagを見て、さんざん既出かもしれないけど、よく長い説明とかネタバレとかを隠すのに使われる、クリックで「表示」と「非表示」をトグルするのをCSSだけで実現できるんじゃないかと思って実験してみた（1文長い..)

結果から言うと、次のような感じでできた。

隠されている文章を表示

現金自動預け払い機（げんきん じどう あずけばらいき／ATM, Automated Teller Machine） は、通常、紙幣（及び硬貨）、通帳、磁気カード等の受入口、支払口を備え、金融機関や貸金業者、現金出納を行う業者の提供するサービスが、顧客自身の操作によって取引できる機械を指す。
元々は都市銀行の店舗に設置され、普通預貯金の預け払いに用いられ出したが、今日、金融機関はもとより、小売店や公共施設などに幅広く設置されている。
また、普通預金以外の取引や現金を介さない取引も広く取り扱うよう進化しており、自動取引装置、自動窓口機などとも呼ばれる。（Wikipediaより） 隠す

<style type="text/css">
#hide-atm{
   display: none;
}
#hide-atm:target{
   display: block;
}
</style>
<a href="#hide-atm" id="title-atm" name="title-atm">隠されている文章を表示</a>
<p id="hide-atm">
現金自動預け払い機（げんきん じどう あずけばらいき／ATM, Automated Teller Machine） は、通常、紙幣（及び硬貨）、通帳、磁気カード等の受入口、支払口を備え、金融機関や貸金業者、現金出納を行う業者の提供するサービスが、顧客自身の操作によって取引できる機械を指す。<br />元々は都市銀行の店舗に設置され、普通預貯金の預け払いに用いられ出したが、今日、金融機関はもとより、小売店や公共施設などに幅広く設置されている。<br />また、普通預金以外の取引や現金を介さない取引も広く取り扱うよう進化しており、自動取引装置、自動窓口機などとも呼ばれる。（Wikipediaより）
<a href="#title-atm">隠す</a>
</p>

hide-atm の要素がターゲットされると display:block で表示されるようになり、ターゲットが外されると再び display:none の状態に戻って隠される、というわけ。id名がアレなのはスルーして下さいｗ

１つ１つにidをふらなきゃいけないのが欠点といえば欠点だが、例えばCSSを

[id^="hide-"]{
   display: none;
}
[id^="hide-"]:target{
   display: block;
}

みたいにすれば、id名の先頭が hide- のものは自動的に開閉するようになるから、そんなに面倒というわけでもないかもしれない。

target疑似クラスが実装されていないのは IEのみ（IE8含む）、E[attr^=val] が実装されていないのは最新版ではOpera10だけで、IE8でも実装されている。 というわけで、IEを切ってもいいのであれば使える技かもしれない（その決断をするのが難しいんだけど）。

blosxom.org: URLからCGIのファイル名を隠すを見て、このブログでもやってみようと思ったわけです。

具体的には、http://nodaguti.usamimi.info/blosxom/ にアクセスすれば http://nodaguti.usamimi.info/cgi-bin/blosxom/blosxom.cgi/ を表示するようにするために、まず最初に

RewriteEngine on
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^blosxom(.*)$ /cgi-bin/blosxom/blosxom.cgi$1 [L,QSA]

と書いてみた。 しかし、これだと http://nodaguti.usamimi.info/blosxom/other/ のようにカテゴリごとや年・月ごとの表示はうまくいくものの、 http://nodaguti.usamimi.info/blosxom/other/guide.htm のように個々の記事へアクセスしようとするとなぜか500になってしまう。

その後いろいろ調査した結果、どうやら blosxom.cgi/〜 のような.cgiを含むURLを書き換えるのがうまくいかないようだった。（http://nodaguti.usamimi.info/index.htmlとかの普通のページへの書き換えはうまくいく）
なので、書き換えじゃなくてリダイレクトだとなぜかうまくいくので、今は以下のようにしてしのいでる。

RewriteEngine on
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^blosxom(.*)\.(.*)$ http://nodaguti.usamimi.info/cgi-bin/blosxom/blosxom.cgi$1.$2 [L,QSA]

RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^blosxom(.*)$ /cgi-bin/blosxom/blosxom.cgi$1 [L,QSA]

でもこれだとリダイレクトはされるかわりにロケーションバーに長いほうのURLが表示されちゃうんだよね...
できれば短いhttp://nodaguti.usamimi.info/blosxom/カテゴリ名/記事名.htmの方でリンクして欲しい。

追記(2009/12/27)。結局、blosxom.cgiを隠すのは諦めて、せめてcgi-binディレクトリを隠すだけで妥協することにした。すなわち、

RewriteEngine on
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^blosxom(.*)$ /cgi-bin/blosxom$1 [L,QSA]

こんな感じ。