タグ

2008年1月20日のブックマーク (4件)

  • デバッグ用CSS「Diagnostic Styling」とそのサンプルコード - Trans

    CSSを使って開発中のHTMLのデバッグを行ってしまうという考え方の紹介とそのサンプルコードをメモしておきます。 デバッグ用CSSとは何か。 まず、サンプルのコードを示してみます。 img[alt=""] {border: 3px dotted red;} img[title=""] {outline: 3px dotted fuchsia;} img要素に続くのは属性セレクタ(属性セレクタについてはCSS セレクタに関するおさらい | WWW WATCHが詳しいので、そちらを参考に)。alt=""とtitle=""の属性と値を持つimg要素にマッチし、それぞれのスタイルを与えます。こうしておくと、HTML内に空白のalt属性やtitle属性があれば、指定されたスタイルが適用されるになり、空白であることが分かるわけです。 もう1つサンプルとして、こんなのはどうでしょうか。 a[href="

    デバッグ用CSS「Diagnostic Styling」とそのサンプルコード - Trans
  • 創造の現場における「知っている」ということ「身体が覚えている」ということ: DESIGN IT! w/LOVE

    不確実な時代をクネクネ蛇行しながら道を切りひらく非線形型ブログ。人間の思考の形の変遷を探求することをライフワークに。 ブルーノ・ムナーリは『モノからモノが生まれる』のなかで「企画するのは、そのやり方を知っていれば簡単なことである。問題の解決に至るための方法を知っていれば、どんなことも容易となる」と言っています。また、『ファンタジア』では、子どもに創造の喜びを教えるワークショップを行うポイントとして「保存されるべきものは、モノではない。むしろそのやり方であり、企画を立てる方法であり、出くわす問題に応じて再びやり直すことを可能にさせる柔軟な経験値である」とも言っています。 確かに、そのとおりでやり方・方法を知っていれば、新たな問題に出くわしても焦ることなく手持ちの方法を引き出しから選んで対応することができます。問題の解法を「「わかる」ためには引き出しを増やさないと」いけないのは前にも書いたとお

  • みんなで手を動かしながら考えるということを図にしてみました。: DESIGN IT! w/LOVE

    不確実な時代をクネクネ蛇行しながら道を切りひらく非線形型ブログ。人間の思考の形の変遷を探求することをライフワークに。 昨夜、「ユーザー中心のデザインは「みんなで手を動かしながら考え」なきゃ進まない」というエントリーを書きましたが、どうしてユーザー中心のデザインで「みんなで手を動かしながら考える」ことが必要なのか?という点を、いまひとつ自分でもうまく説明しきれていないと思ったので、あらためて図なども使いながら整理してみようと思います。 まず、「どうして?」に対する「なぜならば」の答え。 それは、人びとの生活をよりよいものにすることを目的(デザイン問題)とする、ユーザー中心のデザインでは、単にものをデザインするのではなく利用者の経験価値や暮らしそのものがデザインの対象となるため、直接的にはものやサービスのデザインをするにしても、そのデザインに関わるチーム全員がユーザーの行動やそれにともなう心理

  • JavaScriptで数式エディタ·BrEdiMa MOONGIFT

    ※ 画像は公式サイトデモより Webサイト上で数式を載せている人というのは意外と多い。その際のやり方は概ね二種類あった。一つは数式をテキストベースで書く方法。だがこれは見づらいという欠点がある。もう一つは画像で作り、それを載せる方法。これは奇麗に見られるのは良いが、編集が容易ではない。 どちらも一長一短がありそうだ。そこで、手軽に書けて、かつ見栄えの良い数式エディタを紹介しよう。 今回紹介するオープンソース・ソフトウェアはBrEdiMa、JavaScriptベースの数式エディタだ。 BrEdiMaはWeb上で動作する数式エディタで、WYSIWYGなエディタを使って数式を組み立てることができる。例えばルートや分数、シグマなどもアイコンから選択するだけで挿入できる。 その結果はmimeTeXという数式描画プログラムに渡され、結果を画像で表示する。JavaScriptによる数式組み立ての手軽さと

    JavaScriptで数式エディタ·BrEdiMa MOONGIFT