※ブログ移転しました。 → hamashun.me
Back To Blog Top2007年06月 | Back To Blog Top » | 2007年08月 »
僕もnowaで一度経験していて、さっき斜め前の人も普通のBlogでハマっていたので、情報共有の意味も込めてエントリ。
Blogだけに限った話ではないんですけど、CGMサービスを作る時には、デフォルトスタイルシートのリセットには気をつけた方が良いです。
* {
margin: 0;
padding: 0;
font-size: 100%;
font-style: normal;
font-weight: normal;
text-decoration: none;
}
いつもの習慣とかでこんな指定にしてしまうと、ユーザーが<small>要素や<u>要素を使った場合に不都合が起きます（この辺の要素の是非はここでは置いといて）。
とは言えもちろん、要素セレクタを使って指定しなおせば問題ありません。
その際はul要素のmarginが意外と盲点なので、気をつけたい所です。
開催まで1週間ちょいとなったWeb標準の日々ですが、いよいよセッション登録が開始されました。
追記：ここで登録URLを掲載していましたが、事情により削除しました。 アドレスはＷｅｂ標準の日々からのメールを参照してください。
それと、会場周辺の簡単な地図も公開されているので、土地勘の無い人は事前にチェックしておくと当日になって慌てなくて済みます。
関係ないですけど、最近はアキバの周りに飲食店増えましたよね。 打ち上げの店には困らなそう。
Fastladder関連の記事を集めてみました。 多すぎて挫折。
Web標準XHTML+CSSデザイン クリエイターが身につけておくべき新・100の法則。
先日発売になった、巷で噂の「デジパ本」こと【クリエイターが身につけておくべき新・100の法則。】を、CSS HappyLifeの平澤さんから献本頂きました！
ありがとうございますありがとうございます今度お礼させてください！
という訳で、はりきって書評させて頂きます。 馴れ合いは無しでいくます！
表紙はシンプルな感じです。 書店に並んだ時に、平積みでも棚でもインパクトに欠けるかも、とか思いました。
あと、技術書って立ち読みされる事が前提だと思うんですけど、立ち読み後に戻された本って、帯がズリ上がっている事が多いじゃないですか。
タイトルは、その辺も考慮した位置にしたらいいと思いました（今のだと、ちょうど隠れちゃう位置なんですよね）。 って凄い偉そうな事言ってますね何様ですか俺様。
対して中表紙というか、章と章の間の扉部分のデザインは超好みです。 一つの色をガーッとベタ塗りしている感じで、シンプルでありながらダイナミックな所が大好きです。
記事部分は全体的にシンプルな構成で、一冊を通して統一され安定して読む事ができます。
本文の背景色がグレーになっているんですけど、僕はエディタの背景色をグレーにしているので、感覚的に非常に読みやすかったです。
本文で解説しきれない部分は、その平行位置に補足があります。
これって結構大事だと思っていて、項目の最後に補足があるタイプだと、視線の移動が大きくて疲れちゃうんですよね。
まあ、僕に理解力が乏しくて、何度も確認するからかもしれませんけれど。
ソース部分は、一行ごとに罫線が入っていたり重要な部分には色付けがしてあったりと、見せ方としてはかなり見やすいです。
とは言え、見開きの全てがソースというページは、やはり読む気がおきません（ただし、そこまでゴツいのは1か所だけ）。
そういえば、データの公開はあるんでしょうか。 長いソースの物だけでも、あると嬉しいですね。
あと、全体的にWebサイトっぽいデザインだと感じました。 マークアップしたくなるのは職業病でしょうかｗ
大きく分けると、仕様的な内容と具体的な技術Tipsな内容に分かれています。
ここ最近のBlog界隈で話題になった事（パンくずリストとか、CSSの記述ガイドラインとか、エラスティックレイアウトとか）が盛りだくさんで、その辺りの再確認としても使えます。
この本は、前書きで対象と明言している、初級者から中級者にとって非常に有用な本です。
僕が辿ってきた成長フローを振り返ってみると、「仕様を知らずに、個別のTipsを集めて勉強していた時期」があります。
動きとして「コレをこうすると、そういう結果になる」という事は知っていても、それが何故そうなるのかは知らない、みたいな。
ある程度のコーディングができるようになった段階（例えば段組が組めるくらい）で「仕様」や「文書」という概念を知っておく事が、とても大事だと思っています。
文書型宣言とは何なのか。 idとclassの違いは何なのか。 そういった事は、理解できるレベルになったら、なるべく早く理解しておいた方が良いですから。
そうでなければ、好ましくない技術、知識のまま成長してしまい、それを矯正するのはどんどん大変になってしまいます。
この本は、熟読して記憶するよりは、机のそばに常備して、調べたい事があったら目次や索引を見る、という使い方が適していると思います。
そうして本の側面が手垢で黒くなる頃には、きっと、かなりレベルアップしているはずです。
読み返してみたら、殆ど褒めていたという現実。 いや私情は挟んでないっす。
公式サポートサイトがオープンしていました！
ソースのダウンロードなどもこちらでできます。
超長いんでショートカットメニュー作りました。
あと、JavaScriptの素人が書いてます。 あちこち間違ってたらごめんなさい。
Twitter関連でお世話になっているukstudioが、初心者向けJavaScript勉強会を主催してくれたので、モリモリ勉強してきました！
会場は株式会社ノッキングオン様に提供して頂きました。 ありがとうございます！
僕は行ってなかったんですけど、モバイル勉強会の時もお世話になったそうです。
資料公開（補足も必見）
トップバッターのUKは、JavaScriptの基本をざっくりと語ってくれました。
入門書に書いてあるような内容が中心でしたけど、疑問に思った事をすぐに聞けるという環境は良かったです。
赤い髪の人の適切なツッコ・・・補足もありましたし！
変数を定義する時にvarを付けたりと付けなかったりなのは、ちゃんと意味があったらしい。
関数のなかでvarを付けて定義すると、その変数はその関数内でのみ使える変数（ローカル変数）になる。
関数の中でvarを付けずに定義すると、それは関数の外でも使える変数（グローバル変数）になる。
var a = 1;
function hoge () {
a = 2;
}functionの中のaはグローバル変数なので、最初のaに代入された1は上書きされる。
var a = 1;
function(){
var a = 2;
}functionの中のaはローカル変数なので、最初のaに代入された1はそのまま。
ごめん、よくわからなかった！
後半の_tad_さんの説明がフォローしてくれているので、そちらをどぞー。
ノードとは、HTMLで言うところの要素みたいな感じ。
<a href="index.html">Top</a>
この場合、<a>が要素ノード、href="index.html"が属性ノード（属性と値の両方を含めるぽい？）、Topがテキストノードとなる。
もちろん、属性ノードは属性の数によって増える。
IE様は改行（br要素ではなく、単なる改行）もノードとしてしまうらしく、ノードの数がブラウザによって違う、という事態になるとか。
まったくもうこれだからＩ（ｒｙ
YUIを語って貰うならこの人しかいないッ！ 紫色の何かをたずさえ来てくれた―――!!! （いや今日は無かったけど）
という訳で、HolyGrailさんが初心者向けに解説をしてくれました。
ちなみに、プレゼン終了直後に資料を公開されていました。 早すぎですｗ
多分、他のライブラリにも共通する事だと思うんですけど、ライブラリを用意さえすれば、後はそれを使うタイミングなどを指定するだけで良いみたい。
マークアップエンジニア向けに説明すると、CSSファイルのコンポーネント化の感覚に近い物があるかも？（それの是非はここではともかく）
あと、今回の資料のCSS部分は、Holyさんの後輩のマークアップエンジニアさんが担当されたそうです。
後輩さんとは、本当ならこの前お会いできるはずだったんですけど、事情により流れてしまいました。
近い内にお会いしたいと思いまくりです。
makotokagaさんは、少し前から話題になっている、Google Gearsに関する事を喋ってくれました。
・・・んですけど、すみません！ ぶっちゃけ僕には難しすぎました！
理解できた事と言えば
という事くらいでした。 ううーん、すみません精進します。
moさんのプレゼンは凄かったです。
何が凄いって、終わった後のマークアッパー・デザイナー達の目の輝きとでもいいますか。
いったい何が彼らをそうさせたのでしょうか。
moさんのプレゼンはJSの使いどころという事で、「JavaScriptの使い道はWebだけじゃないんだよ」という事を語ってくれました。
SBMやtumblrでおなじみのブックマークレット。 これはJavaScriptで作る事ができる。
どうやら割と簡単に作れそうな感じ。
Firefoxの拡張機能を作るには、XUL(ズール)という、XMLベースの言語とJavaScriptを使う。
簡単に言うと、DOMをJavaScriptで操作するように、XULをJavaScriptで操作するんだとか。
これも手を出してみたい・・・！
ActionScriptからJavaScriptを、またその逆を呼び出す事ができる。
リッチなインターフェイスのアプリケーションを作れる！（すみませんここ聞き漏らしました）
これが凄かった！ 特にPhotoshopの拡張機能が紹介された瞬間に、マークアッパーとデザイナーは今までの苦労が走馬灯のように流れた事間違いなし。
moさんが今回紹介してくれた拡張機能は、『psdファイルからhtml要素やhead部分など最低限の構成と、素のテキストを吐き出してくれる』という物。
つまり、psdファイルからテキストをコピペする必要が無くなる訳で。
いやもう本当に、プレゼンが終わってから、一斉にみんなが同じ質問をしたのには笑いましたｗ（公開はしてくれるんですか？みたいな）
JavaScriptで作ったTwitterクライアントを紹介。
多分、見た目部分はCSSなんかを使っているのかな。 その辺り、なんだかAIRとも共通する便利さがあるのかも。
なんだか、Adobe製品のスクリプトには、まだまだ面白く便利にできる余地がある気がします。
エンジニアさん達が余り使わない分野だから（？）余計に未開拓なのかも。
_tad_さんがやってくれたのは、ほぼ真っ白なメモ帳を用意して、ライブに書き込んでいくというliveプレゼン！
いやあこの発想は無かったですわ。
内容は、プログラミングの基礎の基礎、みたいな感じでした。
キーワードは「めどい」。
なにせ「めんどい」とタイプするのすら「めどい」くらい！
プログラムっていうのは、基本的にこんな事を書いていく。 例えば次のコードなら、
if(uk == "20") {
while(n <= 20) {
document.write("hogehoge");
n++;
}
}
もし、ukと文字列20が等しければ（条件を見る）、
nが20になるまで文字列hogehogeを出力する（繰り返す）
となる。 順番にやるっていうのは、上から順に降りてくる事（・・だったはず）。
実はめどくない。
考え方としては、「ナイフは野菜に使うと便利だけど、人に使うのはNG。 じゃあナイフは人に使えないようにしよう」という物。
JavaScriptで考えると、「機能によって、使える場所を制限しておこう」という感じ？
つまり、覚える事は少なくて済む（制限によって区切られた物ごとに覚えれば良い？）
ライブラリとは、図書館のような物。
司書（エンジニア）さんはその本の種類（そのライブラリは何なのか）を知っておけばよくて、本の内容（コードの内容）までを全て熟知しておく必要は無い（知っておくに越した事はないだろうけど）。
また、既に世界各所で使われているので、不具合がおきづらい。
バグがあっても、報告をすれば直してくれる（事が期待できる）。
また、ライブラリのコードは生きた見本である。
まずは実際に使ってみて、動きなどを体験してからコードを読むと、理解が深まる。
CSSのcommon.cssは、ローカル性が強い。
対してJavaScriptのcommon.jsは、グローバル性が強い。 との事。
これは使いまわしがしやすいか否か、という意味。
（まあ、CSSはHTMLによって変わってくるので、結局は文書次第になってしまうと思います）
赤い髪の人、Yoshioriさんのプレゼンは、グリモンに関する事です。
多分GreaseMonkeyだから「猿でもわかる」なんだと思うんですけど、誰もツッコめませんでした。
Yoshioriさんのプレゼンは、また強烈でした。
スターウォーズのライトセイバーをポインター代わりに進行をするんですけど、ご本人のキャラもあいまって、爆笑しながらも理解しやすい内容になりました。
// ==UserScript==
// @name hamashunGreaseMonkey20070714
// @namespace http://www.hamashun.com
// @include http://auth.livedoor.com/*
// @version 1.0
// ==/UserScript==冒頭に書くのは大体こんな感じで、あとはJavaScriptで書いていくだけのよう。
a = 5 + "3";
b = 5 * "3";それぞれ、変数にはどんな値が代入されるのか？
答えはaが53で、bが15。
aは普通にそのまんまなので割愛。
5 * "3"は、数値と文字列は掛け算できないので、いい感じに判断して数値同士として扱ってくれる。
var a = 10/3;ではこれは、どんな値がaに代入されるのか？
答えは3.3333333333333335
他の言語では小数点以下は扱わない事が殆どらしい。
JavaScriptは整数型を持っていないので、このようになるんだとか。
ちなみに、3.3333333333333335に3を掛け算すると、空気を読んで10としてくれる。
var a = new array;
a[1.5] = "foo";
alert[1.5];小数点を解するという事は、配列に小数点以下の数値を指定する事もできる。
alert(2 & 3 == 1);
（この辺りからかなり難しくなってきて、メモったコードも怪しくなってきます）
この結果出力される値は？
答えは「0」
&演算子と==演算子だと==演算子の方が優先されるので、まず 3 == 1 でfalseが返る。
falseは0として扱われるので、 2 & 0 という事になる。
&演算子はビット演算子と言って、ビット（0と1）の世界として比較する。
その結果により、0が出力される。
なお、出力された0はビットの世界の0（つまりfalse）ではなく、 3 == 1 の結果の0である。
他にもいくつかの問題があったんですけど、メモがうまく取れていなかったり、再現ができなかったりで断念しました。
きっと他の誰かが書いてくれるはず・・・！
sendさんのプレゼンは、Firebugについてでした。
コンソールのをちゃんと消さないとだめだよ！ って内容でした。
時間がかなり押せ押せだったので、ぜひ、今度また聞いてみたいと思いました。
追記
Firebugの話だけという訳ではありません。 誤解を生むような書き方ですみませんでした。
sendさんがご自身のBlogで記事を公開されています。 ありがとうございます！
ものっそい楽しかったです。 質問しまくってしまいました。
最近、自分の中でJavaScriptとかDOMへの関心が高まってきているのもあって、タイミングも良かったです。
ユーザーCSSを作っていて感じたんですけど、何かを作るのって凄く楽しいです。
まずは何か、超簡単なグリモンかブックマークレットに挑戦してみたいです。
元々、この勉強会はUKが「社内勉強会でJavaScriptについて喋る事になった～」的な事をつぶやいたのがきっかけでした。
「じゃあTwitterでもやろうぜ！」と誰かが言い出して、あれよあれよと言う間に30人もの参加者が集まっていました。
会場探しやら色々な準備やらで大変だったと思うけれど、おかげでとても勉強になりました。 ありがとうUK！ お疲れ様！
あ、次回も楽しみにしてるから！
2007-07-12 スキーマトロン（の補足）に追記・及び誤字・ソース（ショートカット効いてない問題）修正
途中からだったので、全ては聞けませんでしたけど難しい内容でした。
現時点では、一般の製作者というよりはマニア向け 。
内容は、W3Cで活動されていた石川さんが、自身が策定に関わった仕様などについて語ってくれるというもの。
将来的にXHTMLは複数のマークアップ言語を一緒に使える（SVGやMathMLとか）という話を中心に、スキーマとかW3C裏話なんかも。
石川さんは「仕様」について深く関わってきた人なので、その辺りを意識しながら読むといいかもです。
最後のオマケには、懇親会でのちょい話もあります。
あと、僕にとって多分に未知の領域なので、間違っている部分もあるかと思います。
誤りを発見されましたら、ご指摘頂けますと嬉しいです。
部屋に入ったと同時に終わったので、他の人のまとめに期待。
『XHTMLならXMLとして扱って欲しい』と言っていた。
なお、メモ用紙とかを用意しながら聞いてたので、一部完全ではないかも。
複合文書には、2種類の方法がある。
一つは、現在の感覚と近い方法で、object要素などで外部リソースを参照するという物。
もう一つは同じXHTMLファイル内に埋め込む事で実現する方法。
これは説明するより例の方がわかりやすいので、XML 複合文書の可能性と課題に載っているXHTML と MathML と SVG の混在例を見るとよい。
ソースを見ると、XHTMLの中に
<math xmlns="http://www.w3.org/1998/Math/MathML"> ～ </math>
<svg:svg xmlns:svg="http://www.w3.org/2000/svg"
width="8cm" height="8cm" viewBox="0 0 100 100"> ～ </svg:svg>
こんな感じの記述がある。 xmlns属性で名前空間を指定する事で、その中に異なる文書を記述している。
前述の方法よりこちらが理想。
ちなみに、この例のDTDを見てみると、超長くて眩暈がする（15.000行を超える！ ちなみにXHTML1.0 Transitional は1.200行）。
これはXHTMLとSVGとMathMLのそれぞれの組み合わせを書いているから。
3通りだけでもコレなのに、（他の言語もあわせると？）全部で23通りの組み合わせがある。
『本気でやりたいなら、俺の屍を超えて行け！』との事。
よく「XHTML2はあれが足りない。これが足りない」という声が上がるが、XHTML2は複合文書の土台になるようにしてある。 言うなればプレーン・ピザ。
なので、単体で見てアレコレ考えるのは違う。 また、HTML5と単純に比較するのも、石川さん個人の考えでは「違う」
例えば、XHTMLでのa要素とSVGでのa要素を、複合文書にただ書いただけでは、どちらがどちらかが解らない。
なので、名前空間を指定してやる必要がある。
『名前空間』は、複合文書では必須である。
ちなみに、名前空間を指定しても、DOMとしては持っている。
（複合文書は複数の文書を集めたのではなく、一つの文書内に複数の文書がある、という意味？）
@namespaceで名前空間を指定する必要がある。
XHTMLから属性のみを抜き出して、アドレスバーにペーストする。
OperaではStyleが適用されたりする（これがスクリーンから遠くてよく見えませんでした。 他の方のまとめに期待）。
DTDの拡張は考えない方がよい（マニアの領域）。
編集で使いやすくする程度に。
例えば、DTDを読んで入力補完をしてくれるエディタで、onclick属性なんかが出てくるのがウザイ場合。
スキーマを読み書きできるエディタを使って、該当の箇所を上書きなりで修正する（多分、一時的に行う事だと思います）。
2007-07-18 追記
コメント欄でiwaimさんと石川さんに補足して頂けました。 ありがとうございます！
Web標準の日々終了後の懇親会で、石川さんとiwaimさん達と膝突合せトークをする機会に恵まれました。
何でも現在、石川さんは後任を探しているんだとか（もちろん、いきなり全部を引き継ぐという訳じゃなくて、最初はお手伝いみたいのから）。
石川さんが危惧しているのは、後任が日本人以外になってしまって、日本人とW3Cとの結びつきが益々薄くなってしまう事だそうです。 我こそはと思う方は、石川さんに熱意を伝えてみてはいかがでしょうか。
あ、ただ、世界中から総叩きにあっても大丈夫なくらいの精神力が必要だそうです。
構造と表現が分けられている事が、Web標準の基礎。
と言うと「視覚表現と構造の分離」と思いがちだが、その考え方は聴覚表現や触覚表現でも必要。
例えば、強調を表現するにはCSSで文字色を赤にしたり太字にしたりするが、それだけでは聴覚的や触覚的には強調されていない。（相当する表現は声を大きくするとか、音程を変えるとか、解説を付けるとか？ 現段階の機能で可能かどうかは別で）。
音声ブラウザは「ブラウザ」。 スクリーンリーダーはPCの操作など全般を支援する。
つまり、スクリーンリーダーはブラウザソフトでは無い。
最強の呼び声高いスクリーンリーダーはJAWS（ジョーズ）。
ただし価格が高い。
前述の通り、スクリーンリーダーはIEなどのブラウザを通してアクセスする。 よってUAはそのブラウザとなる。
その為にアクセス解析ではシェアが分からず、クライアントに視覚障害者への対応を勧める事に苦労する（具体的な説得材料が一つ減ってしまう）。
アクセシブルでないサイト（ショッピングサイトなど）を使った際には、辻さんはその旨をサイト側に伝える事があるとか。
（これはShunの意見ですが）それが辻さんに限る事だとは思えないし、フォームのアクセシビリティは特に重要なのでは。
スクリーンリーダーという事は通常のPC操作も支援している訳で、例えばテキストを打つ場合も読み上げてくれる（キーを叩く度、変換する度に読み上げる）。
例としてスピーカーの辻さんの「辻」という字を変換すると、「辻斬りの 辻」と読み上げていた。
音声ブラウザではホームページリーダーが。 スクリーンリーダーではPc-TalkerとXPトーカ－が多い。
JAWSは性能はいいけれど、値段もあってかまだまだ一般には普及していない。
（ここでモデレーターの植木さんから補足があって、 「インフォアクシアではPc-Talkerとホームページリーダーの2つをチェック対象としている」との事）
ホームページリーダーでは、見出しやリンク部分を女性の声で読み上げる事で、通常のテキスト（男性）との区別を付きやすくしていた。
支援ソフトの種類によっては、女性の声のままで音程を上げる事で区別を付けてる物もある。
「、」や「。」は、「てん」「まる」と読み上げられていた。
例として上の行だと、「てん やまる はてん てんまると読み上げられていましたまる」となる（「」はどうだったかな・・メモ忘れか、登場しなかったか。 こちらの件はJAWSの読み上げ方にて追記済み）。
前述のJAWSでは、h1要素やh2要素を「見出し1」「見出し2」と読み上げてくれる。
また、リンク部分も「リンク トップ」「リンク ブログ」などと、「リンク：ほげほげ」という形式で読み上げてくれる。
他のスクリーンリーダーではそこまではやってくれないらしく、この辺りが最強たる所以？
支援技術が実際にどのように読み上げるのかを、JAWSで体験する事ができました。
必死にメモを取りましたが、展開が速かったので曖昧な部分が多くあります。 正しくは音声とスライドの公開を待ってください。
Twitterで forestkさんに補足頂きました。 ありがとうございます！
ここで分かる事は、（strong要素や？）del要素を通常のテキストとして読み上げてしまう支援ソフトがある、という事。
つまり、音声系の環境もサポートするならば、他の手段でそれを伝える事を考える必要がある（もちろん正しいHTMLである事を前提に）。
画像置換にdisplay: none; を使用するとスクリーンリーダーで内容を得られなくなるように、視覚表現の為の指定がアクセシビリティを下げてしまう事がある。
また現在の音声ブラウザは、link要素のmedia属性に対応しているとは言いがたく、media="screen,print" などと指定しても読み込んでしまう。
セッション終了後に、点字ブラウザの動作を見せてもらえる事になりました。
本当なら写真を撮ったりしたかったんですが、次のセッションの都合上無理でした。 なので文字だけで説明。
実際に読み上げソフトを常用している人の話を聞けるっていうのは、ものっそい貴重な体験でした。
お恥ずかしながら、スクリーンリーダーと音声ブラウザの違いもこのセッションで知りました。
そういえば、聴覚スタイルシートの話は出ませんでした（質問するのも忘れた・・）。 まあ、media属性の対応もまだ十分で無いのなら、殆どサポートされて無いのかもしれません。
今回のセッションと直接の関係は無いんですけど、前に2ch系のBBSで「AAがあると何が何だか分からなくなる」っていう書き込みを見た事があります。
まあ、2chくらいの規模になると２ちゃんねる”を音声で読み上げてくれるWebブラウザもあるみたいですけれど。
益子さんのセッションは大人気で、当初の予定を変更して、二部屋をブチ抜いて行われる事になりました。
内容はXHTML+CSSのガイドラインを、みんなで作っていこう！ というものでした。
スライドを中心に進んでいく形式だったので、セッションを受けていない人も、公開されるスライドを見ればかなり理解できると思います（スライドはもう公開されてるんでしたっけ？ 現在探し中です。）
なので、この記事では僕がメモした内容を整理して公開しています。
userstyles.orgからどうぞ。
タイトル通りです。 て言うか、DL数的に初見な人も多い気がしたりしなかったり。
大体こんな感じです。 細かい事をたくさん。
自分が使っていて、「もうちょっとこうだったらいいのにな」と思った部分を書いてみました。
なお、コードが一部しょんぼりした感じなのは触れない方向でお願いします。
昨日の記事で、livedoorクリップのユーザーCSSを更新した事をお伝えしました。
するとonkさんからはてブコメントをいただきました。 曰く、
おおおおお，hover とかがえらく変わってる！ページング部分はどうせ AutoPagerize で移動するから使いづらさは感じていなかったなぁ．
と言う訳でAutoPagerizeフラグが立ったので、対応しました。
livedoor Clip CSS | userstyles.orgのUpdateボタンから更新してください。
残念ながら偶数行と奇数行で別々の背景色を指定するのは、AutoPagerize部分では難しいぽいです。
li class="clip"の部分をli class="clip clip-odd"とli class="clip clip-even"とか、なんかそんな感じにしてくれたらもの凄く楽なんだけどなー。 と呟いてみる。 ついでにSkype送っておこう。
でも、グリモンに挑戦する良いチャンスかも。 なんて。