2006-01 アーカイブ

http://hxxk.jp/2006/01/

フォーカスした際に、フォームの内容をクリアするやり方

記事データ

投稿者

望月真琴

投稿日時

2006-01-31T21:12+09:00

タグ
概要

フォームのある項目がフォーカスされた際に、その内容を JavaScript でクリアするやり方を紹介。と言ってもソース自体は LIPPiN ( http://acromo.org/lippin/ ) のものをそのまま使わせてもらいましたが。

リプライ

5 件のリプライがあります。

記事本文

フォーム周りのインターフェースをプチ改造しました

現在、 hxxk.jp では検索フォームコメント投稿フォームトラックバック送信フォームトップページのゲストブック投稿フォームなど、多くのフォームをページ内に配置しています。 今日ふと思い立って、それらの文面を入力する部分がフォーカスされた場合に、予め書かれていた文章をクリアするように変更しました。 いただいたコメントにお返事を返す際に、 コメント本文は必須となっています。 という文章を手動で消すのがどうにも煩わしい、でも最初からテキストエリア内を空白にしたくはないということで、毎回手動で消していましたが、今回の変更で解決。

ちなみに、 JavaScript を用いて実現していますので、 JavaScript を無効にしている、あるいは無効になる環境ではフォーカスしてもクリアされません。 ソース自体は LIPPiN のコメントフォーム周りを無断で参考にさせていただきました。 というか身近な ( と私は勝手に思っている ) サイトで実践されていたのに、それに気付いていなかったということが不覚すぎます。

input 要素でのクリアのやり方

まず、 type="text" である input 要素でのやり方。 ( ちなみに、 type 属性を指定しない場合の規定値は text であるので、お使いのフォームの input 要素内に type 属性が見当たらない場合もこれに該当します。 ) 名前やメールアドレスを入力する欄など、一行の入力欄に用いるやり方です。

<input type="text" onfocus="if (this.value == '初期入力値') this.value = '';" onblur="if (this.value == '') this.value = '初期入力値';" value="初期入力値" />

input 要素をこのように記述することで、フォーカス時にクリアされるようになります。 気を付けなければいけないのは、 初期入力値 をきちんと統一する点です。

textarea 要素でのクリアのやり方

次に、 textarea 要素でのやり方。 コメントの本文など、複数行に渡る入力欄に用いるやり方です。

<textarea rows="表示行数を示す数字" cols="表示幅を示す数字" onfocus="if (this.value == '初期入力値') this.value = '';" onblur="if (this.value == '') this.value = '初期入力値';">初期入力値</textarea>

textarea 要素をこのように記述することで、フォーカス時にクリアされるようになります。 気を付けなければいけないのは、 初期入力値 をきちんと統一する点に加え、必須属性である rows 属性と cols 属性を忘れずに指定するという点です。

謝辞

参考に……というかほとんどコピー & ペーストさせていただきました。> lego さん ( LIPPiN ) このお礼はいずれ何らかの形で。 と言ってもどういった形で行うか全く考えていませんが !

もしくはうーたん ( Bazooka ) に代わりに奉仕してもらうとか。 ( いやこの場合うーたん関係ないし ( それと起こしてくれてありがとね ! >うーたん ( 微妙に意味深 ( 実態は何てことはないことです ) ) ) )

リプライ

5 件のリプライが送られています。 この記事に対するご意見やご質問、ご感想などありましたら個別記事ページの送信フォームからお送り下さい。

2006-02-01T09:45+09:00 - うーたん

深夜までmugiの時はPCの前で寝てる可能性高し…! 僕もコメント消えるようにしよっと。

2006-02-08T00:06+09:00 - 真琴

その節はお世話になりました……って、こうしている今日も mugi なわけですが ( 謎 )

2006-04-14T22:13+09:00 - フォーカスした際にフォームの内容をクリアする JavaScript < Code-404

フォームの入力項目にフォーカスした際に、その項目がデフォルトのままなら消去し、フォーカスが外れた際に、その項目が空欄ならデフォルト値に戻す働きをする Ja...

2006-07-13T23:16+09:00 - フォーカスでフォーム内容をクリア < DesignSpeciesElement

JavaScriptで制御する方法がこちらのサイトで紹介されています。 →フォー...

2009-01-21T18:48+09:00 - フォームの初期文章を自動的にクリアするようにしてみた。 < 煤式自動連結器

当サイトをAnother HTML-lintでチェックすると、 <INPUT type="text"> や <TEXTAREA> ...

はてなブックマークの CSRF 脆弱性とその対策への流れ

記事データ

投稿者

望月真琴

投稿日時

2006-01-31T00:31+09:00

タグ
概要

はてなブックマークに CSRF 脆弱性が存在し、実際にそこを突かれた攻撃がなされた件と、 web システム側による対応を待つだけで良いのかという件について。

リプライ

リプライはまだありません。

記事本文

はてなブックマークの CSRF 脆弱性 ( 対策済 )

はてなブックマーク日記 - お気に入りに追加ボタンのCSRF脆弱性修正についてという記事を見かけていたんですが、どういった脆弱性が存在していたのかなーと思っていたら、先ほど追記したはてなのプロフィール画像によって表示は遅くなるのかという検証と、プロフィール画像を非表示にするいくつかの方法で触れた plotless: はてブのユーザアイコンでSafariが激重に!? 繋がりで [はてな] 削除されたプロフ画像 :: ぼくはまちちゃん!、そして被お気に入り数を増やす / はてなの誰が見にきたかを知る :: ぼくはまちちゃん!に辿り着きました。

これは CSRF 脆弱性を突いて、本人が意識することなくはてなブックマークのお気に入りに登録させるものでしたが、逆に Retasuの日記 - お気に入り戦争のように、そのお気に入り登録を解除する CSRF 攻撃も出現していました。 そういった流れを受けて、はてなブックマーク日記 - お気に入りに追加ボタンのCSRF脆弱性修正についてという対策に至ったようです。

CSRF って何っていう方は、 Movable Type における CSRF の可能性と各種対処法や、その他キーワード "CSRF" が設定された記事をご覧ください。 それぞれの記事の中に、外部の参考リソースへのリンクも書いてあります。 最近では、まこと先輩と星野君とCSRFの微妙な関係 - @IT という記事もあります。 関係ないけど、その記事の前回分である Webアプリ、入力チェックで万事OK? - @IT のトナカイ星野君が可愛いです。 ちなみにイラストを担当したのは交差点の真中での harupu さん。 ~JavaScriptでXMLHttpRequest~という Ajax の解説ページがためになります。

ある程度自衛できる場合と自衛できない場合

CSRF 攻撃というのは、仮に web システム側に脆弱性があっても、ユーザ側で防御策を取ることで防ぐことができる場合もあります。 例えば、 Movable Type ( 記事を投稿する時など以外はログアウトする、記事を投稿するブラウザと通常の web ブラウジング用のブラウザを使い分けるなど ) やはてなダイアリー ( 日記を書く時や他人のダイアリーにコメントを書く時以外はログアウトする、日記を書いたりコメントを書いたりするブラウザと通常の web ブラウジング用のブラウザを使い分けるなど ) がそれにあたります。

しかし、はてなブックマークのように、ログインしている状態で web ブラウジングすることを前提として作られているシステムは、こうした自衛策は使い辛いものです。 ( ブックマークレットを用いて手軽にブックマークを追加できるというのが売りのため、こまめにログアウトしたり、ブラウザを使い分けるというのは不便でなりません。 ) BloglinesFEEDBRINGER などもログインして web ブラウジングする前提になっていますので、はてなブックマークだけの話ではありませんが。

となるとシステム提供側による確実かつ素早い対応が求められるわけですが、ユーザ側も「常にログイン状態で web を歩いている」ということを気にかけておくようにしてください。 自衛し辛いと言っておいて何ですが。

リプライ

リプライはまだ送られていないか、管理者の承認待ち状態です。 この記事に対するご意見やご質問、ご感想などありましたら個別記事ページの送信フォームからお送り下さい。

はてなのプロフィール画像によって表示は遅くなるのかという検証と、プロフィール画像を非表示にするいくつかの方法

記事データ

投稿者

望月真琴

投稿日時

2006-01-28T15:48+09:00

タグ
概要

はてなのプロフィール画像機能の追加によって、はてなブックマークのエントリページの表示は遅くなるのか ? 遅くなるのは嫌、あるいは単純に見辛いという人のために画像を非表示にする方法も合わせてご紹介。

リプライ

2 件のリプライがあります。

記事本文

はてなのプロフィール画像を非表示にしたい

昨日、はてなの機能追加に伴って Greasemonkey スクリプトを修正したのですが、その時はその追加された機能自体については良くもなく悪くもない印象しか抱きませんでした。 ああ、何だか賑やかになったなあ、程度の。

しかし 1 日経って他の人の反応を見てみると、少なからず鬱陶しく思ったり、非表示にしたいと思ったりする人がいることが分かりました。 ( 内部処理的にはどうか知らないけど ) 見た目的に大きな機能追加であり、この機能が撤廃されることは無いでしょう。 かと言って、アイコンを表示したバージョンと表示しないバージョンの両方を準備するのはコスト的にも難しいと思います。 そうなると、同一のページ内で何らかの処理を行う形になりますが、そういった形であればユーザ側で対処できる場合が多々あります。 今回はそういった例を考えてみましょう。

なお、この記事中では主にはてなブックマークのエントリページを想定して書いていますので、それ以外のページや、あるいは今後のプロフィール画像の仕様変更によっては使えない可能性も充分にありえます。 それと、今回はブラウザは Firefox 1.5 を使っているという前提で話を進めます。 それ以外のブラウザまで含めると話が細分化しすぎますので。

また、非表示にしたいと一口に言っても、表示結果が煩雑になって鬱陶しいので非表示にしたいのか、表示が遅くなるから非表示にしたいのかで対処方法が変わってきますので、それぞれについて考えます。

  1. プロフィール画像によって本当に表示が遅くなるのか ? ( 理論編 )
  2. プロフィール画像によって本当に表示が遅くなるのか ? ( 実際のところ )
  3. Firefox の拡張機能 "Adblock Plus" で非表示にする
  4. ユーザ CSS で非表示にする
  5. Greasemonkey スクリプトで非表示にする
  6. まとめ
  7. 関連リンク集

プロフィール画像によって本当に表示が遅くなるのか ? ( 理論編 )

既にこの辺りで表示速度に関することは触れられていますが、理論だけで言ってしまうと以前よりは確実に遅くなります。 アイコン画像のサイズは 1KB 前後のものが多く ( デフォルトアイコンは 166 バイト ) 、仮にパブリックなはてなブックマーカ 100 人がブックマークしていても、エントリページの総サイズとしてはせいぜい 100KB 程度プラスになるだけ、 ADSL 1.5M 以上の通信環境であればさほど気にならない違いかもしれません。

しかし、パブリックなはてなブックマーカ 100 人がブックマークしているということは、 100 人分のプロフィール画像を表示することになるということで、 100KB の画像 1 枚を表示するのとは少々話が違ってきます。 100 人分のプロフィール画像を表示するということは、単純に 100 回のサーバへのリクエストとサーバからのレスポンスが存在するということです。 LiveHTTPHeaders という Firefox の拡張機能がありますが、これで ( 今この記事を書いている時点でちょうど 100users に近い数である ) はてなブックマーク - はてなダイアリー日記 - プロフィール画像設定機能の追加についてを開いた時の HTTP ヘッダを見てみると、テキストファイルに換算して 105KB というサイズのものが得られました。 「ツール」→「オプション」→「コンテンツ」→「「画像を読み込む」のチェックを外す」という手順でプロフィール画像を読み込まないようにしてもう一度 HTTP ヘッダを取得すると、 10KB というサイズになりました。

----------------------------------------------------------
http://www.hatena.ne.jp/users/pa/partygirl/profile_s.gif

GET /users/pa/partygirl/profile_s.gif HTTP/1.1
Host: www.hatena.ne.jp
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; ja; rv:1.8) Gecko/20051111 Firefox/1.5
Accept: image/png,*/*;q=0.5
Accept-Language: ja,en-us;q=0.7,en;q=0.3
Accept-Encoding: gzip,deflate
Accept-Charset: Shift_JIS,utf-8;q=0.7,*;q=0.7
Keep-Alive: 300
Connection: keep-alive
Referer: http://b.hatena.ne.jp/entry/http://d.hatena.ne.jp/hatenadiary/20060126/1138263309
Cookie: rk=******************************; PORTAL_TAB=quest; name=*******

HTTP/1.x 200 OK
Date: Sat, 28 Jan 2006 05:23:07 GMT
Server: Apache/2.0.40 (Red Hat Linux)
Last-Modified: Fri, 27 Jan 2006 13:58:56 GMT
Etag: "1cc494-3afb-7f800800"
Accept-Ranges: bytes
Content-Length: 15099
Keep-Alive: timeout=7
Connection: Keep-Alive
Content-Type: image/gif

プロフィール画像を読み込む時のリクエストおよびレスポンスの流れは、この例のようなものになっています。 これを 100 回行うために、プロフィール画像がどんなに小さいサイズであれ、全く無かった頃に比べると遅くなるのは不思議なことではありません。

プロフィール画像によって本当に表示が遅くなるのか ? ( 実際のところ )

しかし、実際のところは、多少遅くなっているかもしれませんが、激しく遅くなったと感じるまでには至っていません。 次に挙げるような理由が考えられます。

ブラウザによるキャッシュ機能が働く

はてなのプロフィール画像に限った話ではありませんが、多くのグラフィカルブラウザにはキャッシュ機能があり、以前に読み込んだページの内容や画像をローカルディスク上に保持し、同様のものを表示する際にはそこから表示することで速度を向上しています。

よって、初めて読み込むブックマークページであっても、過去に読み込んだユーザの分のプロフィール画像はキャッシュから表示することになります。 ただし、キャッシュをクリアしていたり、はてなブックマーク自体を初めて見るような場合はこの限りではありません。

サーバによるリバースプロキシ ( 推測 )

これは推測の域を出ませんが、はてなのサーバ側でもプロフィール画像をキャッシュすることで、リクエストの集中が起こらないようになっていると思われます。 また、プロフィール画像自体のパスも http://www.hatena.ne.jp/users/ユーザ ID の頭 2 桁/ユーザ ID/profile_s.gif というように、ユーザ ID で大まかにディレクトリが分けられ、かつそのディレクトリ内でユーザ ID ごとにディレクトリを置き、その中に profile_s.gif を配置していることからも、特定のサーバに負荷が集中しないようになっているのでしょう。

そもそも元が軽快だったので遅く感じる

キャッシュやリバースプロキシの話は、何度もはてなブックマークのページを読み込んでいると表示が遅くなる原因が軽減されるという話であり、それらが有効になっていない、すなわち初見の状態では表示が遅くなるということです。 ( これは前項で述べた通り )

しかしよくよく考えてみると、リンクバナーやアフィリエイトバナーが羅列されているページでは、サイズとしてもリクエスト・レスポンスの頻度としてもはてなブックマークより大きい・多いものが数多く存在しています。

最初にキャッシュするときにブラウザが重くなる人も居るかもしれないが。 それは見たことが無いサイトのバナーを表示するのと同じぐらいの重さだろう。 (だけどブックマークはいままでのスピードを知っている。 だから、今回の改造を体感で比較することができた。 二回目からのアクセスではキャッシュされているからスピードは変わらないだろう)

これは import otsune from Hatena - コスメティック(見た目)の改造は、内部的にたいしたことをしてなくても大げさに見えるんだなぁからの引用ですが、 だけどブックマークはいままでのスピードを知っている という下りに非常に納得がいきました。 また、子供、いらない:はてブのアイコンは問題ないでは実際に速度計測を行った結果が記されています。 これを見る限り、余程多くのブックマーカがブックマークしているページでなければ実サイズとしては気にするレベルではないのかなと思います。

簡単に言うと「今までと全く同じってわけではないけど、様々な機能や対策のおかげで気にするほどは遅くならないはず」という感じでしょうか。 それを踏まえて、次項からはプロフィール画像を非表示にする方法を考えてみましょう。

Firefox の拡張機能 "Adblock Plus" で非表示にする

子供、いらない:はてブのアイコンは問題ないで紹介されている手法です。 単純に「ツール」→「オプション」→「コンテンツ」→「「画像を読み込む」のチェックを外す」という手順で画像を読み込まないようにしても良いのですが、これだとそれ以外のページでも画像を読み込まなくなってしまいます。 そこで、はてなのプロフィール画像は http://www.hatena.ne.jp/users/ユーザ ID の頭 2 桁/ユーザ ID/profile_s.gif というパスに置かれており、画像ファイル名は profile_s.gif に固定されているため、 Adblock という Firefox の拡張機能で profile_s.gif をブロックしてしまおうという考え方です。

なお、使い方は詳述しません。 インストール後に、「ツール」→「 Adblock 」→「 Preferences 」で設定画面を開き、 New Filter の欄に profile_s.gif と入力して Add ボタンを押せば完了です。 この方式では profile_s.gif という名前のファイル自体のリクエストを行わないため、表示速度・見た目の両方に有効な方法です。

私は使ったことがありませんが、 Proxomitron-J といったツールでも同様のことが実現できるかもしれません。

なお、 profile_s.gif というフィルタの場合、もしはてな以外でこのファイル名を用いている画像があった場合に、それもブロックしてしまうことになります。 はてなのプロフィール画像だけを正確にブロックしたい場合はベアハグハグ - うざかったら、adblockすればいいのに。に書かれている http://www.hatena.ne.jp/users/* というフィルタを用いた方が良いでしょう。

また、はてなのプロフィール画像全てをブロックしたいわけではなく、特定のユーザの画像だけをブロックしたい場合は ブロックしたいユーザの ID/profile_s.gif というフィルタを用いると良いでしょう。

ユーザ CSS で非表示にする

はてなブックマークのエントリページでは、プロフィール画像を表示する img 要素に対して hatena-id-icon という class が付与されています。 ということは、ユーザ CSS で非表示にすることも比較的容易にできるということです。

img.hatena-id-icon {
  display:  none;
  }

このように userContent.css に記述することで、プロフィール画像を非表示にできます。 ただし、プロフィール画像自体へのリクエストは変わらず行うため、ブックマークしている人数が多い場合や、通信速度が低速の場合に表示が遅くなるかもしれません。 なお、 userContent.css に記述を加える方法は Destroy target="_blank" - 導入前にちょっとした準備で解説しています。

なお、チープカ - はてブコメント欄のアイコンを消す(Firefox限定)ではてなブックマークのエントリページを狙い撃ちで display:none; する CSS が紹介されていますが、Firefox 1.5 限定の方法です。 前項の profile_s.gif ははてな外でもあり得そうな名前ですが、 hatena-id-icon という class が付与された img 要素ははてな外では滅多に無いと思うので、単純に img.hatena-id-icon という class セレクタで充分かと思われます。

ちなみに、 display:none; ではなく visiblity:hidden; でも非表示にすることができますが、 ボックスを不可視にした場合でも,他のボックスは表示されている場合と同様にレイアウトされ るため、 plotless: はてブのユーザアイコンでSafariが激重に!? で紹介されているような、 ( ピクセル的に ) 巨大なサイズのプロフィール画像が存在した場合にはブラウザの動作が遅くなる可能性があります。 ( もっとも、この問題自体は idea:8252 によって対策済みのようですが。 )

Greasemonkey スクリプトで非表示にする

ユーザ CSS と同様にプロフィール画像自体へのリクエストは行ってしまいますが、 Greasemonkey スクリプトで非表示にするという方法もあります。 disableHatenaKey.user.js が同じような結果をもたらすスクリプトだったので、 GPL に基づいて改変してみました。

ただし、 Greasemonkey による実行結果が、 img 要素を <span class="hatena-id-icon"></span> という、内容が空の span 要素に置き換えたものになるため、違う方法で実現した方が良いと思います。

まとめ

私が思いつく限りの方法を羅列してみましたが、お勧めは Adblock Plus で非表示にする方法ですね。 非表示にするだけでなく、画像へのリクエストも行わなくなるので、表示速度もこれまでと変わらないはずです。

参考までに、はてなブックマーク - はてなダイアリー日記 - プロフィール画像設定機能の追加についてをそれぞれの方法で開いた場合の HTTP ヘッダを記録したテキストファイルを置いておきます。 文面だけではプロフィール画像のファイルリクエストを行うのか行わないのか分かり辛いようでしたし。

なお、 Web Developer で Cookie とキャッシュを無効にした状態にして、 LiveHTTPHeadersHTTP ヘッダを記録しました。

デフォルト ( プロフィール画像を表示する )
Adblock Plus で profile_s.gif を非表示
ユーザ CSS で非表示
Greasemonkey スクリプトで非表示

関連リンク集

HTTP ヘッダを見る機能
Adblock Plus で非表示
ユーザ CSS で非表示
はてなキーワード
はてなアイデア
プロフィール画像設定機能の追加について
id:Hebi さんによるまとめ

リプライ

2 件のリプライが送られています。 この記事に対するご意見やご質問、ご感想などありましたら個別記事ページの送信フォームからお送り下さい。

2006-01-28T21:25+09:00 - かつを

うちでも、Adblock Plusでprofile_s.gifを非表示にしています。 # 厳密には、Hamachiya2/profile_s.gifだけですが あと、CSSでimg.hatena-id-iconに display:noneを付加しても、画像の読み込みは行わないってことは、ないんでしょうか? # 名前通り、描画しないだけ?

2006-01-30T23:01+09:00 - 真琴

display:none; でも、画像自体へのリクエストは行いますよ。と書いていたつもりがちょっと言葉足らずでしたね……。 それぞれの場合の HTTP ヘッダを記録した .txt ファイルを追記として置いてみましたので、比較してみてください。

はてなの「プロフィール画像設定機能の追加」に対して Greasemonkey スクリプトを修正した

記事データ

投稿者

望月真琴

投稿日時

2006-01-26T22:40+09:00

タグ
概要

プロフィール画像設定機能の追加によって動作しなくなった hb_addict.user.js の修正方法を示してみました。

リプライ

3 件のリプライがあります。

記事本文

はてなのいくつかのサービスにプロフィール画像が出現

この機能追加自体に関しては特に私からはコメントはありません。 今日になってはてなブックマークのエントリページが賑やかになっていて、「何だ何だ !? 」という感想は抱きましたが。

「全てのサイトをはてブ化する」 Greasemonkey スクリプトが使えなくなった

以前 Going My Way: すべてのサイトをはてなブックマークと結びつけるGreasemonkeyスクリプト経由でいぬビーム - 全てのサイトをはてブ化するという Greasemonkey スクリプトを知り、手軽にブックマークコメントをチェックできるということで重宝していました。

上段がこれまでのスクリプトの動作、下段がプロフィール画像設定機能追加以降のスクリプトの動作 のように、本来なら「ブックマークしているユーザ数」を表示して、なおかつブックマークコメントが書かれていればそれを抽出するという動作だったのですが、プロフィール画像設定機能の追加によってユーザ数の取得もブックマークコメントの取得もできなくなってしまいました。

おかしいなと思ってはてなブックマーク - はてなダイアリー日記 - プロフィール画像設定機能の追加についてのソースを確認すると、これまでは <li><span class="timestamp">2006年01月26日</span> <a href="/ruku/20060126#bookmark-1288979">ruku</a> 『[<a href="/ruku/%e3%81%af%e3%81%a6%e3%81%aa/" class="taganchor">はてな</a>] どれどれ。』</li> のような形式で記述されていたものが、 <li><span class="timestamp">2006年01月26日</span> <a href="/ruku/"><img src="http://www.hatena.ne.jp/users/ru/ruku/profile_s.gif" class="hatena-id-icon" alt="ruku" title="ruku" width="16" height="16" /></a> <a href="/ruku/20060126#bookmark-1288979">ruku</a> 『[<a href="/ruku/%e3%81%af%e3%81%a6%e3%81%aa/" class="taganchor">はてな</a>] どれどれ。』</li> といった記述に変更されていました。 まあ、プロフィール画像を表示するんだからマークアップにも何らかの変更が加わるのは当たり前なのですが。

詳しい解説は省略しますが、いぬビーム - 全てのサイトをはてブ化するの Greasemonkey スクリプトの動作を大雑把に解説すると、 xmlhttpRequest を用いて該当ページのはてなブックマークエントリページの内容を取得し、正規表現を用いて、 <li><span class="timestamp">2006年01月26日</span> <a href="/ruku/20060126#bookmark-1288979">ruku</a> 『[<a href="/ruku/%e3%81%af%e3%81%a6%e3%81%aa/" class="taganchor">はてな</a>] どれどれ。』</li> といった例のような形式にマッチしたら users の値をインクリメントして、かつコメントがあればそれを取得して該当ページの </body> の直前に書き出すという動作をしています。 ( 私は JavaScript はほとんど触れたことがないので、間違った理解をしているかもしれません、ご容赦願います。 )

「全てのサイトをはてブ化する」 Greasemonkey スクリプトを改造する

しかし、プロフィール画像設定機能の追加によって正規表現によるマッチング規則と実際のエントリページの記述に齟齬が生まれたために、どのページでも 0 users になってしまっているのです。 そこで、スクリプト内のマッチング規則を新しいエントリページの記述に合わせれば良いのでは考えました。 私は正規表現はおろか JavaScript に触れるのも初めてに近いのに !

  1. いぬビーム - 全てのサイトをはてブ化するを Firefox 上で開きます。
  2. http://yagi.xrea.jp/2005/12/hb_addict.user.js のリンクアンカーをクリックしてスクリプトを表示し、その記述をエディタにコピーします。
  3. 59 行目の while (m = d.match(/<li><span class="timestamp">([^<]*)<\/span> <a href="[^"]*">([^<]*)<\/a>(.*)?<\/li>/)) { という記述を、 while (m = d.match(/<li><span class="timestamp">([^<]*)<\/span> <a href="[^"]*"><img src="[^"]*" class="[^"]*" alt="[^"]*" title="[^"]*" width="[^"]*" height="[^"]*" \/><\/a> <a href="[^"]*">([^<]*)<\/a>(.*)?<\/li>/)) { に置き換えます。
  4. hb_addict.user.js という名前を付けて保存し、 Firefox 上でそれを開きます。サーバに put して開いても構いませんし、ローカルディスク内のものを開いても構いません。
  5. 「ツール」より「 Install This User Script 」をクリックすればインストール完了です。

なお、これまでにいぬビーム - 全てのサイトをはてブ化するのスクリプトをインストールしていた場合は、前述の作業を行う前に「ツール」より「 Manage User Script 」をクリックし、 hb_addict.user.js を Uninstall しておくようにしてください。

また、 Greasemonkey 自体をこれから導入するという方は、前述の作業を行う前にはてなグリースモンキー(Greasemonkey) - Greasemonkeyの使い方を参考に Greasemonkey を導入してください。 言うまでもありませんが、 Greasemonkey は Firefox の拡張機能ですので Firefox がインストールされている必要があります。

IRC チャンネル「 #順列都市」のみんなに助けられ、 unified 形式による patch で改造部分を示すことができるようになりました。

--- hb_addict.user.js	Thu Jan 26 23:04:14 2006
+++ hxxk_hb_addict.user.js	Thu Jan 26 21:41:16 2006
@@ -56,7 +56,7 @@
    d = response.responseText;
    var n = 0
    var already_bookmarked = false
-  while (m = d.match(/<li><span class="timestamp">([^<]*)<\/span> <a href="[^"]*">([^<]*)<\/a>(.*)?<\/li>/)) {
+  while (m = d.match(/<li><span class="timestamp">([^<]*)<\/span> <a href="[^"]*"><img src="[^"]*" class="[^"]*" alt="[^"]*" title="[^"]*" width="[^"]*" height="[^"]*" \/><\/a> <a href="[^"]*">([^<]*)<\/a>(.*)?<\/li>/)) {
      n += 1
      d = RegExp.rightContext;
      var date = m[1]

hb_addict.user.js にこの patch を適用して、 Firefox 上で開いてインストールすると良いでしょう。 patch って何っていう私のような方は Azrael: Tagwire、MT-XSearch、Cygwin導入メモを合わせてどうぞ。

mtymのstderr - 全てのサイトをはてブ化する Greasemonkey スクリプトにてよりスマートな表現が書かれています。 このように、 > を判定の基準にした方が img 要素内の属性の配置が変わっても修正を加えなくて済むので良いと思います。

おわりに

前項でも述べた通り、私はこれまでに正規表現や JavaScript に触れる機会がほとんどありませんでした。 もしかしたらスクリプトの書き換え方も何かしら遠回りしているかもしれません。 もっとスマートな記述があるよ、という方は遠慮なくダメ出ししていただけると幸いです。

トラックバック送信先

はてなダイアリー日記 - プロフィール画像設定機能の追加について

プロフィール画像設定機能の追加によって動作しなくなった hb_addict.user.js の修正方法を示してみました。

はてなブックマーク日記 - プロフィール画像設定機能の追加について

プロフィール画像設定機能の追加によって動作しなくなった hb_addict.user.js の修正方法を示してみました。

いぬビーム - 全てのサイトをはてブ化する

プロフィール画像設定機能の追加によって動作しなくなった hb_addict.user.js の修正方法を示してみました。

リプライ

3 件のリプライが送られています。 この記事に対するご意見やご質問、ご感想などありましたら個別記事ページの送信フォームからお送り下さい。

2006-01-27T13:38+09:00 - hb_addictの修正 < いぬビーム

 真琴さんのパッチをそのまま取り込みました。ありがとうございます。  http://yagi.xrea.jp/2006/01/hb_addict.us...

2006-01-27T13:39+09:00 - hb_addictの修正 < いぬビーム

 真琴さんのパッチをそのまま取り込みました。ありがとうございます。  http://yagi.xrea.jp/2006/01/hb_addict.us...

2006-01-27T13:39+09:00 - hb_addictの修正 < いぬビーム

 真琴さんのパッチをそのまま取り込みました。ありがとうございます。  http://yagi.xrea.jp/2006/01/hb_addict.us...

title 要素に文字参照は使用できるのか ?

記事データ

投稿者

望月真琴

投稿日時

2006-01-25T23:01+09:00

タグ
概要

Q. title 要素内に文字実体参照ないし数値文字参照を使用できますか ? A.できます。

リプライ

リプライはまだありません。

記事本文

Re: はてなブックマーク日記 - 特定のサイトがブックマークできない件について

はてなブックマーク - 最近の人気エントリー経由で知ったはてなブックマーク自体の不具合のアナウンス。

現在はてなブックマークが内部で利用しているソフトウェア不具合が原因で、幾つかのサイトがブックマークできない状態となっております。

具体的には、HTML の title 要素に実体参照の '&#160;' が含まれているサイトなどです。

&#160; というのは文字実体参照ではなく数値文字参照にあたります。 ( 私も明確に理解したのは最近でしたが。)

Character entity references in HTML 4 に仕様が示されていますが、 no-break space = non-breaking space を文字実体参照で表す場合は &#160; ではなく &#nbsp; という記述になりますので、 「 HTML の title 要素に数値文字参照の '&#160;' が含まれているサイトなどです。」 と書く方が記述として正確になります。

現在は記述が修正されています。 対応ありがとうございます。

Re: はてなブックマーク - AAぶろぐ_仏苦魔悪

そして、はてなブックマーク日記 - 特定のサイトがブックマークできない件について寄せられたブックマークコメントの中で気になったものが一点。

[はてな][はてブ]てゆーかtitle要素内に実態参照ってどうなのだろうか

高橋雅奇さん ( はてなブックマーク - AAぶろぐ_仏苦魔悪 ) って、 AAぶろぐ_仏苦魔悪 / W3C で分類されているブックマークやそれに付随するコメントを見る限り、 仕様を蔑ろにするような方ではないと思うのですが……。 仕様書や DTD を見れば答えは明白なのです。

次の項以降で詳述しますが、 title 要素内に文字参照を用いることは特に問題はありません。 はてなブックマーク内部のシステムにどういった不具合があるか分かりませんが、これはサイト製作者側には瑕疵は無いと考えて良いでしょう。

それにしても、はてなブックマークのコメントで疑問を呟かれていた場合、その疑問を抱いた方に確実に回答をお届けする手段って無いですよね。 その方のブックマークページからその方のサイトへのリンクがあって、そこから連絡先を探すという手段もありますが、その方のサイトへのリンクが 100% 書かれているとは限りません。 かと言ってコメントの為にブックマークしても、回答をお届けしたい方がエントリページ ( http://b.hatena.ne.jp/entry/ で始まる URI のページ ) を見ていなければ伝わりませんし。 その辺りにブックマークコメントの難しさが潜んでいるような気がします。

HTML 4.01 Transitional DTD を読み解く

閑話休題。 title 要素に文字参照を用いることができるかどうかという件ですが、 title 要素が DTD でどのように定義されているかを見れば答えにつながることが書いてあります。

はてなブックマークのエントリページは DTD 宣言が無いために、どのバージョンの HTML or XHTML にも属しません。 しかし、各ユーザのページでは <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> という宣言がなされているので、 HTML 4.01 Transitional DTD を見てみましょう。 title 要素については、次に引用する記述で定義されています。

<!ELEMENT TITLE - - (#PCDATA) -(%head.misc;) -- document title -->
<!ATTLIST TITLE %i18n>

これだけ見ても、何について書いてあるのかすぐ理解できる方はそう多くないと思います。 そこで、ごくごく簡単なDTDの説明を参考に、各部分の意味を考えてみましょう。

<!ELEMENT TITLE

これは TITLE という名前の要素を宣言する記述の開始部分です。

- -

左が開始タグ、右が終了タグについてで、 - が省略不可、 O が省略可(Omission)を表します ということですので、 title 要素の開始タグ・終了タグはどちらも省略不可であると示されていることになります。

(#PCDATA) -(%head.misc;)

内容モデルが #PCDATA であることを示し、 head.misc として実体宣言されているものは出現してはいけないと示されています。 その head.misc は <!ENTITY % head.misc "SCRIPT|STYLE|META|LINK|OBJECT" -- repeatable head elements --> と宣言されているため、

  • script 要素
  • style 要素
  • meta 要素
  • link 要素
  • object 要素

が出現してはならないということになります。

<!ATTLIST TITLE

これは TITLE という名前の要素が持つことのできる属性を宣言する記述の開始部分です。

%i18n

i18n として実体宣言されているもの、すなわち

<!ENTITY % i18n
 "lang        %LanguageCode; #IMPLIED  -- language code --
  dir         (ltr|rtl)      #IMPLIED  -- direction for weak/neutral text --"
  >

と宣言されている部分のことで、 lang 属性と dir 属性のことを指します。 よって、 title 要素には lang 属性および dir 属性を指定することができます。

ここで注意しなければならないのは、 title 要素が head 要素の子要素である点です。 title 要素は <!ENTITY % head.content "TITLE & ISINDEX? & BASE?"> という実体宣言に含まれ、その %head.content は <!ELEMENT HEAD O O (%head.content;) +(%head.misc;) -- document head --> という要素宣言に含まれています。 これは head 要素内には %head.content が 1 回だけ出現し、 %head.misc が子孫にわたって出現して良いということを示しています。

よって、もし title 要素が <!ELEMENT TITLE - - (#PCDATA) -- document title --> のような宣言をされていた場合は、親要素で出現して良いとされている %head.misc が要素モデル内に含まれることを許容することになります。 そこで、 title 要素の要素宣言内で -(%head.misc;) と記述することで、 %head.misc が出現してはならないということを示しています。

同様に、 head 要素が含まれている実体宣言を探してみると、 <!ENTITY % html.content "HEAD, BODY"> という実体宣言が見つかります。 そしてその実体宣言が含まれる要素宣言は <!ELEMENT HTML O O (%html.content;) -- document root element --> という html 要素の宣言です。 これを逆の順番で考えると、

  1. HTML 4.01 Transitional DTD において、 html 要素には %html.content ( head 要素を 1 つ、その後に body 要素を 1 つ ) が 1 回だけ出現する
  2. head 要素には %head.content ( title 要素が 1 つと、 isindex 要素および base 要素がそれぞれ 0 または 1 つ。順序は任意 ) が 1 回だけ出現し、 %head.misc ( script 要素、 style 要素、 meta 要素、 link 要素、 object 要素のうちのどれか 1 つ ) が子孫にわたって 0 または複数回出現する
  3. title 要素には #PCDATA が出現し、親要素である head 要素に出現する %head.misc は出現してはならない

ということになり、これをまとめると title 要素には #PCDATA しか出現してはならないということになります。

#PCDATA とは何なのか

では、 title 要素に配置される #PCDATA とは何のことを指すのか ? #PCDATA (構文解析対象文字データ)@ばけらの HTML リファレンス(未完成) が非常に参考になります。

PCDATA は Parsed Character Data の略で、「構文解析対象文字データ」です。 Parsed というのは SGML 的に解釈 (パース) されるということを意味します。 このデータ型は任意の長さを持つ (長さゼロでも良い) 任意のテキストですが、以下のような特徴を持ちます。

  • 文字参照は展開されて対応する文字に置き換えられる。たとえば &amp; と書くと & に置き換えられます。
  • マークはマークとして解釈される。たとえば < はタグの開始区切り子と見なされます (当然そこで #PCDATA は終了しているものとみなされます)。また、<!-- --> を書けば注釈宣言とみなされ、その中身はコメントとして無視されます。

CDATA (文字データ)@ばけらの HTML リファレンス(未完成)も合わせて読むと分かりやすいのですが、大雑把に言うと文字参照が展開されるテキストだということです。 ( では CDATA は文字参照がされないテキストなのかと言うと、 CDATA についても属性値として扱われる場合は文字参照が展開されるため、 CDATA = 文字参照が展開されないテキストとは一概に言えないことに注意してください。 )

他のバージョンの HTML or XHTML ではどうか

前 2 項は HTML 4.01 Transitional DTD を元に考えてみましたが、他のバージョンの HTML or XHTML はどうでしょうか。 それぞれの DTD から関係する部分だけを抜粋して並べてみましょう。

HTML 4.01 Transitional DTD
<!--================ Document Structure ==================================-->

<!ENTITY % html.content "HEAD, BODY">

<!ELEMENT HTML O O (%html.content;)    -- document root element -->

<!--================ Document Head =======================================-->
<!-- %head.misc; defined earlier on as "SCRIPT|STYLE|META|LINK|OBJECT" -->
<!ENTITY % head.content "TITLE & ISINDEX? & BASE?">

<!ELEMENT HEAD O O (%head.content;) +(%head.misc;) -- document head -->

<!ELEMENT TITLE - - (#PCDATA) -(%head.misc;) -- document title -->
HTML 4.01 Frameset DTD
<!--================ Document Structure ==================================-->

<![ %HTML.Frameset; [
<!ENTITY % html.content "HEAD, FRAMESET">
]]>

<!ELEMENT HTML O O (%html.content;)    -- document root element -->

<!--================ Document Head =======================================-->
<!-- %head.misc; defined earlier on as "SCRIPT|STYLE|META|LINK|OBJECT" -->
<!ENTITY % head.content "TITLE & ISINDEX? & BASE?">

<!ELEMENT HEAD O O (%head.content;) +(%head.misc;) -- document head -->

<!ELEMENT TITLE - - (#PCDATA) -(%head.misc;) -- document title -->
HTML 4.01 Strict DTD
<!--================ Document Structure ==================================-->
<!ENTITY % html.content "HEAD, BODY">

<!ELEMENT HTML O O (%html.content;)    -- document root element -->

<!--================ Document Head =======================================-->
<!-- %head.misc; defined earlier on as "SCRIPT|STYLE|META|LINK|OBJECT" -->

<!ENTITY % head.content "TITLE & BASE?">

<!ELEMENT HEAD O O (%head.content;) +(%head.misc;) -- document head -->

<!ELEMENT TITLE - - (#PCDATA) -(%head.misc;) -- document title -->
XHTML 1.0 Transitional DTD
<!--================ Document Structure ==================================-->

<!-- the namespace URI designates the document profile -->

<!ELEMENT html (head, body)>

<!--================ Document Head =======================================-->

<!ENTITY % head.misc "(script|style|meta|link|object|isindex)*">

<!-- content model is %head.misc; combined with a single
     title and an optional base element in any order -->

<!ELEMENT head (%head.misc;,
     ((title, %head.misc;, (base, %head.misc;)?) |
      (base, %head.misc;, (title, %head.misc;))))>

<!ELEMENT title (#PCDATA)>
XHTML 1.0 Frameset DTD
<!--================ Document Structure ==================================-->

<!-- the namespace URI designates the document profile -->

<!ELEMENT html (head, frameset)>

<!--================ Document Head =======================================-->

<!ENTITY % head.misc "(script|style|meta|link|object|isindex)*">

<!-- content model is %head.misc; combined with a single
     title and an optional base element in any order -->

<!ELEMENT head (%head.misc;,
     ((title, %head.misc;, (base, %head.misc;)?) |
      (base, %head.misc;, (title, %head.misc;))))>

<!ELEMENT title (#PCDATA)>
XHTML 1.0 Strict DTD
<!--================ Document Structure ==================================-->

<!-- the namespace URI designates the document profile -->

<!ELEMENT html (head, body)>

<!--================ Document Head =======================================-->

<!ENTITY % head.misc "(script|style|meta|link|object)*">

<!-- content model is %head.misc; combined with a single
     title and an optional base element in any order -->

<!ELEMENT head (%head.misc;,
     ((title, %head.misc;, (base, %head.misc;)?) |
      (base, %head.misc;, (title, %head.misc;))))>

<!ELEMENT title (#PCDATA)>
XHTML 1.1 DTD ( xhtml-struct-1.mod )
<!-- html: XHTML Document Element ...................... -->

<!ENTITY % html.element  "INCLUDE" >
<![%html.element;[
<!ENTITY % html.content  "( %head.qname;, %body.qname; )" >
<!ENTITY % html.qname  "html" >
<!ELEMENT %html.qname;  %html.content; >
<!-- end of html.element -->]]>

<!-- head: Document Head ............................... -->

<!ENTITY % head.element  "INCLUDE" >
<![%head.element;[
<!ENTITY % head.content
    "( %HeadOpts.mix;, %title.qname;, %HeadOpts.mix; )"
>
<!ENTITY % head.qname  "head" >
<!ELEMENT %head.qname;  %head.content; >
<!-- end of head.element -->]]>

<!-- title: Document Title ............................. -->

<!-- The title element is not considered part of the flow of text.
     It should be displayed, for example as the page header or
     window title. Exactly one title is required per document.
-->

<!ENTITY % title.element  "INCLUDE" >
<![%title.element;[
<!ENTITY % title.content  "( #PCDATA )" >
<!ENTITY % title.qname  "title" >
<!ELEMENT %title.qname;  %title.content; >
<!-- end of title.element -->]]>
XHTML Basic DTD ( xhtml-struct-1.mod )
<!-- html: XHTML Document Element ...................... -->

<!ENTITY % html.element  "INCLUDE" >
<![%html.element;[
<!ENTITY % html.content  "( %head.qname;, %body.qname; )" >
<!ENTITY % html.qname  "html" >
<!ELEMENT %html.qname;  %html.content; >
<!-- end of html.element -->]]>

<!-- head: Document Head ............................... -->

<!ENTITY % head.element  "INCLUDE" >
<![%head.element;[
<!ENTITY % head.content
    "( %HeadOpts.mix;, %title.qname;, %HeadOpts.mix; )"
>
<!ENTITY % head.qname  "head" >
<!ELEMENT %head.qname;  %head.content; >
<!-- end of head.element -->]]>

<!-- title: Document Title ............................. -->

<!-- The title element is not considered part of the flow of text.
     It should be displayed, for example as the page header or
     window title. Exactly one title is required per document.
-->

<!ENTITY % title.element  "INCLUDE" >
<![%title.element;[
<!ENTITY % title.content  "( #PCDATA )" >
<!ENTITY % title.qname  "title" >
<!ELEMENT %title.qname;  %title.content; >
<!-- end of title.element -->]]>

細かい解説は割愛しますが、共通して言えることはどのバージョンにおいても title 要素の内容は #PCDATA のみであるということです。 なお、 ISO-HTMLDTD は ftp://ftp.cs.tcd.ie/isohtml/15445.dtd に置かれてありますが、内容を見ることはできませんでした。 DDT's Room:JIS-HTMLに関する私的メモ - TITLE要素によると、 <!ELEMENT TITLE - - (#PCDATA) -(LINK | META | STYLE) > のように、やはり #PCDATA のみが title 要素内に出現する内容として定義されているようです。

まとめ

まとめると、現在勧告されている HTML or XHTML において、 title 要素に出現することができる内容は文字参照が展開されるテキストであるということになります。 Re: はてなブックマーク - AAぶろぐ_仏苦魔悪にて「 title 要素内に文字参照を用いることは特に問題はありません」と述べましたが、前 3 項のような根拠によって成り立っています。

トラックバック送信先

はてなブックマーク日記 - 特定のサイトがブックマークできない件について

文中に「実体参照」と書いてありますが、この場合は「数値文字参照」と書くべきです。

リプライ

リプライはまだ送られていないか、管理者の承認待ち状態です。 この記事に対するご意見やご質問、ご感想などありましたら個別記事ページの送信フォームからお送り下さい。

読売ウイークリー編集部の weblog から削除された記事と、讀賣新聞に寄稿された大塚英志氏の文章

記事データ

投稿者

望月真琴

投稿日時

2006-01-19T00:40+09:00

タグ
概要

以前、読売ウイークリー編集部の weblog に掲載され、そして削除された記事。その内容と同様のことが讀賣新聞紙上に掲載されたため、「では何故あの時は削除されたのか ? 」という疑問が浮かびました。

リプライ

2 件のリプライがあります。

記事本文

宮崎被告 死刑確定へ 識者はこう見る

今朝……もうこれを書いている時点で日付が変わってしまったので昨日の朝ということになりますが、 1 月 18 日の朝刊を見ると、一面に大きくライブドアの経常赤字の粉飾事件、ヒューザー小嶋社長の証人喚問、そして宮崎勤被告の死刑確定の記事が掲載されていました。

そのうち、宮崎勤被告の件に関しては別面で 宮崎被告 死刑確定へ 識者はこう見る という記事を掲げ、 16年近くにわたった宮崎被告の裁判を、初公判から上告審の最後まで傍聴し続けた識者3人 ( 作家の佐木隆三氏、ノンフィクション作家の吉岡忍氏、漫画原作者の大塚英志氏 ) が寄稿した文章を並べていました。 その中で大塚英志氏が冒頭で書いている部分、

事実としてまず記しておきたいのは、余りに有名になった宮崎被告の部屋に積み上げられた5787本のビデオテープのうち、性的表現やホラー映画の類は数十本にすぎないということである。 あのビデオの大半に猟奇的な映像が録画されていると信じるマスコミ関係者も多いが、事実は異なる。

また、事件当時、被告と同じ姓の宮崎駿監督のアニメのような良心的作品に触れていれば事件に至らなかったという論評があったが、被告のビデオには「宮崎さん」と「さん」付けのラベルの貼られた宮崎アニメも含まれていた。 被告の部屋の写真からのイメージのみで、メディア表現と犯罪との関わりを今も論じようとする人々に、それらの事実の意味を考えて欲しい。

このこと自体は真新しい新事実ということではなく、複数の人物から指摘がなされているようです。 ( 同面に寄稿している吉岡忍氏のM/世界の、憂鬱な先端でも触れられています。 )

何故か削除されてしまった記事

昨年 11 月には格闘する読売ウイークリー編集部上にて、その部屋の内部を一番最初に実際に見た木村透氏という当時の記者が、そのことについて記名の上で記事を書き、そして何らかの経緯があって最終的には当該記事が削除されるといった事が起こりました。 ( 削除されたこと、および当該記事の内容については ToS : silver shooting star : 宮崎勤事件を覚えてますか?不可視型探照灯 事件報道のリソースに「恣意的な映像」を加えていたマスコミ、それを黙認するマスコミ。が参考になります。 )

格闘する読売ウイークリー編集部: 出直しますにて 読売ウイークリー不適切引用記事で処分 ゼロから出直します という記述がありましたが、これは不適切記事で処分、読売ウイークリー編集長ら (読売新聞) - goo ニュースにあるように、 「読売ウイークリー」10月30日号に「TBS、阪神ファンが知らない『村上世彰』の本性」との題で掲載された特集記事の一部に、「日経ビジネス」(日経BP社発行)の記事と酷似する表現があることがわかった ためであり、宮崎被告の部屋に関する記事を削除したこととは関連が無いと考えられます。 処分時期以前の記事でも宮崎被告の部屋に関する記事以外のものは今でも閲覧できますし、何より当該記事の内容は、当事者自身による経験から綴られた言葉で書かれているために他所と似通うはずもありません。

何故格闘する読売ウイークリー編集部上から記事が削除されたのか、私は削除された後にそのことを知ったために、経緯を知ることができませんでした。

削除に至る経緯を推測できない

しかし、最初の項で述べた通り、実際は当該記事に書かれていた内容が事実であったことが新聞紙面にきちんと文字として載せられています。 これまでマスコミが喧伝してきた、部屋一面に大量のわいせつな内容のビデオが積み上げられていたということが印象操作であったと暴露したために削除された、と考えるのには少々無理があるでしょう。

何より、私が今回読んだ新聞は讀賣新聞です。 もし、「わいせつな内容のビデオが実は少数だった」ことを隠したいのならば、大塚英志氏から寄稿された文章を堂々と載せるとは考えにくく、尚更 ( 当時の ) 讀賣新聞社会部記者によって書かれた記事が削除されてしまったのか分かりません。 どなたか、削除に至った経緯を詳しくご存知になっている方いらっしゃいましたら是非教えてください。

リプライ

2 件のリプライが送られています。 この記事に対するご意見やご質問、ご感想などありましたら個別記事ページの送信フォームからお送り下さい。

2006-02-27T04:06+09:00 - ネラー

読売内部でも、朝刊担当者と夕刊担当者では、 ヲタク系記事に対する対応が、異なるような 気がするのですが。

2006-03-02T23:27+09:00 - 真琴

そういえば、私は夕刊は滅多に読みません。 担当者によって記事の方向性が違うというのはある意味当然かもしれませんが、そんなに異なるんですか ?

このページの印刷や保存に関すること

記事データ

投稿者

望月真琴

投稿日時

2006-01-18T00:21+09:00

タグ
概要

私の配慮が足りなかった点があり、普通にブラウジングしているだけでは問題が無かった部分も、こと印刷や保存においてはいくつかの問題があった件について。

リプライ

2 件のリプライがあります。

記事本文

Re:A four leaved clover - 1月10日 火曜日 「iPod Photoで歌詞表示」

……しかし、どちらのページも、印刷するなり、ページを保存するなりしておきたい内容ですけど、印刷にも保存にも適さないページですね。 これだから、weblogは嫌いなのですよ。

これは weblog であるかそうでないかが原因ではないと思います。 何を以って weblog を定義するかにもよりますが、一般的な weblog ツールや weblog サービスによるものを weblog と指すのなら、その種類によって印刷や保存に適している・適していないは分かれるはず。 すなわち、今回のケースでは私が悪いと !

……いや、それで終わらせてしまっては実も蓋もないのでもう少し掘り下げてみましょう。

印刷に適さない ! ( 近々対応 )

印刷に適さないというご指摘ですが、テーブルでガチガチに固めているわけでもないし、グラフィカルブラウザを用いて表示することを想定しているスタイルシートは印刷時には適用されない用にしているはずです。

……と思ったら、スタイルシートの指定をする部分で media="screen" の指定を忘れているという凡ミスが発覚。

Firefox 1.5 による印刷プレビューのスクリーンショットのように、グラフィカルブラウザで見えているスタイルがそのまま印刷にも適用され、印刷時には不要と考えられるサイドバー部分まで印刷されるようになっていました。 これはなるべく早いうちに、別途印刷用スタイルを用意しておこうと思います。

保存に適さない ! ( 対応済 )

さて次に保存に適さないというご指摘。 これは実際にローカルに保存してもう一度ブラウザで開くことで簡単に検証できます。 ……で、一度ローカルに保存したページを再度開いたスクリーンショットを見ると、スタイルがものすごく中途半端に適用されています。

これは hxxk.jp で用いているスタイルシートが、一つの CSS ファイルで構成されているのではなく、 Web Standards with MT ver.3.2 StrictCSS@import で読み込んでベースとして、それにプラスアルファの指定を加えることで構成されていることによります。

それだけではスタイルが崩れる原因にはなりませんが、 @import url(/template/mt_3_2_strict/styles-site.css); のように / で始まるフルパスで CSS をインポートしていると、一旦ローカルに保存してから改めて開いた場合にインポート先の CSS までは反映されません。 よって、今回のように中途半端な混じり方をしたスタイルになるわけです。 同様に、背景画像も / で始まるフルパスで示しているため、ローカルに保存したものを開く場合には無効になります。 ( もちろん、インポート先の CSS や背景画像も合わせてローカルに保存していればこの限りではありません。 )

ドメイン名をサイト名にしている == サーバを移ることはあってもドメイン名を変更することはまず有り得ない == / で始まるフルパスにこだわる必要性は希薄となる、ということで / で始まるフルパスではなく http:// で始まるフルパスの指定に変更しました。 そしてもう一度ローカルに保存した上で開いてみると、今度はきちんとスタイルが適用された状態で見ることができました。 ( ただし、本文中の img 要素による画像についてはこれまで通り / で始まるフルパスで記述しています。 現時点で http:// で始まるフルパスを用いているのは CSS 内のみです。 )

おわりに

今回は A four leaved clover - 1月10日 火曜日 「iPod Photoで歌詞表示」のおかげで、見辛い・使い辛い状態が生じていることを知ることができました、ありがとうございます。 今回同様、見辛い点や使い辛い点、その他何らかの不具合があればコメントやトラックバックやメールやその他何らかの手段でお伝え願えれば幸いです。 気付いた範囲および出来うる範囲で対処します。

Re: はてなブックマーク - hxxk.jp - このページの印刷や保存に関すること

  • 2006年01月18日 asiamoth 『[css][webdesign]印刷や保存のことを考えた記述を。RSS内も相対パスイクナイ。』

RSS 内も~というのは、おそらく RSS に記事全文を入れる際の話だと思います。 hxxk.jp のように / で始まるフルパスで img 要素を配置している場合、 RSS リーダで読むと多くの場合はその画像は表示されません。 ( 表示されるものもあるかもしれません。 ) しかし、この場合はそれが必ずしも良くないということは無いと思います。

hxxk.jp は xrea からスペースを借りて運営していますが、画像ファイルの外部からの呼び出しについては認められていません。 ( これは技術的な対策はされていませんが、規約で定められています。 ) そこで http:// から始まるフルパスの形式で img 要素を配置し、その内容を RSS でも提供するとこれに抵触してしまうのです。 また、ローカルに保存したものを開き、スタイルが中途半端に適用されてしまう場合と違い、 RSS で画像が表示されない場合は実際の記事を読みに行けば解決できます。 また、仮に画像が表示されなくても、 alt 属性を適切に記述していれば文意が損なわれてしまうことも無いと考えるため、今後も img 要素については / から始まるフルパスで記述していこうと思っています。

リプライ

2 件のリプライが送られています。 この記事に対するご意見やご質問、ご感想などありましたら個別記事ページの送信フォームからお送り下さい。

2006-01-19T19:54+09:00 - asiamoth

> hxxk.jp は xrea からスペースを借りて運営していますが、画像ファイルの外部からの呼び出しについては認められていません。 おっと! 自分もxreaを借りていますが──恥ずかしながら、これは知りませんでした。自分から故意に、外部のサーバからxreaサーバにある画像を呼び出す、ということはしていませんが、今後も気をつけます。 RSSリーダで閲覧中、画像の部分が歯抜けになっているサイトがあって「イクナイ」と書いたのですが、一概には言えないわけですね……。勉強になりました! ありがとうございます。

2006-01-30T22:55+09:00 - 真琴

はっきりと認められていないというわけではないのですが、転送量や負荷率の絡みで推奨はされていないって感じですね。 うちの場合は、 RSS 内に画像を表示していない現状でも転送量・負荷率ともにサーバ内の 10 位以内にいるので、なかなか冷や汗ものなのです。

マークアップを可視化する Firefox の拡張

記事データ

投稿者

望月真琴

投稿日時

2006-01-12T02:21+09:00

タグ
概要

h1, h2, h3, h4, h5, h6, p, ol, ul, li, dt, dd, font, div, span, blockquote, pre, a, b, i, strong, em という HTML の主要なタグによるマークアップを手軽に可視化する拡張、 X-Ray を使ってみました。

リプライ

リプライはまだありません。

記事本文

X-Ray

Modern Syntax : ページ上にHTMLタグを表示してくれるFirefox用プラグイン経由で導入。 以前[ワツニュ]人ん家のスタイルシートで表示http://hxxk.jp/common/css/preview.css を組み合わせて似たような試みをやったことがありますが、この拡張の方がより手軽に確認できますね。

For version 0.5 the current list of supported tags is: h1, h2, h3, h4, h5, h6, p, ol, ul, li, dt, dd, font, div, span, blockquote, pre, a, b, i, strong, em. If some other people find this extension useful, I’ll probably add support for more tags, and possibly experiment with adding some other enhancements as well.

とあるように、全てのタグではなく主要なタグのみの可視化を行う模様。

スクリーンショット比較

[ワツニュ]人ん家のスタイルシートで表示と http://hxxk.jp/common/css/preview.css で hxxk.jp を表示したもの

こちらは既存のスタイルは反映せずに preview.css のスタイルを反映して構造を可視化。

X-Ray で hxxk.jp を表示したもの

こちらは既存のスタイルは維持したまま、マークアップのみを可視化。

リプライ

リプライはまだ送られていないか、管理者の承認待ち状態です。 この記事に対するご意見やご質問、ご感想などありましたら個別記事ページの送信フォームからお送り下さい。

2006 年の weblog ムーヴメントは 2000 年頃のものがリバイバルする !

記事データ

投稿者

望月真琴

投稿日時

2006-01-11T23:54+09:00

タグ
概要

良質な weblog を探す立場の人間から見たこれからのムーヴメント、それは 2000 年から 2001 年頃のムーヴメントに共通するものがあります。

リプライ

リプライはまだありません。

記事本文

20 世紀にタイムスリップしたかと思った

むだづかいにっき♂:ブログでは空白の使い方が大切、ですか?経由でこのブログがすごい!BLOG:ブログでは空白の使い方が大切。 年が明けてみたらそこは 20 世紀最後の年だった、そんな気分に陥りました。 通常だったら引用の際に <br><br /> は除去するんですが、空白の使い方に無意味にこだわっておられるのでそのまま引用します。

見てもらえれば、わかるんですが
空白の使い方がとても上手なんですよね。

なんか、読者に能動的に読ませるというか
スクロールさせた先にオチを持ってくるという
書き方の妙も、このブログの魅力なんです。

br 要素による強制改行を連打してオチの部分をすぐに見せず、スクロールさせて読ませる……って、ウザい上にダサいのですが。 本当はこういった表現は好きじゃないのですが、本当に「ウザい」「ダサい」という印象しか抱きません。

なるほど、スペースのほかにも
フォントで強弱つけるってのも
手ですねー。

なんか、書き方が上手いブログってのも
探してみようかと思った次第であります。

侍魂をご覧になられてはいかがでしょう。 手法自体の是非はともかく、その手法の使い方としては上手かった部類に入るかと。

改行の使い方を誤ると

紙媒体と違い、 HTML 文書が読まれる環境というのは不定です。 幅を自由に変更できるビジュアルブラウザを用いて読まれるかもしれませんし、逆に幅が一定で変更できない画面に表示されて読まれるかもしれませんし、スクリーンリーダを用いて音声として読み上げられるかもしれません。 そんな状況において、文章の途中に作成者によって挿入された改行というものは、万人にとって適切であるとは言えません。

もちろん、文章の意味や内容が転換される場合、それは別の段落としてそれぞれ p 要素などのブロックレベル要素でマークアップすれば良いでしょう。 ひたすらに長く、しかしそれが全て一つの段落に収められている文章はお世辞にも読みやすいとは言えませんし。 しかし、それと段落の中に更に改行を織り交ぜるのは違います。

読みやすいだろうとか、あるいは何らかの視覚的効果が得られるだろうといった作成者の思惑は、固定的な環境であれば有効かもしれませんが、こと web では往々にしてマイナスに働く結果となります。 例えば、書かれている情報の多さや速報性、独自の視点によるコメントで、私がよく読むようになった天漢日乗という weblog がありますが、これは正にそういった作成者の思惑がマイナスに働いている例だと思います。 内容自体は悪くないんですけどねえ。

例えば天漢日乗: 東京国立博物館の考古学系展示は改善の余地だらけという記事。

この展示で出色は
 円山応挙 朝顔狗子図杉戸
だった。いや~、子犬がかわいいことかわいいこと。あとは
 埴輪犬
かな? 地下のミュージアムショップへ行ったら
 埴輪犬と埴輪馬のぬいぐるみ
が売られていて、驚倒した。
 埴輪のぬいぐるみ
って何よ? JFAのマスコットだった
 ドギーとハニー
のマネですか? 馬の方は
 馬具の出来が良かったら、学生に説明するときの資料に買おうか
と思ったのだが、残念ながら、馬具の作りが甘かったので止めた。「辻金具」「磯」「後輪(しずわ)」「雲珠(うず)」など、馬具にはヘンな名称がたくさんあるんだけど、図で覚えるより、ブツを見た方が早いからなあ。

と、おそらく何らかの強調表現だろうと思われる箇所がありますが、それが全て前後の文章に対して改行し、全角スペースによるインデントがなされています。 正直言って、文字を読み進めるテンポがかなり崩れます。 黙読でこの調子であるため、スクリーンリーダで読み上げた時の結果を想像すると、もっと凄いことになっていそうです。

手元で何とかする

*{
  color:  #000 !important;
  font-size:  100% !important;
}
br{
  display:  none;
}

ユーザスタイルシートにこのように記述しておけば、フォントいじりや改行の連発をほとんど無効化できるでしょう。 それらを無効化した上で読んで、とたんに読みにくくなったり面白さが無くなったりした文章は、文章構成力が無く小手先の手法でごまかしていたということ。 それだけのことです。

トラックバック送信先

このブログがすごい!BLOG:ブログでは空白の使い方が大切

空白をどう使うかフォントで強弱を付けるとかの小手先のテクニックよりも、文章自体を読みやすく、面白くするようにする方が良いと思います。

リプライ

リプライはまだ送られていないか、管理者の承認待ち状態です。 この記事に対するご意見やご質問、ご感想などありましたら個別記事ページの送信フォームからお送り下さい。

ビール日記 2006/01/09 - セントルイス プレミアムファロ

記事データ

投稿者

望月真琴

投稿日時

2006-01-10T21:39+09:00

タグ
概要

セントルイス プレミアムファロを飲みました。

リプライ

リプライはまだありません。

記事本文

St. Louis Premimu Faro

  • セントルイス プレミアムファロ

ベルギーのランビックビール。 以前セントルイス グーズを飲みましたが、セントルイス グーズがランビックの古酒と新酒を混ぜて再度発酵させたものであるのに対し、こちらは若いランビックに角砂糖を加えて発酵させたものです。 従ってグーズよりも甘味が強く、しかし爽やかな酸味はしっかりと感じられます。

日中に体を動かす仕事をしていたので、その酸味が非常に美味しく感じられました。 また夏が近づく頃に買ってみようかと思います。 アルコール度数は 3.2% 。

リプライ

リプライはまだ送られていないか、管理者の承認待ち状態です。 この記事に対するご意見やご質問、ご感想などありましたら個別記事ページの送信フォームからお送り下さい。

ビール日記 2006/01/08 - セントセバスチャン グランクリュ

記事データ

投稿者

望月真琴

投稿日時

2006-01-10T21:33+09:00

タグ
概要

セントセバスチャン グランクリュを飲みました。

リプライ

リプライはまだありません。

記事本文

St. Sebastiaan Grand Cru

  • セントセバスチャン グランクリュ

ベルギーのアビイビール。 金茶色の液体で、フルーティな香りが際立っています。 舌触りも滑らかで飲みやすくて美味しいビールですが、アルコール度数が 7.6% と高めの上に、容量が 500ml の陶器瓶に入っているため、少々酔いが廻りました。

ちなみに私が買ったショップではこれ 1 本で 1,000 円近くのお値段でした。 ( 自宅で飲むビールとしては ) 年始一発目のビールで、かつ今年最初の大きめの仕事を終えた日だったので自分へのご褒美ということで開栓。 また飲みたいけど、何か買うきっかけを作らないとなかなか踏ん切りをつけられないかもしれません。

リプライ

リプライはまだ送られていないか、管理者の承認待ち状態です。 この記事に対するご意見やご質問、ご感想などありましたら個別記事ページの送信フォームからお送り下さい。

「真琴だけど何か質問ある ? 」の回答と、同様のプロフィール Q&A のまとめ

記事データ

投稿者

望月真琴

投稿日時

2006-01-10T00:55+09:00

タグ
概要

「真琴だけど何か質問ある ? 」の回答と、同じような企画をしているページのリンク集。

リプライ

リプライはまだありません。

記事本文

回答ページは hxxk.jp についてと分離することにした

真琴だけど何か質問ある ? という参加型プロフィール拡充企画を立ち上げて、 hxxk.jp についてのプロフィールを充実させようと思ったのですが、いざ回答を追記していくとその部分だけやたら分量が多くなるなあと思ったので、こうして回答記事を立ち上げることにしました。 hxxk.jp についてにはここへのリンクのみを記述することにします。

また、 FOAF を拡張して質問と回答を表現 < Black Box にて、 「回答者が質問に回答する」「質問者が質問を出す」という情報を RDF を使って 表すための語彙が提唱されていますので、以前作ろうとして絶賛放置中の FOAF にもいずれ書き加えたいなと思います。

記事を書くときに使っているエディタ

「記事を書くときに使っているエディタ」について書いて欲しいです(「weblog に関すること」辺り?)。 - asiamoth さん ( 亜細亜ノ蛾 - Weblog )

ez-HTML を使っていますが、タグ入力支援のような機能は一切使用せず、全て自分でマークアップまで行っています。 シンプル志向に基づいた複雑な構成の手順を継続しているのかということも尋ねられていましたが、現在もほとんど手順は変わっていません。 私の作業のコンセプトは「ガッツで手作業」です。 各種日付アーカイブやサイトマップ、キーワードによる分類を Movable Type によって自動化しているだけで、毎回ひとつの HTML 文書を書き上げているのと同じ姿勢で行っています。

ご趣味は ?

ウェブやビール関係以外ではあまり趣味が見える記事がないので、これら以外の趣味は何ですか? - シンヤさん ( Hatena::Diary::Code-404 )

ひとつの趣味を深く追求する、ということはないですね。

  • 東京や大阪など、遠方への旅行やオフ会への参加
  • 県内ないし九州圏内への旅行がてらの友人とのドライブ
  • 近所の山道をサイクリング
  • トレーニングジムに通って体力作りおよびダイエット
  • 時々楽器を弾く ( 楽器の種類は内緒 )
  • 時々カラオケに行く
  • 趣味と言えるか分からないけど、いくつかのお店を廻って、じっくり選んで服を買うこと

こんなところです。 まだ書き漏れているものもあるかもしれませんが……。

ユニバーサル HTML/XHTML を持っているか

HTMLが詳しいようですけど、神崎正英さんの『ユニバーサルHTML/XHTML』は持っていますか? - yankee さん ( 自己改造Blog )

持っていないですね。 読んだ方が良いとは思っていますが、幸いこれまで目にしてきた HTML の解説本や解説サイトに良質なものが多かったので、ある程度正確な理解が出来ていると自負しています。

政党、新聞、宗教、学者

支持政党はどこですか? 購読新聞は何ですか? 信仰している宗教は何ですか? 好きな学者は誰ですか? - yankee さん ( 自己改造Blog )

政党として支持する所は無いですね。 政党政治の否定に繋がるかもしれませんが、どの政党も支持できる政策と支持できない政策が混在しているので、選挙の際はある種の妥協点を見つけて、投票する候補および政党をその都度決めています。

新聞は購読していないです。 いや一応家人が決めたものまで含めるのなら「購読している」ものはあるのですが、その選択に私の意思は含まれていませんので、回答は差し控えておきます。

これも「信仰している」宗教は無いという回答になりますね。 葬儀や法事等は浄土真宗に則って行っていますが、私自身に熱心な信心はありませんし、お正月には神社を巡ってお参りしていますし、 ( 本来の意味とはかけ離れつつあるとしても ) クリスマスを祝ったりもしています。

学者については、知っている名前がほとんど無いというのが実情ですね。 大学などで研究を行ったり論文を書いたりしているとそういった方々の業績に触れることもあるのでしょうが、仕事に就いた時期が早く、それ以降あまり勉強をすることをしなかったために、学問に関する造詣は浅薄なものです。

その他の「誰々だけど何か質問ある ? 」

何人かの方が興味を示してくれたので、気付いた範囲でメモしておきます。 また、プロフィール充実とはちょっと趣が違いますが、源流ということで結城浩のはてな日記 - ニュー速:結城浩だけど何か質問ある?にもリンクしておきます。

これもプロフィール充実とは違いますが、はてな ねるとん紅鯨団出演者だけど何か質問ある?http://blog.drecom.jp/excite/archive/1813に質問してください。質問はこちらでお願いします。有意義な質・・にて質問が募集され、ねるとん紅鯨団出演者だけど何か質問ある?-モテゼミねるとん紅鯨団出演者だけど何か質問ある?-2-モテゼミでその回答がなされている試みが面白いなあ。 はてなポイントで質問を集めるというのは、質問を効率的に集めるという面では良いかも。

リプライ

リプライはまだ送られていないか、管理者の承認待ち状態です。 この記事に対するご意見やご質問、ご感想などありましたら個別記事ページの送信フォームからお送り下さい。

プロフィールを拡充しよう

記事データ

投稿者

望月真琴

投稿日時

2006-01-06T22:10+09:00

タグ
概要

各個別記事から、「作成者について」へのリンクを行うようにしました。これを機に「真琴だけど何か質問ある ? 」と題してプロフィールの拡充を図ろうと思います。

リプライ

14 件のリプライがあります。

記事本文

Re: ねこめしにっき - これみよがしなプロフィールを希望

捕捉先がいわゆる信者系サイトの場合、「当サイトは XHTML1.1+CSS がウンタラでださいブラウザでは表示が崩れてカンタラですが意味構造は明確なのでホンダラ」とかのよくある信者な戯れ言を書いている暇はあっても、書いてる人の名前とかそういう大事な事を書く暇は無かったのかいな、と思うケースがやっぱりある。 信者的能書きも良いですが、その前にプロフィールを「これみよがし」に提示して欲しいのココロですよ、まったくもう。

この記述は別に hxxk.jp に向けて書かれたものではありませんが、内容には同意できるので反応してみましょう。 ちなみにこの記述を見た瞬間は、 「うわー私もこういったことを hxxk.jp についてに書いていた気がする ! 」 と心配したけど実際は書いていませんでした。

さて、 hxxk.jp の場合は各記事の冒頭に書いている「投稿者」の欄に「真琴」と記述していました。 ( 最初にさとみかんに捕捉された時はこのような記述ではなく、 address 要素にこのハンドルを書いていたような気がしますが、まあとりあえず body 要素内に明記していました。 ) これだけでもハンドルは認知していただけると思いますが、せっかくなのでこれを機にもう少し親切な記述にしておこうということで、その部分から作成者についてへのリンクを行うようにしました。 また、 address 要素にも同様の記述をするようにしました。

Movable Type の個別記事の投稿者名と、その紹介ページへのリンクをテンプレートタグで記述

ついでに、 Movable Type の個別記事において、投稿者名とその紹介ページへのリンクをテンプレートタグで記述する方法を紹介します。

<dl>
  <dt>投稿者</dt>
  <dd><a href="http://hxxk.jp/about/site#site-webmaster" title="作成者について">真琴</a></dd>
</dl>

このように、単純にリンクアンカーを直接記述しても良いのですが、後々の汎用性 ( 投稿者名や紹介ページの変更 ) を考慮したり、また通常ライセンスなどを使用して複数名による投稿を行ったりする場合は直接記述では不都合が起きてしまいます。

<dl>
  <dt>投稿者</dt>
  <dd><a href="<$MTEntryAuthorURL$>" title="作成者について"><$MTEntryAuthorDisplayName$></a></dd>
</dl>

そこで、このようにテンプレートタグで記述することで、テンプレートに汎用性を持たせることができます。 ( 投稿者名や紹介ページの変更は直接記述でも書き換えで対応できますが、複数名の投稿の場合は直接記述では対応できません。 )

  1.  「メインメニュー」→「投稿者」からログイン名をクリック
  2.  「表示名」と「ウェブサイトURL」を書き換えることでそれぞれ <$MTEntryAuthorDisplayName$><$MTEntryAuthorURL$> に反映されます。

真琴だけど何か質問ある ?

真琴というハンドルを使って活動しています。 本名ではありませんが、ある程度関係しているかもしれませんし、全くの別名かもしれません。 web 関連の知識はそう豊富ではなく、その範囲内であれこれ解決しようとします。 少ない労力で望み通りの結果を得ることもあれば、逆にやたらと遠回りをすることも。

Movable Type のことや web のことを主に書くので、パーソナリティを前面に打ち出す必要はないかなあと思っています。 どうしても気になる方は、比較的日記寄りな記事を見てあれこれ推測してください。

さて、前々項で作成者についてへのリンクを付けたと自慢げに報告していますが、肝心のリンク先の内容――この引用した部分が、この項を書いている時点での「作成者について」の全てなのですが、内容としていまいち乏しいなと思いました。 そもそも当初はプロフィールを積極的に書こうとは考えていなかったので、当然と言えば当然なのですけれども。

そこで これみよがし にプロフィールを拡充しようと思いましたが何を書けば良いか分からないし、書かなくても良い所まで書きたくはない、個人WEBサイト文化研究所 ~本当に訪問者が知りたい20の質問のようなものに答えるという手もありますがそれって本当に hxxk.jp の訪問者が知りたいことなのでしょうか ?

それなら hxxk.jp の訪問者に何を知りたいかを尋ねて、それについて答えていけば効果的なプロフィールの拡充を行えるじゃないか ! ということにしました。 結城浩のはてな日記 - ニュー速:結城浩だけど何か質問ある?の二番煎じじゃないかとか言わない。

真琴だけど何か質問ある ? のルールというか Q&A のようなもの

どこに書けば有効な質問 ?
  • この記事のコメント投稿フォームから寄せられた質問に対してのみ答えます。質問以外のコメントやこれ自体についての質問との区別を付けるために、【プロフィール質問】という文字列をコメントの冒頭に書いてください。
  • はてなブックマークdel.icio.us などのコメント欄に質問を書かれてもスルーしますっていうかそもそも気付かない可能性があります。
  • この記事以外のコメント欄、およびトラックバックにて質問を寄せられてもお答えできません。
何を聞いても良いの ?
  • 個人が特定されない範囲であれば答えたいと思っています。
  • 答えられない類のものであっても、この記事のコメント欄に書かれたものであれば、はぐらかしたり「それはお答えできません」といった回答をしたりと、何らかのアクションはします。
回答はどこに掲載されるの ?
いつまで質問を募集するの ?
  • プロフィールの拡充が目的なので、特に期限は設けません。無いとは思いますが、処理しきれないほどに質問が集まったら考えます。
その他不明な点があれば
  • 【プロフィール質問】という文字列をコメントの冒頭に書かずに、この記事に対してコメントしてください。

リプライ

14 件のリプライが送られています。 この記事に対するご意見やご質問、ご感想などありましたら個別記事ページの送信フォームからお送り下さい。

2006-01-06T23:26+09:00 - asiamoth

【プロフィール質問】 ぜひ、「記事を書くときに使っているエディタ」について書いて欲しいです(「weblog に関すること」辺り?)。 いまも下記リンクの手順で更新されているのでしょうか? http://hxxk.jp/2004/10/16/0507 自分が愛用しているエディタ、Xyzzyで真似した時期がありましたが、面倒なので、いまはMarkdownを使っています。

2006-01-07T18:30+09:00 - 真琴

【プロフィール回答】 http://hxxk.jp/2006/01/10/0055#qa-20060106232600 にて回答しました。

2006-01-07T23:11+09:00 - シンヤ

【プロフィール質問】 ウェブやビール関係以外ではあまり趣味が見える記事がないので、これら以外の趣味は何ですか?

2006-01-08T22:17+09:00 - yankee

【プロフィール質問】 HTMLが詳しいようですけど、神崎正英さんの『ユニバーサルHTML/XHTML』は持っていますか?

2006-01-08T22:22+09:00 - yankee

【プロフィール質問】 支持政党はどこですか? 購読新聞は何ですか? 信仰している宗教は何ですか? 好きな学者は誰ですか?

2006-01-09T07:14+09:00 - ありみかさとみだけど何か質問ある? < ねこめしにっき

ほほ。面白い試みだなー。ぼくもやってみよう。

2006-01-09T23:19+09:00 - FOAF を拡張して質問と回答を表現 < Black Box

「回答者が質問に回答する」「質問者が質問を出す」という情報を RDF を使って表し、それぞれの FOAF に追記するための語彙を考えてみました。

2006-01-10T01:02+09:00 - 真琴

【プロフィール回答】 > シンヤさん http://hxxk.jp/2006/01/10/0055#qa-20060107231100 にて回答しました。

2006-01-10T01:04+09:00 - 真琴

【プロフィール回答】 >yankee さん http://hxxk.jp/2006/01/10/0055#qa-20060108221700 および http://hxxk.jp/2006/01/10/0055#qa-20060108222200 にて回答しました。

2006-01-12T06:51+09:00 - ちはや(智猫)

今回のこの話題がまとまったら、サイト説明と運営者プロフィールを分離して頂けることを希望しまっす。 そう言えば、初めて辿り着いたWebサイト/Blog/Weblog/ブログではサイト説明や運営者プロフィールが有ると嬉しいってのをコメントしたことがありますが、うちのとこのサイト説明は検索エンジンで変な情報を探しているヒトを釣る為に書いてある文章に釣られるヒトばかりで普通に読まれることが少ないようです(>_<) ……長くなりすぎてるのでページ分割を考慮中(作業が面倒くさい……) 運営者紹介は故意に検索エンジンへのインデックスを拒否しているせいもあり、ほとんど読まれることもないような…… ……ろくな事書いてませんけど……

2006-01-12T06:58+09:00 - ちはや(智猫)

触れて良い話題かどうか判らないですが、オフ会ネタの最寄駅の話題や、うちんとこへ来ていただいたログによると真琴さんは福岡/北九州方面なんですね。 マズくなければその辺も書いておくとか。 うちはマズいので書いてません(自分の住んでる地方だけで寄り固まったり、逆に他の地方と言うか首都圏ユーザーが自分たちだけで寄り固まって配慮しないと言うことが多かったので) これまずかったらごにょごにょしといてください。

2006-01-13T03:40+09:00 - iwaim

Re: http://hxxk.jp/2006/01/10/0055#qa-20060108221700 仕様書読まないの?

2006-01-15T21:19+09:00 - 真琴

> ちはや(智猫) さん >サイト説明と運営者プロフィールを分離 分離することは今のところ考えていませんねえ。細分化してしまうと不親切な気がして。 ( FOAF の方に書く可能性はありますが ) サイト説明に書く ( = 私が自発的に提供しようと思う ) 分と、 Q&A に書く ( = 訪問者が知りたいと思う ) 分は別と考えていますので、 Q&A のものをそのまま書くこともないと思います。 リモートホストに堂々と福岡と出ていますねえ。それを失念して、とある IRC チャンネルで「福岡の方ですね」「な、何で分かるんですか」というやり取りをしたことがありますw で、福岡在住ってのはそれだけでは個人は特定できないと思いますし、隠すことでもないかなあと思っていますが、ほとんどの記事は特段居住地域に関係ないことですので、明記はしていません。関係しそうな記事の時にそれとなく書いておけばいいかなあ、程度の認識です。 首都圏の人が固まりやすいというのはありますねえ、ここじゃなくて IRC の方ですが。悔しいのでたまに乗り込んでいっているのがオフネタになっていますw

2006-01-15T21:24+09:00 - 真琴

>iwaim さん 仕様書は読んでいて当たり前なので、わざわざ明記することはないかなあと。 嘘です本当は書き忘れていました orz

ひとつの作品のためだけの購読

記事データ

投稿者

望月真琴

投稿日時

2006-01-05T21:17+09:00

タグ
概要

以前書いた次会予告を差し置いて、少女ファイトという作品について熱く自分語り。

リプライ

リプライはまだありません。

記事本文

次会予告が次会予告になっていないなあ

現地報告と次回予告で予告している積みネタに全く進展が見られません。 予告していなかった今更過ぎるオフレポは書いたんですけどねえ。 そのうちがんばります。

次会予告をぶっちぎってしまうネタ

文章量が短くて済みそうなネタが見つかるとそっちを先に書いてしまうのが悪い癖なのです、と言い訳。 今回のそういう短文ネタはただのにっき(2005-12-31) のコメント欄。 ただただしさん ( ただのにっき ) もヨヲコフリークだったとは !

# ykato (2006-01-03(火) 19:24)

えー、せっかく日本橋ヨヲコさんの連載が始まったのに > イブニング

# ただただし (2006-01-03(火) 22:13)

確かに「少女ファイト」は期待大なんだけど、他に読む気のしない作品が多すぎてねぇ……

昨日、その新連載のためにイブニングを買い求めに行って、まだその号が売られていなかったということがありました。 memo | 少女ファイト開始 今日発売のイブニング という記述からも分かる通り、件のイブニングの発売日は 2005 年 12 月 27 日。 年末年始は書店に立ち寄る機会が無く、そしてイブニングをこれまで購入したことが無く隔週刊の雑誌だということを知らない私は 「うわーもう次の号が発売されていて、売られていなかったらどうしよう ! 」 なんて杞憂をしていましたよ。 こういう時に九州は不利ですね……いや福岡市や北九州市などの北部九州の都市部はもう少し早いのかもしれませんが。

もうすぐ自宅での雑事が終わりそうなので、夜のドライブも兼ねて今日もまた書店に行ってみようと思います。 もし今日並んでいれば、 「たった 1 つの連載のために購読する雑誌」 が 2 つ目になることになります。 ちなみにもう 1 つは幼馴染みの友人が連載を持っている某月刊誌。 いつの間にか月刊連載を持つレベルになっていたんだなあ。

リプライ

リプライはまだ送られていないか、管理者の承認待ち状態です。 この記事に対するご意見やご質問、ご感想などありましたら個別記事ページの送信フォームからお送り下さい。

Tour "7" - Without You the Report "順列都市 - D.O.D(DRINK OR DIE)"

記事データ

投稿者

望月真琴

投稿日時

2006-01-04T22:11+09:00

タグ
概要

東京 3 Days Off Tour の 2 日目後半レポート。

リプライ

3 件のリプライがあります。

記事本文

さらに間が空いたけれど 2 日目後半

Tour "7" - Without You the Report "順列都市 - hide MUSEUM" から更に間が空きまくりましたが続き。 2 日目前半のレポートがオフから 2 ヶ月後で、後半のレポートが更に 3 ヶ月後というのは流石に空きすぎだと思います。 例の如く自分および参加者用の記録なので、興味のある方だけどうぞ。

  1. セキュリティの祈願、いざ鎌倉
  2. D・D・R ! D・D・R !
  3. D・O・D ! D・O・D !
  4. Frigo#1
  5. Frigo#2
  6. メンバー紹介
  7. オフレポリンク

セキュリティの祈願、いざ鎌倉

hide MUSEUM を後にし、まだメインイヴェントまで間があるために鎌倉で一旦下車。 ここでるーしんさんと合流し、お勧めの甘味処に案内してもらいました。 非常に美味しいお汁粉だったのですが、普通滑らせるはずのない場面で手を滑らせてしまい、ちょっと零してしまったのが心残り……。 その後鶴岡八幡宮に赴き、セキュリティのご加護 ( 謎 ) をお祈りした後におみくじを引き、凶を引き当てる豪運を発揮。 それは豪運とはきっと呼ばない。

鎌倉駅に向かう途中に色々なお店を覗いたり、ちょっと買い食いをしたりしつつ雰囲気を満喫し、湘南新宿ラインにて一路新宿駅へ。 遊び疲れか車中では少しうとうと。

D・D・R ! D・D・R !

「酒入る前にいっちょ DDR でもやっか」組がいたので、新宿駅到着後に合流。 私は音ゲーの類はやらないので専らギャラリーに徹していましたが、みんなステップが軽快だなあ。 私はスリルドライブというレースゲーム (?) で電車に特攻したり、田んぼにロケットダイヴしたりと一人大騒ぎ。 ( ぴろたんが後ろで見ていたような気もする。 )

この時に初顔合わせとなったのが哀ちゃんしゅがたん。 2 人ともいかにもモテそうな風体が憎い !

それと、確かこの時にるりさんから航空券発券の時の可愛いお姉さんは UU のどっち似だったの ? と尋ねられた気がします。 結局は辻希美さんの方に似ていたことが発覚しました。 ( 伏線2 回収 )

D・O・D ! D・O・D !

東方見聞録 新宿東口 2 号店にてメインイヴェントのオフ会と称した飲食会。 仕事の関係などで少々の遅刻をした人も含めると、このイヴェントへの参加者は 23 名。 自己紹介の時から「 Pino です」や「ごぼうです ! 」といった小ネタや、「リアルシアトルから来ました ! 」といった風刺の利いたものがあり、限られた時間で大盛り上がり。

私はここで黒ビールのジョッキを 3 杯くらいいただきましたが、他の方はめいめいソフトドリンクだったりカクテルだったり焼酎だったりと、決してビーリングオンリーで無かったことだけは申し沿えておきます。

Frigo#1

1 次会終了後、それぞれの 2 次会へ向けて解散。 ( 1 次会の時点で 23 人という人数だったため、 2 次会は各自でと決めていたのです。 ) ここで仕事の都合で 2 次会から参加となっていた iMa さん姫さんが合流。

私は、 2 次会はるーしんさんに「都会に出てきたから ( 多少値が張っても ) 旨い酒を飲んでみたい」とお願いしていたので iMa さん達とは袂を分かつのですが、その前に 20041224 - 1224 はライブの数字にてチケットを譲っていた友人からお礼にと貰っていた JILS の会場配布のベストアルバムを渡すという一大イヴェント ( 伏線 5 ) が。 ( 私自身は通販で購入していたのでダブっていたんですよね。 そこで、次に会う時に渡そうということにしていたのです。 )

その後各々別れたのですが、実はその時るーしんさんはまだまだ原稿が終わっていないという事実が ! お昼の鎌倉と 1 次会も何とか時間を作ってくれていたようで、 2 次会は予定を変更していわいさんお勧めの Frigo というビアカフェに連れて行ってもらうことになりました。

1 杯目は常々いわいさんが飲んでいることで気になっていた、ヒューガルデン ホワイトの樽生をいただきました。 実はこの時初めて飲んだのですが、その美味しさに惹かれて後日早速購入して飲んでみるようになりました。

2 杯目はゲストビールをいただいたのですが、どんな銘柄だったのか覚えていません、残念……。

Frigo#2

Frigo でしばらく過ごしていると、別の場所での 2 次会に参加していた iMa さんと姫さんと哀ちゃんから、 Frigo に向かうんで 3 次会と行きましょうという連絡がありました。 この誘いに乗らない手は無く ( と言ってもこちらはただ座して待つのみですが ) 、そのまま雪崩的に 3 次会突入。

色々な話に花を咲かせたのはもちろんのこと、 CD を譲ってくれた友人と iMa さん達の趣味が近いということで、まず姫さんの許可を得てその日の服を写メール。 友人の反応が良かったので、そのまま電話してみたりもしました。 ( 伏線5 回収 )

私は夜に強い方じゃなく、電話の後あたりからこっくりこっくりとなっていたため、「起きろー、閉店時間だよー」という声に起こされて慌てて Frigo を後にしました。 一人だけ方向が違うのと、 限界そうだった と評されるほど眠かったため、タクシーに乗って高円寺のホテルまで帰還。 少々距離があったので寝ていたかったのだけど、タクシーの運転手さんが話好きな方のようで、ずっと話しかけてくるので寝られませんでした。 まあ「うっさかやん、眠かけん寝ときたいったい ! ( 方言 ) 」と言ってしまえば良いんでしょうけど、ついつい話に付き合ってしまうんですよねえ……。

メンバー紹介

るーしんさん

神慮の機械 -MACHINA EX DEO- のヴァンパイアさん。 甘味好きでお酒に詳しい。 ご案内いただいたお汁粉は非常に美味しゅうございました、次の機会にはお酒を是非 :)

ぴろたん

outsider reflex の通称ピノたん。 いや今回も私が名札作って持って行っていたんですが、 Piro の文字が Pino に書き換わっているプチイリュージョンが !

哀ちゃん

Black Box の哀さん。 細くてスラっとしていて、でも笑顔も素敵なナイスガイ。

はるばるリアルシアトルからの参加。 ( 帰郷の時期にうまく合ったみたいです。 ) ちなみに対義語 (?) のバーチャルシアトルはこたせんせのことを指します。

しゅがたん

NULL::something の cho45(砂糖) さん。 きりっとした顔立ちで意思が強そうな印象の IKEMEN 。 そしてシチューライス ( 謎 ) 。

るりさん

peachypieces.net の瑠璃さん。 DDR のステップを軽快にこなす姿が印象的。 あと姫カットが可愛かったです。

iMa さん

iMax! の iMa さん。 今回のメンバーの中では最も長い付き合いでしょうか。 ( 実際に会ったことを判断基準とするならば。 ) 多くの面で趣味が合致する親友です。

姫さん

ぱんだちゃんねるの姫さん。 現在でも QVGA ぱんだちゃんは待ち受け画像の座に君臨中です。

いわいさん

None の iwaim さん。 今回も一次会の挨拶の時に鋭く突っ込まれました。 また、 Frigo へのご案内ありがとうございました。

kina さん

96*72 | kina_memo の kina さん。 色々と不備のあった私の段取りを陰日向からサポートしてくださいました。 本当にありがとうございました。

アサノさん

Mushline のアサノさん。 1 日目と違って飲食会でしか絡んでいないのがちと残念。

ごろごろ

Rails2u.com | 川o・-・)<2nd life のごぼうさん。 いや本当は gorou なんだけど、自己紹介でごぼうですて言ってたしなあ……。

オフレポ書きをもたもたしている内に、なんとはてなに転職していたという。

ジュンたそ

Web Café "Prelude" のジュンさん。 相変わらずの爆笑トークとスキンシップ ( 控えめな表現 ) は健在。

犬ねさん

犬神堂本舗 | /*inu-memo*/ の inugamix さん。 可愛らしい仕草と可愛らしい声は健在。

