サイト構築の際、欠かせないツールのひとつといえば Firebug。JavaScript を使ったウェブアプリケーションのデバッグだけでなく、サイトデザインをしている方にとっても便利なツール。テストの際、レイアウトが崩れていたとしても Firebug で調べればだいたいのことは解決します。この Firebug のコンパニオンツールが Firescope です。 Firescope は、Firebug 内で CSS/HTML のタグの意味や使い方をチェック出来るツール。インストール後、Firebug のパネルに新たに「Reference」というタブが追加されます。HTMLビューや「調査」の際に選択したタグと下階層にあるタグの意味が Reference に表示されます。最新のブラウザだけですが、その場でサポート状況も見れるのは便利です。もっと詳しく知りたい方は提供元の Sitepoint のページへ誘導する仕組みになっています。 W3Cの仕様が頭に入っている方や、他に良いリファレンスツールがある方は必要ないかもしれませんが、あると便利かも・・・というツールが Firescope だと思います。パフォーマンスが落ちるということはなさそうなので、Firebug を使用している方はぜひ。

先週のセミナーで、ページ遷移ではなくデータがどのようにフローしていくのか想像しながらサイトデザインが必要になってくると話しました。近年、ページもしくはひとつのサイト内の情報設計だけでなく、ウェブ全体でその情報はどう扱われるのかという視点も加わったと思います。RSSやAPIはその始まりの段階だといっても良いでしょうし、こうしたセマンティックウェブ的な技術はブラウザの一部の機能として取り込まれたり、技術を意識することなく使えるようになってきています。 Microformatsは、徐々に広がりつつあるマークアップ方法ではありますが、具体的な実用例やツールが少ないということで制作者側も足踏みしている状態です。そんな中、先日マイクロソフトが Oomphというツールキットをリリースしました。そうです、Web Slice を作っているマクロソフトが Oomph です。 このツールキットは、IE用のプラグイン、hCard, hCalendar の HTML/CSS テンプレート、そしてページ内に Microformats があるとハイライトして他のサービスでそのままデータを利用出来るjQuery と組み合わせたツールがセットになっています。IE用のプラグインをインストール後、Microformats でマークアップされたページを表示すると、アイコンが点灯します。クリックすればページ内の Microformats し、地図を表示したりアドレス帳に追加するといった Firefox 用 Plug-in である Operator と近い動作をします。JavaScript で作られた摘出ツールは、IE用プラグインと同等の機能をページ上で行うもので、こちらのページでどのように使えるか見ることが出来ます。 Microformats のことを最初にセミナーで話したのは3年前でした。そのときから「これは広まるのか？」という質問をよく聞きますし、今でも変わらずあります。簡単とはいえマークアップにかかるコストがあるので、無料で出来るものでもありません。広まるか広まらないから「業界」という名のトップ層ではなく毎日マークアップしている制作者ひとりひとりにかかっています。Microformats そのものがボトムアップで仕様を作ったり啓蒙活動をしているのと同じことがいますね。 また Microformats は将来もっと「広まる」と思いますが「デファクト」という存在にはならないと思います。Web Slice を作っているマイクロソフトがあえて Microformats 用のツールを提供しているのを見ても分かる通り、これは最終的にひとつに集約されるというものでもないと思います。 サイトに訪れたい人もいれば、RSS技術を利用したアプリケーションやサービスを使って情報を観覧したい人もいます。ウェブの使い方、関わり方が多様化しているわけです。利用者がデータを使って何かしたい（例えばイベントをカレンダーにすぐに追加したい）ときに、そのサイトはワンクリックで出来るようにしているかどうかです。RSSもそうですが、Microformats は、インターフェイスで見える分かりやすいものでもなければ、「自己主張」するものでもありません。ただし、欲しいと思ったときにそこにあると便利なひとつのチャンネルだと思います。 利用者が「こうしたい」と思ったときに、サイトが提供出来ているかどうか。多様化されているウェブの利用方法に合わせて、サイトも多様なチャンネルが必要です。そのひとつとして Microformats は欠かせない存在だと思います。 Operator は、Microformats の可能性を示すひとつのショーケースであったように、Oomph も新たに加わった素晴らしいショーケースです。摘出するための JavaScript が記述されたページを見るだけでも価値アリです。

