【WordPress】オリジナルテーマ制作に向けてWebサイトの構成を考えよう
どうも、ナツリンです。
最近は、WordPressのオリジナルテーマ制作について語らせてもらってます。今回のテーマは「サイト構成」についてです。
私はオリジナルテーマを制作したときに、デザインやコーディングに着手する前に「サイト構成」を考えました。オリジナルテーマを活用してどのようなサイトを作っていきたいのかを考えておくことで、後から「このページも必要だった」と焦る場面を減らすことが出来るのです。
私の実際の経験が、オリジナルテーマ制作の役に立ったら嬉しいです！
▼ 関連記事だよ
あわせて読みたい
あわせて読みたい
サイト構成を考える手順
私の場合は、次の手順でサイト構成を考えました。以降で、1つ1つの手順について詳しく見ていきたいと思います。
- 参考サイトを見て構成を分析する
- サイトに必要なページを洗い出す
- サイトマップを作成する
参考サイトを見て構成を分析する
最初に行ったのは、参考サイトを集めて分析することです。
私は人のブログを読むのが趣味なので、好きなブロガーさんたちのブログの構成を参考にしました。例えば次のようなブログです。
- 今日はヒトデ祭りだぞ！（趣味・ネタ系）
- ベーコンさんの世界ブログ（デザイン・ガジェット系）
- Fuyuna Blog（暮らし・デザイン系）
分析するサイトは個人ブログでも、企業が運営しているWebサイトでも問題ありません。3サイトくらい集められると良いと思います。
参考サイトを見ながら、「メニューにはどんな項目があるのか」「必要なページは何か」をじっくりと見ていき、「自分のブログはこういう構成にしたいな」というイメージを膨らませていきました。
サイトに必要なページを洗い出す
次に、作りたいWebサイトに必要なページの洗い出しを行いました。
参考サイトを見ながら「自分のサイトにはこんなページが必要だな」と膨らませたイメージを、実際に書き出していく作業になります。
今のブログ構成とは少し異なっていますが、当時の私は次のようなページが必要だと考えました。
- TOP
- 日常
- 旅行
- プロフィール
- プライバシーポリシー
- お問い合わせ
- 各投稿
必要なページの洗い出しが出来れば、このフェーズは完了になります。かなり簡単ですね。
サイトマップを作成する
最後にサイトマップを作成していきます。
サイトマップとは「ウェブサイト全体の構成やページの一覧をまとめた設計図のようなもの」です。
ここでは先ほど洗い出した必要なページたちを、どのように組み合わせてサイトを構成していくのか、図として実際に書き出していきます。
私はFigmaを使ってサイトマップの作成を行いました。すごくシンプルな構成でも、サイトのイメージがかなり明確になった感じがしますね。
サイトマップの作成にともなって、「/profile」や「/privacy」などURLの末尾に付けるスラッグを決めることが出来ましたし、デザインのテンプレートを使い回せそうなページを何となくイメージすることも出来ました。
まとめ
以上が、WordPressのオリジナルテーマを初めて制作したときに、実際にサイト構成を考えた手順になります。
簡単でシンプルなやり方にはなりますが、事前にサイト構成を考えておくことで、デザインやコーディング段階で「抜け・漏れ・考慮不足に気づく」ことによる面倒な作業をかなり削減できたと感じているので、やっておくことをおすすめします！
それでは次回は、1つ1つのページの細かい構成を考えていく「ワイヤーフレームの作成」について書いていきたいと思います。
今回も最後まで読んでくださりありがとうございました！
▼ 次はワイヤーフレームを作成しよう
あわせて読みたい
▼ オリジナルテーマ制作の全体像はこちら
あわせて読みたい