とぴん

Clovery leaf pieces のとぴあさん。 前半から引き続きの参戦。

かっぱさん

宏精堂 家門表具店の表具師かっぱさん。 Frigo もご一緒して、表具の世界の色々な話を聞かせていただきました。

ナルカミさん

飼い犬が手を噛むので 2006 のナルカミさん。 前半から引き続きの参戦。

けいたそ

M。の Kei さん。 にこにこしている印象というか、笑顔が素敵な人なのです。

ブタすん

トイレの落書きのアイドルブタすん。 ビーリング魂とスキンシップ魂は健在。

まきちゃん

底なし井戸の底の底のまきかずひこさん。 前半から引き続きの参戦。

ぼなせんせ

Regrets last - bonaim's diary の bonaim さん。 服薬していた関係で烏龍茶だったのが残念。 次は杯を酌み交わしましょう。

ふーみんさん

おさんぽさんぽの FUMING さん。 人数が結構いたので人酔い状態に とありましたが、大丈夫でしたでしょうか ? ( 半年も後になって聞くなと。 )

まゆにゃ

misuzilla.org の沢渡真雪さん。 今回はあまり絡めなかったなあ、残念。

慎吾

慎吾の慎吾さん。 ( 何 ) 今回は一次会から参加していただいたため、会話を交わすことができました、やった !