Webサイトの基本３要素のひとつである「Relationship」。ブログでは重要な部分ですし、例え企業サイトを構築する際にも重要な要素になっていきます（もちろんブログと同じ見せ方ではないですが）。ブログで最も簡単に関係を築く方法がコメントです。それぞれのエントリーにコメントフォームを置いて読者がいつでも感じたことを自由に書き込むことが出来るようにします。コメントを通じて筆者と読者の関係がより濃いものになるだけでなく、そのコメントを読む他の読者とも共感という間接的な繋がりをもつことが出来ます。 ひとつの窓口としてコメントは良い機能だと思いますが、不満点がないわけではありません。コメント数が長いと見た目が単調になり、読み難いという印象もありますし、多くの方に読んでもらうべき貴重な情報もコメントにあるがために読まれないというケースがあります。自分のサイトは自分が管理しているので気にはなりませんが、コメント数が多くページが延々と続くと読む気が失せることもあります。 貴重なコメントを読んでもらえるようにする 貴重なコメントをハイライトするひとつの方法として、Engadgetのような投票システムをコメントに導入というのがあります。ビジュアルには大きな変化はありませんが、ポジティブに投票されると「Highly Ranked」とラベルが付くので、それが貴重なコメントなのか読み流しながら見つけることが出来ます。 Engadget の手法をさらに押し進めているのが digg のコメントリスト。こちらでは投票によって評価が低いとコメントが非表示になりワンクリックしないと内容が読めないようになっています。Engadget のように読み流して自分で確認しなくても貴重なコメントだけが生き残るようになっているわけです。WordPress でも trollr! のようなプラグインを導入することで、似たようなコメントリストを作ることが出来ます。 こうした投票を利用して良いコメントを多くの方に読んでもらうという手法は悪くないですが、Engadget や digg のように大量のコメントが書き込まれる場で初めて有効な手段であって、それほど多くないブログではかえって投票システムの導入が隔たりになってしまうこともあります。そこで、多くの方に読んでもらいたいコメントは今のところ Follow up (追記)タイプとして書くことにしています。とはいうものの、別の方法でも貴重なコメントを読んでもらえるようにすることが出来たらなと考えています。 対話としてのコメント 先に挙げた Engadget や digg のコメントリストをよく見ると分かりますが、コメントはスレッドのようになっています。つまり、あるユーザーのコメントに対して返信が出来るようになっているわけです。WordPress でも Wordpress Thread Comment を使って実現することが出来ます。こうすることで、コメントが対話のように見えて来るだけでなく、見た目もアクセントが付くので多少読みやすく出来ます。 farfromfearless のように、各コメント下にある「Quote This Comment」をクリックすることで自動的にコメント欄に <blockquote> 付きの引用が記入されるというやり方もあります。このサイトではスレッド式にはしていませんが、ちょっとした機能が対話をしやすくする可能性を秘めているというひとつの例だと思います。今のところ、筆者である私がコメントをしてくれた方に対する返信しかないですが、こうした機能をつけることで読者同士によるコメントの機会を増やすのかもしれません。 コメント以外のコメント あと、最近の特徴がブログには書き込まないけど、ソーシャルブックマーク (SBM) にコメントを書き込んでいるというパターン。実は SBM に書かれているコメントがすごく良かったりするので、いつもどう読者と共有したら良いのか頭を悩ませている部分ではあります。ひとつの解決方法がNatalieのように複数のソーシャルツールのコメントをブログのコメントと同じように並べてしまうやりかた。SBMだけでなく Tumblr にも良いこと書いている方いるので、それも引っ張り出したいですが良い方法が見つかりません。 あとは Technorati をはじめとしたブログ検索から情報を引っ張って来るかですが、「コメント」として考えると単にリンクバックしているサイトを表示するのも違うかなと思います。では、トラックバックはどうかという意見もあると思いますが、個人的にどうもトラックバックは利用価値があるのかどうか分かっていません（以前の CMS でも導入していませんでしたが、わざとです）。トラックバックの表示もどうも納得がいかないですね。文章の途中で突然「・・・」と切れているし。それともトラックバックはやはり必要でしょうか？ 今回はコメントリストで考えられるパターンを幾つか紹介し、そこで考えられる課題も少し書きましたが、コメントについてまた深く掘り下げて行こうと思います。

タグや個別ページもあらかじめ実装されているので、プラグインがなくてもそれなりに良い感じのサイトを作ることが出来る WordPress ですが、それでもやっぱりプラグインがあると便利です。サイトのコンセプトによって今後プラグインを増やしたり PHP を書き込むといった作業が発生すると思いますが、greenhugでも使っているプラグインを紹介したいと思います。 wp-cache WordPress はダイナミックにページを生成するので再構築する手間がないですが、サーバーへの負担が大きくなります。このプラグインでキャッシュページを作り、表示速度を上げています。 Gravatar コメントに自分のカスタムアイコンを表示させることが出来るようになります。Gravatar の登録に関しては lomoさんのエントリーが参考になります。 Chunk Urls for WordPress コメントに書き込まれた長い URL を自動的に短くしてくれます。 Simple Tag 2.3 から実装されたタグ機能ですが、今のところ管理機能がありません。このプラグインを入れておけばタグの管理も多少楽になります。 Disable WPAUTOP <div>を<p>に自動変換したり、コードを入れてないのに<p>が入る機能を無効にするプラグイン。コードの自動挿入は初心者にはナイスな機能ですが、可能な限り自由にコードが書きたいという方はこのプラグインは必須。 WP Multibyte Patch マルチバイト関連の問題をいろいろ解決してくれるプラグイン。日本語で WordPress をするなら入れておきたいですね。