カテゴリー: サイト構成図

はじめに

製造業勤務、機械系エンジニアライターの野口です。Webサイトの制作時に、構成図（サイトマップ）の作り方がわからず困っていませんか。この記事ではサイトマップの作り方や注意点、製造業におけるサイトマップのページ例を紹介します。

Webサイト制作における構成図（サイトマップ）の作り方

Webサイトにおけるサイトマップについて、概要や重要性、作り方を説明していきます。

サイトマップとは

サイトマップとはサイトの構成図です。サイトの構成をツリー状に表し、各ページのつながりを視覚的にわかりやすくしています。サイトを制作する際には全体像を把握しやすいため、Webサイトに欠かせない設計図です。

サイトマップの重要性

サイトマップの最大のメリットは「サイト全体の構成が把握しやすくなる」ことです。各ページの関係性が一目でわかるため、プロジェクトメンバーとの情報共有も簡単です。

また、ホームページの制作を依頼する場合も便利です。制作側は全体像がわかり見積もりしやすく、運営側と制作側の両者で仕事が円滑に進みます。

サイトマップの作り方

サイトマップは大まかに4つのステップで作ります。

ステップ1：目的を決める

はじめに、サイトの目的を決め、方向性を定めていきましょう。

ステップ2：必要なページを書き出す

次にサイトの構成ページを考えます。順番を気にせずに思いついたものをリストアップしてください。特に、構成ページの抜けもれに注意していきましょう。

ステップ3：書き出したページを分類する

構成ページのリストアップが終われば分類分けです。似た内容は同じカテゴリーとしてまとめます。ここで重複があれば消し、抜けもれがあれば追加してください。

ステップ4：分類したページをツリー状にまとめる

最後に分類したものをツリー状にまとめてください。このまとめがそのままサイトマップになります。

サイトマップを作る時の3つの注意点

サイトマップを作る時の注意点について、3点説明します。

1．わかりやすい構造にする

サイトマップの作成時は、「訪問者の見やすさ・使いやすさ」を意識してください。サイトの構造が複雑だと求めるページを見つけにくいからです。訪問者の観点で「見やすい・使いやすい」簡単な構造を意識しましょう。

2．深くても3階層まで

サイトマップの構造はページは深くても3階層までにしましょう。3階層以上になると複雑になり、目的のページにたどり着くまでに時間がかかってしまうからです。目的のページが探しにくいと、面倒くさくなりサイトから離脱される恐れもあります。3回クリックすれば目的のページを表示できるサイト構造を心がけ、訪問者のストレスを減らす工夫をしましょう。

3．SEOキーワードを意識する

サイトマップにキーワードを意識して取り入れると、検索時の上位表示を狙えます。上位表示されるほど、サイト訪問者の増加も見込めるからです。サイトマップの作成と同時に、検索されるだろうキーワードも意識してください。

＊SEOとは（Search Engine Optimization：検索エンジン最適化）の略称。

製造業Webサイトにおけるサイトマップ

では、実際に作成する際、どのようなページが必要なのでしょうか。

作成候補ページ一覧

よく見受けられるページの一例を紹介します。

TOPページ

サイトの表紙です。サイトマップの分類項目へつながるバナーやリンクなどのコンテンツを配置しましょう。

会社概要

一般的には代表挨拶、会社情報、沿革、アクセスなどです。

品質保証関連

自社のアピールとして、ISO9001やISO14001などの認定有無や環境への取り組みを記載します。

設備一覧

自社の保有装置です。加工業者であれば、加工機械や、検査機械などを紹介します。

コンテンツページ

加工業者であれば、自社の加工事例や加工プロセスなど。技術アピールを紹介します。また、素材や装置など取り扱い製品をまとめたページもおすすめです。

お問い合わせ

多くの場合、お問い合わせフォームを活用します。近年ではAIによるチャット対応もあります。

採用情報

自社の採用情報を掲載します。たとえば、新入社員や中途社員の採用状況などです。入社希望の訪問者は必ず探すページのため、作成しておくといいでしょう。また先輩社員の人となりを知るためにインタビューページを掲載している企業もあります。

よくある質問

よくある質問をまとめたページです。訪問者と企業、いずれの問い合わせ対応の手間を減らせます。

まとめ

Webサイト制作における構成図（サイトマップ）の作り方を紹介しました。サイトマップはサイトの全体像の把握や訪問者の使いやすさに直結します。今回紹介したサイトマップの作り方やその注意点を意識しながらサイトマップを制作してください。

テクノポートは多くの製造業のホームページを制作し、効果の高いホームページを作成してきました。Webサイトの制作にお困りの際には、ぜひお声がけください。

The post Webサイト制作における構成図（サイトマップ）の作り方 first appeared on モノカク.

はじめに