ゆきちさん

暇つぶしのページのゆきちさん。 ゆきちさんも Frigo までお付き合いいただきました。

リプライ

3 件のリプライが送られています。 この記事に対するご意見やご質問、ご感想などありましたら個別記事ページの送信フォームからお送り下さい。

2006-01-09T18:41+09:00 - iwaim

当時の記録(謎)から、ゲストビールは Siletz IPA だと判明しました。もちろん樽詰め。

2006-01-10T22:40+09:00 - 真琴

どうも情報ありがとうございます。 Siletz というアメリカのビールですね、メモメモ……。

2006-03-04T04:31+09:00 - [ビール][オフ] 2005-07-09 順列都市オフの記録。或いは終わりなきビーリング祭 < つれづれ

Jun さんの東京へ遊びにや、FUMINGさんの人酔いしたけど、楽しかった、真琴さんのTour ”7” - Without You the Report...

lang="2006" style !!

記事データ

投稿者

望月真琴

投稿日時

2006-01-01T16:23+09:00

タグ
概要

戌年、ということで新年の数日間限定スタイル。「画廊犬神堂 - プードル(Poo-Doll)」の画像を加工して使用しています。

リプライ

リプライはまだありません。

記事本文

今年も画廊犬神堂の画像を加工して使わせていただいています

