最近はCSSでスタイルガイドを作成するケースが増えています。プログラムがAPIドキュメントを書くのと同様、デザインについても適切な文書があることで多人数での効率的な作業が行えるようになるというものでしょう。 スタイルガイドを書く方法は幾つかありますが、今回はStyledownを紹介します。書き慣れた人も多いであろう、Markdownフォーマットで記述できるソフトウェアです。

Styledownの使い方

こちらは生成後。左側に説明、右側に実際に適用した表示と、HTMLタグが表示されます。

通常はこのようにHTMLタグは折り畳まれた状態になります。

クリックすると開きます。

実際の記述ですが、このようにインラインでスタイルシートファイル内に書くことができます。

Styles.mdとして別ファイルに切り出すこともできます。

スタイルシートはブラウザが良くできているせいで、適当に書いても意外とちゃんと表示されてしまったりします。それだけに適切な構造化を行っていないとすぐに破綻し、好き勝手に設定を追加していくことにもなりかねません。

それを防ぐのにスタイルガイドが果たす役割は大きいはずです。Markdownフォーマットであれば特別な教育なしにすぐ書けるようになるでしょう。

Styledownはnode/JavaScript製のオープンソース・ソフトウェア（MIT License）です。

Styledown styledown/styledown