製造業勤務、機械系エンジニアライターの野口です。Webサイトの制作時に、構成図（サイトマップ）の作り方がわからず困っていませんか。この記事ではサイトマップの作り方や注意点、製造業におけるサイトマップのページ例を紹介します。

Webサイト制作における構成図（サイトマップ）の作り方

Webサイトにおけるサイトマップについて、概要や重要性、作り方を説明していきます。

サイトマップとは

サイトマップとはサイトの構成図です。サイトの構成をツリー状に表し、各ページのつながりを視覚的にわかりやすくしています。サイトを制作する際には全体像を把握しやすいため、Webサイトに欠かせない設計図です。

サイトマップの重要性

サイトマップの最大のメリットは「サイト全体の構成が把握しやすくなる」ことです。各ページの関係性が一目でわかるため、プロジェクトメンバーとの情報共有も簡単です。

また、ホームページの制作を依頼する場合も便利です。制作側は全体像がわかり見積もりしやすく、運営側と制作側の両者で仕事が円滑に進みます。

サイトマップの作り方

サイトマップは大まかに4つのステップで作ります。

ステップ1：目的を決める

はじめに、サイトの目的を決め、方向性を定めていきましょう。

ステップ2：必要なページを書き出す

次にサイトの構成ページを考えます。順番を気にせずに思いついたものをリストアップしてください。特に、構成ページの抜けもれに注意していきましょう。

ステップ3：書き出したページを分類する

構成ページのリストアップが終われば分類分けです。似た内容は同じカテゴリーとしてまとめます。ここで重複があれば消し、抜けもれがあれば追加してください。

ステップ4：分類したページをツリー状にまとめる

最後に分類したものをツリー状にまとめてください。このまとめがそのままサイトマップになります。

サイトマップを作る時の3つの注意点

サイトマップを作る時の注意点について、3点説明します。

1．わかりやすい構造にする

サイトマップの作成時は、「訪問者の見やすさ・使いやすさ」を意識してください。サイトの構造が複雑だと求めるページを見つけにくいからです。訪問者の観点で「見やすい・使いやすい」簡単な構造を意識しましょう。

2．深くても3階層まで

サイトマップの構造はページは深くても3階層までにしましょう。3階層以上になると複雑になり、目的のページにたどり着くまでに時間がかかってしまうからです。目的のページが探しにくいと、面倒くさくなりサイトから離脱される恐れもあります。3回クリックすれば目的のページを表示できるサイト構造を心がけ、訪問者のストレスを減らす工夫をしましょう。

3．SEOキーワードを意識する

サイトマップにキーワードを意識して取り入れると、検索時の上位表示を狙えます。上位表示されるほど、サイト訪問者の増加も見込めるからです。サイトマップの作成と同時に、検索されるだろうキーワードも意識してください。

＊SEOとは（Search Engine Optimization：検索エンジン最適化）の略称。

製造業Webサイトにおけるサイトマップ

では、実際に作成する際、どのようなページが必要なのでしょうか。

作成候補ページ一覧

よく見受けられるページの一例を紹介します。

TOPページ

サイトの表紙です。サイトマップの分類項目へつながるバナーやリンクなどのコンテンツを配置しましょう。

会社概要

一般的には代表挨拶、会社情報、沿革、アクセスなどです。

品質保証関連

自社のアピールとして、ISO9001やISO14001などの認定有無や環境への取り組みを記載します。

設備一覧

自社の保有装置です。加工業者であれば、加工機械や、検査機械などを紹介します。

コンテンツページ

加工業者であれば、自社の加工事例や加工プロセスなど。技術アピールを紹介します。また、素材や装置など取り扱い製品をまとめたページもおすすめです。

お問い合わせ

多くの場合、お問い合わせフォームを活用します。近年ではAIによるチャット対応もあります。

採用情報

自社の採用情報を掲載します。たとえば、新入社員や中途社員の採用状況などです。入社希望の訪問者は必ず探すページのため、作成しておくといいでしょう。また先輩社員の人となりを知るためにインタビューページを掲載している企業もあります。

よくある質問

よくある質問をまとめたページです。訪問者と企業、いずれの問い合わせ対応の手間を減らせます。

まとめ

Webサイト制作における構成図（サイトマップ）の作り方を紹介しました。サイトマップはサイトの全体像の把握や訪問者の使いやすさに直結します。今回紹介したサイトマップの作り方やその注意点を意識しながらサイトマップを制作してください。

テクノポートは多くの製造業のホームページを制作し、効果の高いホームページを作成してきました。Webサイトの制作にお困りの際には、ぜひお声がけください。

The post Webサイト制作における構成図（サイトマップ）の作り方 first appeared on モノカク.

テクノポートの永井です。

弊社徳山の前回のブログにて「Webサイトの各ページの役割分担」について紹介しました。簡単に振り返ると、

