考え方

システム開発より、むしろWebデザインのための資料が参考になる。
サイトマップやページレイアウト、文字、色、画面サイズなどに関するデザインガイドラインは、良いものがインターネット上にたくさんある。

ちなみにWebデザインは、要件定義→情報設計→仕様設計（表現は色々ある）の流れで行われているようだ。
レイアウトは情報設計の後半で、文字や色などの要素のデザインは仕様設計で行っている。

デザインガイドラインを作成するためのコツ

デザインのコンサルティング会社「ソシオメディア」取締役の上野さんが、運用まで視野に入れたガイドライン作成のコツについて書いている。
www.sociomedia.co.jp

大まかには...
1. 必要最低限のことを書く（読んでもらえなくなるから）
2. 考え方と具体例（コピペしやすいほど良い）を両方載せる
3. ガイドラインに沿っているかレビューのプロセスを入れる
4. フィードバックをどんどん取り入れる（変えられないと使うのが負担になる）

本当はもっと深いことが書いてあるのでリンク先読んでみてください。

個人的に参考になるもの3選。

Introduction · Bootstrap
言わずと知れたフレームワーク「bootstrap」の公式ドキュメント。
コピペすればそのまま使えるコードが掲載されておりとっても使いやすい。

Styleguide
レビューサイト「Yelp」のスタイルガイド。
項目に網羅感があるので、自作デザインガイドの骨組みに良さそう。考え方、cssタグの例示もある。

GOV.UK elements
英国政府のデジタルサービス提供サイト「GOV.UK」のデザインガイドライン。

airtable.com Airtableにまとめて公開しています。この程度しか読んでないので、お勧めがあればぜひご教示ください。