marginotes - 文章の横にすてきな注釈を
本を読んでいると、左右に余白があって、必要に応じて単語の説明が記載されていることがあります。注釈を本の最後にまとめて載せているのに比べると分かりやすく、読みやすいのではないでしょうか。 そんな効果をWeb上で実現してくれるのがmarginotesです。Webらしく、よりインタラクティブになっています。
marginotesの使い方
marginotesは次のように指定します。descという要素を使います。
<span desc="The rainiest place in Europe. Probably. Maybe.">Brión</span>
注釈はマウスオーバーで表示されます。リンクとは別で下線が入っている部分が説明対象です。
右側に出すこともできます。
marginotesは普段見慣れない仕組みですが、文頭で「下線のあるところは注釈が出ます」とでも書いておくとユーザビリティが高くなるでしょう。括弧で説明を書き加えるよりも、たくさんの説明ができるのではないでしょうか。
marginotesはjQuery/JavaScript製のオープンソース・ソフトウェア(MIT License)です。