またWassrから。ネタ探し（謎）のためにインストールしたOpera 2.12及び5.0はVistaでも軽快に動きました。文字化けするのは仕様です。IE開発チームは少しOpera Softwareを見習うべき。
下はNCSA Mosaic 1.0.0.1。制作日は1993年11月11日になっています。
擬人化王国を見ました。全ての存在よヒトになれ――。
はオタクオタクしていていい言葉です。
女性の（あるいは男性同性愛者の）画師さんが偶々この手のものを手がけていないだけなのか、それとも、女性は一般的に、非生物を男性に擬人化して萌え要素を見出すという感覚を持ち合わせていないのかはわかりませんが、(*´д｀*)ﾊｧﾊｧな男性キャラクターが居てもいいと思うんですけどね。
確かにハァハァ（AA略）な男性キャラクターがいてもいいというか、いるべきですね。しかし萌え擬人化はどちらかと言うと男性オタク向けジャンルっぽいので、きゃるんぴきゃるんぴした女性キャラクターが多いのは仕方がないのかもしれません。女性オタク向け擬人化もあるにはあるのですが、やはり男性オタク向けと比べると種類も規模も桁が違うという…。
というわけで、数年前から考えていた女オタク向けの擬人化ネタを公開します。Wassrからの転載です。誤字もそのまま。「女性向け」＝「ボーイズラブ」と受け取った方には残念な内容です…と言いつつ、サイレントマジョリティー（謎）の意向を考慮して多少のボーイズラブ要素を含みますが。「拡張」、「脆弱性」という言葉に官能を感じた方には確実に残念な内容です。
参考までに、最近webで見たブラウザ擬人化ネタはIE×Firefox を考えてみる（JamDiary-twig）、蜘蛛の糸（俺的グッジョブ）、フォクすけ擬人化計画、ブラウザ・ストーリー～ブラウザ大戦記（あまたの何かしら。）です。ブラウザ大戦記は非オタク系ですが、知識とユーモアがあるということは素晴らしいことだと思いました。
メジャー四種のブラウザがメインキャラクターでOperaが主人公。いくらなんでも男が多すぎ…。でも伝家の宝刀・女体化があるのでよしとします（例：ふぉくす夫→ふぉくす代［lolifox］）。
男。主人公。所謂「おぺらきゅん」。IE対ネスケの第一次ブラウザ戦争時代を知る古参で、波乱の時代を生き抜いた
男。所謂「ふぉくす夫」。モジラファミリー筆頭で、兄にネットスケープとモジラがいる。豊富な拡張機能が売り。長いIE支配により疲弊した人々に温かく迎え入れられ、瞬く間に反IE最大勢力に成長した。打倒IEに燃え日々精進しているが、3リリース後からはSafariにも対決姿勢をとるようになった。あのイベントがIE×Fx派とSafari×Fx派のカップリング論争の種になることを、腐女子以外の誰が知るだろうか。
男。モザイクの子でネスケの弟。圧倒的シェアを誇るが敵も多い。ネスケとシェア争奪をしていた頃は勤勉だったが、ライバル消滅後は気力を失ってニート化、相手がいないと何もできないダメ男ぶりを世界に見せつけた。第二次ブラウザ戦争突入後はFx他対抗ブラウザの脅威を多少感じ、雀の涙ほどweb標準準拠に努めるようになった。ペットとして馬（スレイプニル・グラニ）を飼っている。Donut Familyというメーカーのドーナツが好物。
男。MacIEの後釜をオペラやモジラに狙われていたが、コンカラー（KHTML）の力を借りてMac標準ブラウザの地位を手に入れた。ユーザー獲得のためにiTunesやQuickTimeを持ってWindows界にも進出した。Windows版をリリースするにあたり、様々な洗礼（バグやバグやバグなど）を受けたり、セキュリティ問題でMSや消費者団体から警告を受けたりと、抜けたところがある。口がかなり悪い。
男。WWWの普及に貢献した先史時代の代表的なブラウザ。現役引退済み。子どもはネスケとIEがいる。登場人物が少年少女ばかりなので、リンクスとともに青年（保護者ポジション）キャラクターとして出演。
男。モザイクと同期。テキストブラウザという性質ゆえあまりUIが変わらず、他のブラウザ達の間で「生きた化石」、「波紋使い」と噂される。今も昔もブラウザ戦争という言葉は無縁な場所で、愛好家達と楽しく暮らしている。
女。愛称は「しぃ」。モジラファミリー・モジラブラウザの後続。Fxにいいとこどりされてしまったが、現在もユーザー達のために頑張っている。
女。愛称は「バー子」。ブラウザではなくメーラー。モジラの妹で、Fxとは双子の兄妹的な関係にある。同じモジラファミリーのサンバードとは無関係。
男。影が薄いW3C製ブラウザ。バージョン10を超える長寿ブラウザだが、常に体調が悪く休養している。彼が一線に立つ日はいつくるのだろうか。
男。1990年代中盤まで栄華を極めたモジラファミリーの祖。モザイクの子でIEの兄。その人生はブラウザ版平家物語として現在も語り継がれる。
1993年に登場したNCSA Mosaicはインターネットブームの火付け役となり、WWWは大衆化した。
Mosaicは当然日本でも使われていた。この国の同人では古くから擬人化が盛んで、漫画やアニメの動物や無生物を題材とした作品がたくさん作られていた。主に学術的目的で利用されていたブラウザもオタクな学生たちの逞しい妄想力により擬人化されることとなる。
萌え属性と人格と実体を与えられたモザイクだったが、擬人化古参の「鳥獣人物戯画」コミュニティ、腐女子達から絶大な支持を受ける「郵便受け」コミュニティなどの強大な派閥が既に存在しており、生まれたばかりの弱小ブラウザに居場所はなかった。
モザイクは息子のネスケ・IE、そして知人のリンクスとともに自分たちの居場所を求めて旅立った。
先日、生後2週間のメダカを購入しました（Wassr 2008-07-23(Wed) 18:44:52）。買った時点で2匹死んでいて、翌日にも1匹死んでしまったのですが、他は元気に生きています。早く大きくな〜れ☆彡と絶賛飼育中。
食事中のメダカを撮ってみました。餌をやる度に受精の瞬間を思い出します。ちなみに不自然なまでに餌が大きいのは、間違えて鯉の餌を買ってしまったからです。
小さな生き物は無条件にかわいいと騙されがちなのですが（？）、この画像について言えば原寸で見ると割とホラーです。メダカはもちろん餌も不気味すぎ。
少しずつOpera入門の修正をしています。助言くださった方ありがとうございます。ちまちまがんばります。
先日WordPressのバージョンを2.6にしました。噂の履歴機能とやらのの実装を調べるためにDBを眺めていたら、テーブルが増えていません。よく見るとwp_postsに記事と履歴が一緒に入っているではないですか。なんという仕様…。
履歴が増えるごとにIDが増えるのは気持ち悪いので（投稿記事が23しかない現時点で10も履歴が作られていた…）、前のバージョンに戻します。現バージョンでも履歴機能は切れるのですが、無駄に作成されたIDも消去したいので。
「IE6と他のブラウザで微妙に表示が違うよー」、「（隣接兄弟セレクタを指して）あなたの書くCSSはバグがあるよー」などのご指摘やご質問を時折受けます。テンプレート屋ならみな通る道、らしいです。
ブラウザごとにCSSの実装度は違いますし、各種セレクタはバグでもハックでもありません。…といちいち返信するのも面倒なので、利用規約に「webサイト制作や技術系の質問禁止。対応するのはこちらの記述ミスのみ」と書いているのですが、それでもたまにツッコミがきます。
初歩的な質問に応えているとこちらの身が持たないので、web制作の参考になるサイトを紹介します。後でテンプレート配布ページからこの記事にリンクします。これで質問が減ることを願いつつ。
勉強するなら書籍をじっくり読んだ方がいいと思うのですが、webにある方がとっつきやすいと思うので、ここで紹介するのはサイトのみです。「仕様書読め」もハードルが高いので言いません。
その前にうちのテンプレートについて少し説明しておきます。
@media規則はscreenのみ記述しているので、携帯電話からの閲覧にも優しい（多分）。サイト用テンプレートはXML宣言があり（IE6では後方互換モードになる）なので、基本的にIE6と他のモダンブラウザと表示が違う。前者でも不自然に見えないよう最低限体裁を整えているつもり。カスタマイズせずに使う分には、モダンブラウザにおいて極端な表示崩れはないと思います。しかしサイト用テンプレートは、知識がない方はCSSをいじらない方が無難です。IE6で不都合が出やすいです。以上。
参考になれば幸いです。難しい内容も混じっていますが、上二つは本当に初心者向けなのでおすすめです。
去年の秋頃「固定幅のテンプレートも見てみたい」というご要望をいただき、今頃作りました（ORG（7））。久々にバナーとファビコンつきです。背景画像を使っているとバナーを作るのが楽でいいですね。
実はフォントサイズpx指定も横幅固定も風景画像使用も初めてです。というか、ここまで画像でがちがちに固めた柔軟性のないテンプレートを配るのは初めてです。せっかくだからいつもしないことにチャレンジしようと思いフッターナビゲーションにしましたが、やはり上にあった方がよかったでしょうか。作成途中までは上にあったのですが、結局今の位置に落ち着きました。上にナビゲーションを置きたい方はposition: absolute;を使ってアレコレしてください。
あとWassrのアカウントは無事復活しました！ それに伴いナビゲーションに置いていたTwitterのブログパーツをWassrのものに変更しました。Twitterは調子が悪い（アクセスすると数秒間画面が真っ白になる）ので様子見。ブログパーツはあまり好きではないのですが、このブログの関連コンテンツだから！と自分に言い訳しながら置いておきます。
ちなみに現時点での最新の投稿はこれ。
実は「腐女子のためのOpera入門」の導入はブラウザ擬人化漫画を描くつもりでした。ふぉくす子とおぺらたんがありならふぉくす夫とおぺらきゅんもありなわけで、萌え擬人化は男オタクだけのものではないわけで……。絵も漫画下手という致命的な問題があり実現しませんでしたが、1年以上考えていたネタを捨てるのは勿体ないので、どこかで再利用しようと思います。
上はTwitterで書いたものです。内容がネガティブすぎると反省。
ナビゲーションにTwitterでの独り言を表示するようにしました。最近はブログをよく更新していますが、以前は2ヶ月以上何も書かないことがあったので、生存確認を兼ねて使おうかなと。
しかしTwitterもWassrも使い方が分かりません。WassrをSawwrと書き間違えまくるわ、Operaコミュニティ（チャンネル？）見てたらうっかり入ってしまうわ、しかも抜け方が分からないわ、うっかり退会してしまうわで散々でした。中の人もいたので、Operaで同人やっていいですか？くらい聞いておけばよかったです。
ちなみに現在、失効したアカウントを取り戻せないか運営に問い合わせ中です。しかし似たようなツールを二つ持っていても使うか分からず…。Wassr（
今までプロフィールの画像はドットのひよこを使っていたのですが、きちんとした鳥の写真を使おうとマイドキュメントを漁っていました。ジュウシマツ住職風写真がお気に入りです。
先日不慮の事故によりPCを初期化することになり、しかもバックアップデータも半分ほど破損して色々アレなことになっていました。
今は大分落ち着いたので腐女子のためのOpera入門を書きました。IEユーザーは騙されたと思って一度Operaをインストールしてみてください。ターゲットが分からない半端な内容ですが、折を見て修正するつもりです。HTML/CSSを少し書けるだけの一般閲覧者の私には技術的な話はできないのでオタク方面でがんばります。
オタクと言えば、TERRAZINEで少し前におぺらたんのコスプレを作ると書かれていたので、期待せずにはいられません。誰が着るのかとても気になります。あと今後の予定のところ。
- おぺらたんコスプレ衣装製作
- コミケデビュー
- おぺらたんスキン公式標準装備
- NHKネットスター出演
- ロマのフ比嘉の手により映画化
- Operaブラウザシェアトップへ
2番までが実行できる限界に思えます。
非IEブラウザ啓蒙サイト（謎）は、内容が難しかったり、対抗ブラウザに攻撃的だったりすることがあり、とっつきにくいと感じることがあるので、こういう適度なネタが必要だと思います。何ごともとっつきやすさは大切です。
管理者・利用者ともに素材サイトのオタク率の高さは異常。というわけで（？）、局地的需要がありそうな話題を一つ。
このサイトはオタク系同人者率が高いので、「オタクがOperaを使えばこういう点で幸せになれるよ！」という記事を書こうと去年から考えていたのですが、準備が面倒なので一部だけ紹介します。それがこの記事です。
簡単に言えば「FF7においてクラウドの相手はエアリスかティファか」、「DQ5において主人公の嫁はフローラかビアンカか」という系の話です。やおいで言うと「キャプつばにおいて、小次健か健小次か」になります。こういうカップリング違いが原因でジャンルが荒れ、論争や抗争が起こります。訳が分からないという方のためにWikipediaの記事をリンクしておきます。興味がない方はTERRAZIさんの「俺等がOperaを使う10の理由」記事を読んでください。そしてOperaを使ってください。
腐女子は、自分のカップリング志向が他人と合わないだけで容易に精神的ショックを受ける傾向がある。自分の嫌うカップリングは、うっかり目にしてしまっただけでダメージを受けることから「地雷」などと比喩して忌み嫌う。腐女子が「地雷」カップリングについて声高に罵ったり存在を否定する発言をする場面は決して珍しくない。一方で腐女子は、自分の好むカップリングをけなされたり否定されたりすることにも強いダメージを受けるため、これはしばしば感情的対立へと発展する。同じキャラクターを題材にしながら発想が全く異なる逆カップリング同士の対立感情は最も激しい。
また、腐女子はカップリングを単位とするグループ帰属意識が強いため、あるカップリングに対する嫌悪感は、必ずそのカップリング活動者全体への敵意となる。また、ジャンル内でのカップリング活動者同士の縄張り意識も激しいため、多数派に対する嫉み、少数派に対する蔑視、毛色の違う集団への排他意識などがカップリング活動者間の敵意となる場合も極めて多い。
このようにしてカップリング活動者間の敵意が高まった場合、嫌がらせ・サイトの潰し合いといった暴力抗争に発展することも少なくない。そのため、カップリングを限定した同人誌即売会の場合、抗争中のカップリング同士のスペースを引き離すなどの措置がとられることもある。
ある意味、世紀末漫画並の荒れ方です。しかしこれは煽りすぎです。真に受ける方がいたら困るので補足しておきますが、抗争の激しさはジャンルによります。それ以前にカップリングの許容範囲も個人差があります。まぁ、交流絶って自サイトに引きこもっていれば、大抵は平和にやっていけます。それでも変な噂を流されたり、中傷メールがきたりするかもしれませんが、これはカップリング問題に限らずサイトを開いたら起こる可能性があるので無視するしかありません。
カップリングは宗教戦争に例えられ、分かりあえない存在だあーだこーだ言われるわけですが。嫌なものは見ない、見た場合も無視（それができないほど心に余裕がない時はネットしない）、を徹底すれば抗争は起きませんが、嫌なもんは嫌なんじゃい！という方は視覚的に情報を遮断すればいいのです。それを実現してくれるのが、Opera/Firefox用のユーザーJavaScript「WebAborn」。これは好き嫌いの激しいカップリングオタクのために作られたものと言っても過言ではないでしょう（嘘）。
Opera/Firefoxともに現時点の最新版で動作することを確認しています。上記サイトで画像つき解説があるのでここでは説明しません。NGワードに指定した語句は「あぼ～ん」に置き換えられます。この言葉が嫌な方は19行めあたり
//const abornString = 'u3042u307Cu30FCu3093'; //あぼーん
const abornString = 'u3042u307cuff5eu3093'; //あぼ～んを
//const abornString = '【閲覧者削除】'; //あぼーん
const abornString = '【閲覧者削除】'; //あぼ～んなど、置換語句を書き換えてください。この場合、NGワードは「【閲覧者削除】」に置き換えられます。シングルクォーテーションの中を空白にすると、NGワードが存在したという形跡が一切なくなります。つまり最初からそんな言葉は存在していなかったということです（違）。一つ注意点ですが、ファイルはUTF-8（BOMなし）で保存してください。私は大丈夫でしたが、環境によっては文字化けするかもしれません。
あとは苦手な傾向のサイトへは飛ばない他、個人サイトのリンク集は利用しない（説明がついていない、または雑食性管理人は自サイト傾向と違うサイトにリンクを貼っている場合があるなど）を徹底すれば「地雷」を踏む可能性はぐっと減ると思います。多分。
あとNGワードを増やしたい時、また最初から一つずつフォームに単語を打ち込まなければいけないので、データをどこかに保存しておいた方がいいです。私はメモパネルに保存しています。単語が増えたらメモに上書きするのを忘れずに。
作品を見る以前に自動判別しているので、好みのサイトを見逃す可能性があります。見ていない・知らないのはその人にとって存在しないのも同じなので、損をしているという意識はないと思いますが「苦手なものを見る可能性があっても、好みのものを見つけたい！」というチャレンジャーは使用を勧めません。興味のないものを見るストレス＞好みのものを見つける喜びな方だけ使いましょう。
特定の属性に凄まじい嫌悪感を持っている方、それを見るだけで吐き気がする方は積極的に使った方がいいと思います。というかお願いですから使ってください。リバの存在に吐き気がする、逆カプは絶対ありえん、あのCP好きな奴は原作理解してない、など書かれるといたたまれなくなります（ちなみに私は逆CPに抵抗がないリバーシブル好き）。
最後になりましたがタイトルの腐女子は「女性向け男性同性愛創作を好む人」ではなく、「カップリングなどの好き嫌いが激しい人」の意味で使っています。本当は「同人カップリングオタクがOpera/Firefoxを使うべき一つの理由」というタイトルをつけたかったのですが、長くなったので腐女子という言葉に代えました。
以前「jQueryを使ってcite属性とtitle属性を表示する」という記事を書いたのですが、削除したのでその改訂版。
$(document).ready(function()
{
$('blockquote[@cite^="http://"]').each(function()
{
var $title = $(this).attr('title');
var $cite = $(this).attr('cite');
$(this).after("<p class=\"source\"><cite><a href=\"" + $cite +"\">" + $title + "</a></cite></p>");
});
});これを実行すると、
<blockquote cite="引用元URI" title="引用元タイトル">
<p>引用した文章。</p>
</blockquote>が、
<blockquote cite="引用元URI" title="引用元タイトル">
<p>引用した文章。</p>
</blockquote>
<p class="source"><cite><a href="引用元URI">引用元タイトル</a></cite></p>というように表示されるようになります。cite属性にhttp://を含む場合のみリンクを生成します。ISBNを記述した場合はcite属性もtitle属性も表示されませんが、引用元リンクを生成するのが目的なのでいいかなと。あと、当然ながらJavaScriptが無効になっている場合も表示されません。
これはjQueryでcite属性とtitle属性を表示するスクリプト（der Gegenwart）の改変版です。
CSS着せ替えテンプレートプロジェクトver.2を考える（2008年5月31日）でページの先頭に戻るリンクの存在が謎と書いたのですが、web拍手でテキストの多い縦長のページや、サーチサイト（よくある趣味の、○○サーチ、のような。検索結果が50件等になるとページが伸びますので）などで、上部のMENUに戻りたい際など、重宝しています。
というメッセージをいただきました。別の方から富士通ウェブ・アクセシビリティ指針22のことも教えていただきました。ありがとうございます。
私はページ内リンクや「ページの先頭へ戻る」リンクをあまり利用しないのですが、一般的に利用されているものだったのですね。それならよかったです。あと前にも書いたのですが、文末には「前のページへ戻る」リンクもあればいいなと思いました。一度ページの先頭に戻るリンクをクリックして、先頭で前のページに戻るリンクを探すのが面倒なので。
CDPと言えば今CSS着せ替えテンプレートプロジェクトを見たら、の配布サイトが20を超えていました。めでたいです。旧リンク集は30サイト以上あったと記憶していますが、移転後なかなか登録サイトが増えなくて寂しかったのです。これからもどんどん増えるといいな。
公式サイトレイアウトも少し変わっていますが、デザインはもちろんフォントサイズ指定なしというのが素晴らしいです。デザイン的には「ニカラム擬似フレーム（IE6↑）」も好きです。配布しないのかなーもったいない…と思いながら見ています。
擬似フレーム自体好きなので数はあるのですが、一昨日アップした1カラム以外は全て左メニュー2カラムで似たようなデザインばかりなのが悩みです。IE6を考慮しなければ右メニューもできるのですが、まだ訪問者の半数はIE6なので実行できず。でもモダンブラウザ全てで同じように表示される必要はないと思うようになったので、これからはIE6以外のモダンブラウザを対象とした擬似フレームも作ろうと思います。IE6でも表示が崩れなければいいかな、と。
宣伝その1。自称最速最美ブラウザOpera 9.5はもちろんリリース当日にダウンロードしました。うっかり上書きインストールしてしまいましたが一応動いています。新スキンがいい感じです。心なしか読み込みが速くなったような気がします。一部ページ（自サイト含む）の表示が微妙に崩れていたり、user.jsが使えなくなったり、キーボードショートカットやメニューまわりの設定が混沌としていますが、そのうち慣れるでしょう。他にも色々と不安定なところがあるので心配性な方は様子見した方がいいです。何にせよ、社員の方々はお疲れさまです。10に期待しています（気が早い）。
宣伝その2。フォクすけバナーがあったので貼りつけておきます。私も参加の申し込みをしました。仮にIEの自動アップデートのアクセス数を報告したら終了しそうな企画ですが応援しています。速い速いと言われるFx3がどう進化したのか楽しみです。
5月10〜6月10日に実施していたアンケートの結果です。60名にご協力いただきました。おかげさまで自分にない視点をたくさん得ることができました。サイトの運営の参考にさせていただきます。ありがとうございます。
| ある | ない |
|---|---|
| 67％ | 33％ |
他テンプレートサイトを見ていると3〜4割は「使っていない」と回答されるこの質問、自サイトではどうなのかという好奇心から作りました。結果は他サイト並でした。明確な使用目的がないとテンプレート配布サイトに行かないと思っていたのですが、見ているだけの方も多いのですね。機会があれば是非使ってください（宣伝）。
| 1カラム固定幅 | 1カラム可変幅 | 1カラム擬似フレーム | 2カラム固定幅 | 2カラム可変幅 | 2カラム擬似フレーム | その他 |
|---|---|---|---|---|---|---|
| 15％ | 29％ | 10％ | 9％ | 14％ | 20％ | 3％ |
max-widthを使っているものもありますが基本的にうちのテンプレートは可変幅なので、利用者さんも可変幅が好きな方が多いのではないかと思っています。ちなみに現時点で多いのは1カラム可変幅と2カラム擬似フレームのもの。
項目を作っておきながら1カラム擬似フレームはまだないので、そのうち作りたいです。右側にメニューがある2カラムももっと増やしたいです。少し要望のあった3カラムや横スクロールは多分作らないと思います。テンプレートの文章構造的に難しそうなので。
| CSS着せ替えテンプレートプロジェクト | ブログ | web拍手 | オリジナル |
|---|---|---|---|
| 45％ | 11％ | 19％ | 25％ |
CDPが断トツですね。実際メインで作っているのもCDPですし、今後もそうなると思います。現在ブログ用テンプレートはSerene Bachしかありませんが、Web Diary Professionalも作りたいです。勉強しなければいけないので時間はかかると思いますが、いつか。Serene Bachのテンプレートは3正式版が出るまで更新休止です。
オリジナルも需要があって嬉しいです。web拍手は今後も3種類（Kash+・PatiPati・Web Clap）作ります。
というわけで今後もCDPメインで他もボチボチ、と今までと変わらない感じでまったりテンプレートが増えていくと思います。
| ある | ない |
|---|---|
| 54％ | 46％ |
せっかくCDPの基礎HTMLはValidなのに利用者が崩して使っているのを結構見るので気になっていました。blockquoteでインデントとか、改行と中黒でリストとか…。
半数が興味あるという結果がいいのか悪いのか分かりませんが、興味のある方には頑張っていただきたいです。「使えるんだったら文法なんてどーでもいいよ！」という興味ない派の方にも頑張っていただきたいですが、こればかりは本人のやる気がないとどうにもなりませんので。利用者のマークアップ以前に配布サイトのテンプレート自体がおかしかったりすると、どうしようもないですし。
メッセージをくださった方々にこの場を借りてお礼申し上げます。しかし言葉はなくともアンケートに答えてくださったこと自体が意思表示です。ご協力くださった皆様に心からの感謝を。
どんなメッセージをいただいたのか一部紹介させていただきます。
アンケートは終了しましたが、ご意見は常に拍手・メールフォームから受けつけているので、何かあればお気軽にどうぞ。
異常な動作を繰り返していたので、Operaを一度削除して再度入れなおしました。
画面がごちゃごちゃしていますが昔からこうやって使っていたのでよしとします。
右クリックメニューはこんな感じ。長すぎですね。このスクリーンショットを見てキーボードショートカットの設定が無茶苦茶なことに気づきました。
メニューそのものは2008/05/09/Opera：Shishimushiから色々いただいてきました。ブラウザのアイコンがかわいくてお気に入りです。IE7のアイコンを表示させつつ、自PCはIE6しか入っていないのがアレですが。何にせよアイコンがある方が華やかでいいです。ちなみに「文書の検証」の中身はAHLとW3Cのhtml/CSS/リンクチェッカーです。
それにしてもOperaは初期状態がダメダメです、超不親切。設定ファイルをいじるのも面倒です。「SafariはWindowsでやっていく気があるのか」と昨日書きましたが、OperaにしてもFirefoxにしてもブラウザを使いこなすために学ばなければいけないことが多すぎです。こんな不親切設計でIEユーザーを獲得できるわけがないだろー、と文句をつけながらOperaの設定作業に戻ります。
target="_blank"を新規ウィンドウで開くのをやめてください。何のためのタブなのか分かりません。と愚痴から始まるSafari話です。
「WindowsでMacな気分を味わえるなんて！ スクリーンショットを撮る用のブラウザゲット！」と思ったのが、Safariをインストールするきっかけでした。頭が悪そうな理由です。実際表示はきれいなのですが、あの文字を長時間見ていると視力が落ちそうです。液晶ディスプレイとの相性があるので、どのPCでも表示が美しいとは限らないらしいです。なのできれいなアンチエイリアスにならなかった場合は諦めましょう。編集→設定→表示のフォントスムージングで多少の調整はできますが、私の環境で長時間見るのはきついです。
テンプレート配布サイトをやっているので複数のブラウザで表示確認をしていますが、主に使うのはOpera、サブでFirefox、IEとSafariは確認用です。デフォルトIEが使い物にならないのは周知の事実ですが、Safariもなかなか扱いづらいブラウザだと感じています（元々Mac用ブラウザなので、ネイティブWindowsユーザーの私にはUIに慣れません）。Firefoxのように拡張できるわけでもなく、Operaのように内部をいじって好みにカスタマイズできるわけでもなく…。いや、Safariも全く拡張できないわけではないのですが、FirefoxやOperaほどの広がりを感じなかったので。Mac版の拡張機能をWindows版でも使えたらいいのにな。あとシェアウェアが多いのもマイナスポイント。
あと、Windows版Safariが発表されてから文字化けバグ、ブックマークバグ、日本語使えないバグ、メニューおかしいバグなど色々なバグが出ましたが、今回のは以前のものより重大なようなので、ここでも紹介しておきます。
Windows版Safariは確認画面なしでファイルをダウンロードします。悪質サイトで自動的にファイルが保存されたら危険ですね。しかしAppleはこれをセキュリティ問題として扱わない方針なので、MSが警告を出しましたという話です。AppleかMSから更新プログラムが提供されるまでの間はSafari使うな、だそうです。ちなみにMac版は大丈夫です。
CSS実装がマトモなブラウザが普及するのはいいことなので基本的にSafariを応援していますが、Windowsでやっていく気あるのかと聞きたくなる対応の数々に疑問符が浮かびます。ITニュース系サイトでやたらSafariが持ち上げられていたのも謎です。少なくとも現時点では、セキュリティ的にも機能的にも勧められるレベルではないと思うのですが。かと言ってOperaも他人に勧めにくいブラウザなので、結局消去法でFirefoxを推してしまうという。
でも、付属RSSリーダー、UA偽装、テキストエリアリサイズ、ページ検索のハイライトなど好きなところもあります。でもハイライトはFirefoxのXUL/Migemoの方が便利かな。あと、忘れてはいけないポルノモードプライベートブラウズ。ずっとポルノモードだったらよかったのに。
CSS着せ替えテンプレートプロジェクト二代目管理人の希さん（alevirita）のブログでCDPver.2ネタを拝見しました。
本当にCDPver.2が出るのかネタなのか分かりませんが、CDP2というカテゴリーがあるので出るのでしょうか。前者であれば公式サイトで発表があるでしょうから待て次号です。私も基礎htmlを見ながら改善点を考えてみました。ぱっと思いついたのは以下です。
title要素は「ページタイトル < サイト名」にするtitle要素をパンくずリスト的な使い方をしているサイトを見かけます。閲覧している時はいいのですが、ブックマークに登録した時に不便です（ページタイトルが表示されないことがあるため）。なので、パンくずリスト使い方をしたい場合は逆パンくず（ページタイトル < コンテンツ名 < サイト名）にするといいと思います。class="modori"に前のページに戻るリンクを追加重箱の隅つつき的要望の数々。ver.2どころか、ver.1.1という感じで元と殆ど変わりません。他には「h1をページタイトルにする」、「div要素を減らす」、「パンくずリスト不要？」、「サブメニューの是非」など思うことはあるのですが、上記が改善されれば概ね満足です。
h1はページタイトルの方が好みですがそうすると字数が不定になるのでデザインがしにくくなる、div要素を減らせば文書構造がすっきりしますがデザインがしにくくなる、サブメニューは局地的需要がありそうですがデザインが（略）。デザインが内容を制約する典型的パターンですが、配布テンプレートなのでその辺の妥協は仕方ないと思っています。利用者のレベルもまちまちですし、複雑化すると作り手としても対応が面倒なので。
わたしたちはweb制作になれていないユーザーが、できるだけ使いやすいように、シンプルな構造のテンプレートを目指しました。複雑なものや初心者では理解しがたいと思われるものは出来るだけ削り、本当に必要なものだけを残しました。しかし同時にCSS制作者が意図したデザインを作り出しやすいように、いくつかの、文法的には邪魔とも言える記述がなされています。
CDPは利用者に分かりやすく、CSS作成者にもデザインしやすい妥協点のバランスが好きです。「CDPがなかったらテンプレート配布サイトは作っていませんでした!!」と感嘆符をつけて断言できるくらい。好みの関係で気になるマークアップもありますが、基礎HTMLはValidなので特に文句はありません。
意見要望あればメールで。
とのことですので、意見要望があれば希さんへどうぞ。ネタにしておいて何ですが、私は現状維持派です。
最近、h1タグをサイト名にするか否かというのをよく聞きますが、坂取さんはどうお考えですか？
というメッセージをいただきました。そう言えば去年そんな話題があったなーと見出し要素に関する議論（徒委記）を読んでいました。全ての記事に目を通していませんが、このサイトの方向性は、
heading要素は1から順番に用いるh1要素はbody要素の直下に1つだけ配置するtitle要素とh1要素にページタイトル必須です。h1要素はページタイトルだけですが、title要素は「ページタイトル｜AZ store」というふうにサイト名も入っています。例により自分ルールなので他所では通用しません。
「h1（他の数値からから始まる場合はそれが）は最も重要な見出し」、「最も重要な見出しにすべき内容に関しての記述なし」、「h1は複数回出現OK」、「h1から使う必要はない」、「順番を飛ばしてもOK」、「そもそもheadingは必須でない」など、どの仕様書においてもheading要素に関する記述は曖昧です。勘違いがあるかもしれませんが、大体こんな感じだったと記憶しています。
現時点で見出しに関して厳しい制限があるのはISO-HTMLだけです（「必ずh1から順番に使う」、「heading要素は本文中において親要素を持つことができない」など）。そのISO-HTMLでもheading要素は必須ではないので、title要素にタイトルがあれば、h1要素の内容は自由だと考えます。
というわけで、サイト名が最も重要だと思う人はサイト名をh1タグで括ればいいし、タイトルが最も大切だと思う人はタイトルをh1タグで括ればいいと思います。ただ、title要素は必須なので、そこにはきちんとタイトルを書きましょう。h1要素≠ページタイトルですが、title要素＝ページタイトルです、多分。【完】
しかし仕様に依らない批判は単なる言いがかりと分かっていても、全ページh1要素がサイト名のサイトに違和感があるのも事実です。マークアップにも好みがあるので。
理由は自分のサイト名とURIにあります。このサイトの名前はAZ storeで、URIはhttp://az-store.nrym.org/です。この時点でタイトルバーとアドレスバーにサイト名が表示されています。これに加えて見出しまでサイト名だと、サイト名出すぎ！と思ってしまうわけで…。URIはサイト名が表示されたことにならないでしょうが、管理人である私が気になるので見出しにサイト名を使いません。
ブラウザのデフォルトスタイルシートを適応させると、h4以下の文字の大きさが本文のと同じか、それより小さくなってしまうのは何故？という疑問が昔からありました。先ほど改めてIE/Fx/Opera/Safariの最新版で確認しましたが、h4以下は本文の文字と同じかそれより小さかったです。いくらなんでもh6はミニマムすぎです。見出は本文より大きい方がいいと思います。デフォルトスタイルシートの改善して欲しい点の一つです。と言いつつも、h4は滅多に使わないのですが。あとh6という数字の中途半端さが謎です。
クールなURIは変わらないというか、変わらないURIだからクールと言うか。
1年に2度も移転した私は非モテ確定です。しかし、死ぬまで何らかのサイトを運営し続けたいので恒久的なURIには興味があります。独自ドメインを取ったし、このサーバでは.htaccessも使えるのでクールなURIとやらを実現するためにある作業をしました。
.htaccessファイルに、
Options +MultiViewsを追加しただけ。これで拡張子を省略してもアクセスできます。別に拡張子がなくなったから何が起こるわけでもなく、拡張子があろうがなかろうがそのURIにリソースがありさえすればそれでいいと思うのですが、一応。
URIの設計は、ブログの場合http://example.com/2008/05/24のような年月別風ディレクトリ構成が好きです。理由はディレクトリを削っていくと年別・月別アーカイブになるから。というわけなので、このブログではhttp://example.com/年/月/日/記事番号になっています。記事番号より件名の方がいいのでしょうか。英語圏のサイトでは日付に加え件名を含んだURIが多いのですが（例えばhttp://example.com/2008/05/24/this-is-a-penみたいな）、これは冗長で好きでなかったりします。this-is-a-pen程度ならいいのですが、たまにアドレス欄で作文するな！というくらい長いURIがあったりするので。
まぁどんなURIでもそのURIとリソースが存在し続ければ、あとはどうでもいいです。
余談ですが、昔は拡張子なしURIが不気味に見えたのですが、http://example.com/index.htmlをhttp://example.com/と表記しているようなものと思えば気にならなくなりました。省略できるものは省略した方がスマートです。
というか、http://example.com/index.htmlは初心者臭く見えるうえ、一つのページにURIが2つ存在している点が気持ち悪いです。
webデザイン系の本などを見ていると、CSSは
html,body {
margin: 0;
padding: 0;
}というふうに書かれていることが多いのですが、
html,
body
{
margin: 0;
padding: 0;
}の方が分かりやすいのではないかという話。理由は後述します。ちなみに後者の書式を「CSS版ホワイトスミスのスタイル」といいます。私が勝手に名づけたので、おそらく他の方には通じません。「ホワイトスミス」をgoogleで検索してもネットゲーム関係（？）の記事ばかり引っかかるあたりアレな感じです。
以上、守らないことが多い自分ルール。
宣言ブロックを字下げすることにより集合規則の範囲が把握しやすく、セレクタや宣言ブロックも目視しやすく、コピー＆ペースト及び削除する時も楽でいいことだらけだー！ …と自分では思っています。他の方がどう思うかは知りません。
ちなみに全称セレクタでリセットしないのはフォーム、リスト、入れ子したタグのスタイル再指定が面倒だからです。IE6でも子供セレクタが使えればよかったのですが。
欠点は行数が多くなること、入れ子すると奇抜度が上がること、特殊な書き方なので分業する場合はかなりやりにくいこと（この書き方をしている人が殆どいないので）。プログラムを組むならともかく、CSSを書く時は何重も入れ子しないと思うので気にするほどでもないと思います。しかしテンプレートを配布しているので、利用者のことを考えないといけないですね。配布CSSでは使わない方がいいのでしょうか。謎。
元ネタはマークアップの指針（メモランダム）。2008年5月15日現在はこんな感じです。
application/xhtml+xmlとして、未対応のUAにはtext/htmlとして配信する。head要素内にはlink要素によるナビゲーションを配置する。heading要素はh1要素から順番に使用する。なお、h1要素は文書の先頭に一つだけ配置する。heading要素で暗示するにとどめる。summary属性は記述する。thead要素、tfoot要素、tbody要素によるグループ化を行う。li要素、ol要素、dd要素内にブロックレベル要素、インライン要素、テキストが混在してもよい。cite属性にURIかISBNを記述する。title属性には引用元のタイトルを記す。cite要素による出典の暗示や、a要素でのハイパーリンクは必要ない。pre要素とcode要素によってマークアップする。code要素によってマークアップする。a要素によるハイパーリンクはアンカーテキストがリンク先リソースのタイトルと同一であることが望ましい。しかし、異なる場合はtitle属性でそのタイトルを示す。abbr要素による略語の明示は同一文書内の同一単語について初出の1回限りとする。略語であることが明らかな場合はabbr要素としてマークアップしなくてもよい。em要素は用いない。通常の強調にはstrong要素を用い、より強調したい場合は入れ子する。img要素にwidth属性とheight属性の記述は必要ない。アクセシビリティはあまり考慮していない。そして曖昧な点が多い（特にclass/id関係）。守れていない規則も多いというオチつきです。
h1要素は1ページに1つ、通常の強調にem要素を使わないなどは自分ルールであり、仕様に依るものではありません。引用元リンクは必要ないと書きつつも、JavaScriptでcite属性のリンクを生成したり、前後の文章にリンクを併記したりと色々媚びて（？）います。媚びというか妥協というか配慮というか。
他サイトさんが書かれた有益な記事をアップロードしました。今後も地味に増えていくかもしれません。ちなみに転載の許可がされている閉鎖（？）サイトからのみ転載しています。もし相手方が復帰したら下げる予定です。
「脱初心者をめざす人のためのホームページ作成講座」の方はファイル数が多いのでそのまま上げました。link要素など、ところどころリンク切れを起こしています。少しずつ修正していくつもりです。
サイト情報のところに開設日を書いていたおかげか、2日くらい前から意識することができました。忘れなくてよかったです。
これからもまったり運営していく予定なので、趣味の合う方はおつき合いください。あとアンケートも実施しているのでご協力いただければ幸いです。
終了しました。ご協力ありがとうございました。
web拍手ツールはたくさんありますが、現在私が使用しているのはKash+です。お礼ページも解析ページも出力はすべてスキン側で制御。CGI側では余計な（使用者が意図しない）ソースを一切出力しない。
というところがお気に入りです。本体をいじらず出力ソースの制御ができるスクリプトは貴重です。UTF-8対応、月別レポート機能、正規表現使用可など多機能なところも素敵です。かゆいところに手が届きます。
必要環境が他のweb拍手ツールより厳しいという難点もありますが…。あと、きれいなソースを出力できるのに、スクリプト本体の「共通ソース機能」、「ランダムソース機能」部分のマークアップが残念な点。なぜそんな書き方を…！という。ただ、これは利用者が簡単に書き換えできるので気にする部分ではないのかもしれませんが。
前置きが長くなりましたが、Kash+のスキンを作りました（CLAP（1））。今後の発展と利用者の増加を願っています。
とりあえず3種類作りました。ソースの書き換えが楽だったので、「PatiPati」対応版も配布することにしました。Web Clapも作るかもしれません。
Web Clap対応版も作成しました。
前回改装したのは1月3日だったので4ヵ月ぶりのデザイン変更です。IE6では使えないCSSプルダウンメニューがポイント。あと、アイコン（3つ）以外の画像は使っていないので、精神的エコロジーです。「ブログ風で画像を使わないデザインにしたい。CDP（15）みたいな感じにしよう」と考えていたので、色が同じです。
IE6以外でも表示がおかしいところがあるのと、JavaScriptのエラーも出ているのでちまちま修正していく予定です。コンテンツ表記とclass/id命名も考え直します。
CSS着せ替えテンプレートに対応したHTMLを出力するブログツール「Pinky:blog」正式版の配布が始まりました。CSS着せ替えテンプレートプロジェクト公式サイトからもリンクされているサイトなのですが、知らない方もいらっしゃるかもしれないのでここからもリンクを貼って応援します。
Pinky:blogという名前ですが日記スクリプトのような印象を受けました、というのが使用感です。日記CGIほど単純でなくブログほど煩雑でない感じ。使わないシステムや設定に場所を取られて画面がごちゃごちゃすることがあったのですが（私はWordPress利用者です）、このブログは「タイトル、本文、タグ、投稿！」というシンプルな投稿画面で好感を持ちました。投稿画面や設定画面が見やすいのは正義です。
そしてCSS着せ替えテンプレートに対応しているというのが最大の特徴でしょう。「サイトとブログのデザインを統一したい」、「日記スクリプト的なブログを使いたい」という方におすすめです。設置も簡単なのでrubyが使えるサーバをご利用の方はこの機会に是非。
ただ、メニュー幅や数が固定されているデザインは表示が崩れるかもしれないので、その辺りはCSSを修正したり、メニューの名前を短縮するなりの工夫が必要かもしれません。自作テンプレートで試しましたが、1カラムだと崩れるものがあったので。
ここから普通の日記なのですが、2008年4月29日現在Pinky:blog公式サイトのデザインがCDP（2）なのが制作者として嬉しかったです。あとCDP（print）も使ってくださっている様子。需要あるのかな？と思っていたので、利用してくださる方がいるのを見て安心しました。よかったよかった。