1. アクセスを獲得するページ（ランディングページ）の設定
2. ユーザを口説くページ（訴求ページ）の必要性
3. 問合せを獲得するためのページ（クロージングページ）の工夫

を考慮したサイト構成を考えることで、集客力の高いWebサイトを作成できる可能性が高まるというものでした。詳しくはこちら

今回はWebサイト全体の設計図となる「サイト構成図」について解説します。サイト構成図を作ることで、Webサイト制作に必要な項目が明確になるため、Webサイトを作る際にはぜひ参考にしてみてください。

1．サイト構成図とは

サイト構成図は各ページがどのように配置されているのかをわかりやすく表現した図になります。書き方はいろいろありますが、まずは弊社のサイト構成図を参考にお見せします。

サイト構成図を作ることで、Webサイトの全体像が想像できるようになります。ここで簡単にWebサイト作りの手順について説明します。

1. 最初に漏れの無いように必要なページの洗い出しを行います。
2. 訴求ページ、ランディングやクロージングなどの各ページの役割を設定し、導線を想定します。詳細はこちら
3. サイト構成図を作成します。
4. ワイヤー（線だけの配置図で、製造業でいう図面）を作り、ボタンなどの配置について検討します。
5. デザインをして、個別ページを作ります。

以上の手順で行います。ワイヤーは聞き慣れない言葉かと思いますので、弊社のトップページのワイヤーを参考にお見せします。

以上のように、サイト構成図を作ることで、Webサイトの全体が把握でき、目的が明確になります。

2．サイト構成図を作る意味について

サイト構成図を作ることで、

• Webサイトで伝えたい情報が漏れなく掲載できているか
• 訴求ページがユーザーの目に止まりやすい位置に配置できているか
• ユーザーがクロージングページに迷いなくたどり着けるか

といった内容の整理が簡単にできるようになります。さらに、サイト構成図はトップページのワイヤーを作るための素材にもなるため、ユーザーが欲しい情報にたどり着きやすい設計になっているかの確認にも役に立ちます。また、サイト構成図があると社内で共有する際に関係者が理解しやすいことや、運用する際に管理しやすいことなど様々なメリットがあります。

3．サイト構成図の作り方

それでは実際にサイト構成図の作り方をご紹介します。

手順1．トップページを頂点として、メインメニューとなる項目を配置する

まずはメインメニューに何を配置するかを検討します。メインメニューは最もユーザーの目に触れる項目ですので、

• 訴求ページ
• クロージングページ
• 会社概要
• お問い合わせ

など、ユーザーがよく利用すると思われる項目を入れてください。また、メインメニューは見やすさを考慮して、最大でも9項目程度に収めてください。

手順2．メインメニューの下層となるサブメニューを配置する

メインメニューが決まったら次は第二下層となるサブメニューを配置してください。サブメニューはWebサイトに初めから表示されないことが多く、メインメニューを押したり、マウスオーバーしたりすると出てくるものになります。そのため、

加工技術 ← メインメニュー
―大物加工 ← サブメニュー
―微細加工 ← サブメニュー
―難削材加工 ← サブメニュー

のように、メインメニューと親子関係になる様なメニューを配置してください。こうすることで、ユーザーが迷うことなく情報にたどり着けるようになります。

手順3．サイト構成図を見直す

最後にWebサイト構成図を見直してください。コンテンツに漏れがないか、ユーザーが迷いなく情報にたどり着けるようにメインメニューとサブメニューの関係が作れているかなど、Webサイトが適切に設計されているかの確認をします。

4．サイト構成図の注意点

サイト構成図を作るときの注意点をお伝えします。

4−1．細かくなりすぎないように注意する。

サイト構成図を作り始めるといろいろと盛り込みたくなり、細かくなりすぎる場合があります。例えば、材質ごとにサブメニューを作ったり、自社の取り組みについて細かく書きたくなる場合があります。細かくすることも必要な場合はありますが、細かすぎるとかえって見づらくなるため、Webサイト構成図を作った後は第三者に見てもらうことをお勧めします。

4−2．グループを作ってわかりやすくする。

サイト構成図はWebサイトの抜け漏れ防止以外にも、ユーザーがわかりやすい構成かどうかを確認する役割もあります。そのため、必要な情報が見つけやすいようにグループを作り、メインニューとサブメニューに分けてください。

4−3．わかりやすければ重複しても大丈夫です。

メニューが重複すると閲覧者が混乱する場合もありますが、わかりやすければ重複しても大丈夫です。例えば、設備紹介をメインメニューにして、会社概要の第二下層にも設備紹介を持ってきても問題はありません。

まとめ

サイト構成図を作ることで漏れの無いサイト構成を作ることができ、さらにユーザーが見やすい構成も作りやすくなります。闇雲にWebサイトを作っていくのではなく、全体像を把握するためにもぜひ構成図を作ってみてください。