納品用のWebサイトのスタイルガイドが簡単に作成できるHTMLのテンプレート -Style Guide Guide
Post on:2017年5月23日
sponsors
Webサイトのガイドライン、カラーや文字やアイコンや画像のスタイル、使用するコンポーネントを定義するスタイルガイドが作成できるテンプレートを紹介します。
Style Guide Guide
Style Guide Guide
Style Guide Guide（誤字ではないです）は、MITライセンスで利用できるスタイルガイドのテンプレートで、企業サイトの納品用にも無料で利用できます。
Style Guide Guideのファイル構成は、下記の通り。
スタティックサイトジェネレーター「Jekyll」を使用して作成されています。
|
1 2 3 4 5 6 7 8 9 10 11 12 |
design-system-1.0/ ├── css/ │ ├── design-system-1.0.css │ ├── design-system-1.0.min.css ├── fonts/ │ └── [design system web fonts] ├── images/ │ ├── design-system-icons.svg └── js/ │ ├── design-system-1.0.js │ └── design-system-1.0.min.js └── [additional files] |
デザインは非常にシンプルで、オンラインでどのような感じが確認できます。
中身は空ですが、各項目は用意されているので、雰囲気が分かると思います。
よく使用するページはテンプレートとして、使用例を定義しておくと便利ですね。
コンポーネントでは、最近のWebサイトで見かけるものがまとめられています。
コンポーネントの項目
sponsors