lang="2005" style !! の時と同様に、画像をリサイズおよび色変換してお正月限定スタイルの素材とさせていただきました。

http://inu.imagines.jp/gallery/transform/poodoll20051223.jpg は、非営利目的に限り、転載、加工したものを加工物であることを明記して公開できます。 私(inugamix)の名を記載する必要はありません。 加工したものを私の許可を得ずに営利目的に用いることはできません。 トリミング、サイズ変更、色変換以上の加工をしたものを私の名で公開することはできません。 というライセンスとなっています。

仕事始めも 4 日につつがなく終わり、私のお正月は終わってしまいました。 さらば……そしてありがとうコラボスタイル。

リプライ

リプライはまだ送られていないか、管理者の承認待ち状態です。 この記事に対するご意見やご質問、ご感想などありましたら個別記事ページの送信フォームからお送り下さい。

ビール日記 2006/01/01 - デウス

記事データ

投稿者

望月真琴

投稿日時

2006-01-01T16:03+09:00

タグ
概要

デウスを飲みました。

リプライ

リプライはまだありません。

記事本文

Deus

  • デウス

ベルギーのゴールデンエールビール。 シャンパンのような醸造方法で作られたビールで、 750ml 瓶で約 3,000 円という高価なビールです。 いつ飲もういつ飲もうと思っていましたが、これから友人達で新年会をするので、それの手土産として持っていこうと思います。 アルコール度数は 11.5% で、 2 ~ 4 ℃くらいでしっかりと冷やさないと甘みが強すぎるとのこと。 どんな味なのか、楽しみでなりません。

ということで 2006 年最初の記事はやはりビールということで、飲んだ感想はまた後日追記します。 皆様、あけましておめでとうございます。 今年も hxxk.jp および真琴へのご愛顧をよろしくお願いいたします。

黄金色の液体と、細やかで真っ白な泡が印象的でした。 すっきりとした甘さがあって非常に美味しかったのですが、友人にはあまり好評ではありませんでした。 その分一人で存分に味わえたのですが。

リプライ

リプライはまだ送られていないか、管理者の承認待ち状態です。 この記事に対するご意見やご質問、ご感想などありましたら個別記事ページの送信フォームからお送り下さい。

補足情報

著作、講演、制作実績など