はてブのタグ、 <hatebu-button>を作りました

はてなブックマークに追加するボタンのWebComponentWrapper

Github: nekova/hatebu-button

<hatebu-button>が存在しない世界

<a href="http://b.hatena.ne.jp/entry/"
 class="hatena-bookmark-button" data-hatena-bookmark-layout="standard-balloon"
 data-hatena-bookmark-lang="ja" title="このエントリーをはてなブックマークに追加">
    <img src="http://b.st-hatena.com/images/entry-button/button-only@2x.png" 
alt="このエントリーをはてなブックマークに追加" width="20" height="20" style="border: none;" />
</a>
<script type="text/javascript" src="http://b.st-hatena.com/js/bookmark_button.js" 
charset="utf-8" async="async"></script>

<hatebu-button>が存在する世界

<hatebu-button></hatebu-button>

見通しが良いし、再利用出来ます。(今回はともかく、一般的にはメンテナンス性が高くなります)

Web Componentsしか存在しない世界

<awesome-navbar></awesome-navbar>
<article-title></article-title>
<article-body></article-body>
<google-adsense><google-adsense>
<share-button></share-button>
<article-comment></article-comment>
<pagination-button></pagination-button>
<side-bar></side-bar>
<awesome-footer></awesome-footer>

こういう未来もあるかもしれません:p

ちなみに、 Twitter, Facebook, Google+ のcustom elementsは既に存在しています。 個人的に気に入ってるのはGIFを簡単に扱えるクールなコンポーネント

他にどんなものがあるか気になる方は、Custom Elements.IOを見ると良いかもしれません。

さきのような未来が現実になるかどうかはさて置き、便利なライブラリを使うのと同じように、便利なコンポーネントを使う時が来るかも知れません。