Webサイト（ホームページ）制作をする際には『開発仕様書』と呼ばれるWebサービスを作るうえで開発者サイドの説明書になる資料が必要になります。
しかし、実際に仕様書を作成するとなったときに、何から準備を始めれば良いのか、どんな情報が揃っていれば開発者とスムーズに制作を進められるのかなど、イメージが持ちづらい方も多くいるのではないのでしょうか。
そこで今回は、Webサイト（ホームページ）制作で使用される仕様書の作り方について、作成する目的から基本的な手順まで説明していきたいと思います。
そもそも開発仕様書とは？
開発仕様書の作成方法について解説する前に、そもそも開発仕様書とは何で、どんな目的で作成されるのかについて軽く触れたいと思います。
Webサイトやホームページ制作における開発仕様書を端的に説明すると、『Webサイトで実現すべきことをまとめた資料』になります。サイト内にどのページを設け、どのような機能や要素を入れるかなどが整理された資料のことです。
開発仕様書を作成する目的
Webサイトの制作や開発はお客様や開発、制作メンバーなど役割の異なる複数人が関わり進行するからこそ、それぞれの認識を常に合わせておくことが重要になってきます。
Webサイトの開発を共通認識を持ちながらスムーズ行っていくために、開発仕様書が必要になってくるのです。そのように、開発仕様書はWebサイトがどのような仕組みで構成され、どんな機能を実装すれば良いのかなど、制作するWebサイトに必要な認識を合わせる助けになります。
開発仕様書において必要な項目
それでは、本題の開発仕様書の作り方について順に説明していきたいと思います。
開発仕様書に含める項目は制作するWebサイトによってやや異なってきますが、以下の項目は必ず含めるようにしましょう。
- プロジェクトの概要
- スケジュール
- サイトマップ
- ワイヤーフレーム
プロジェクトの概要
まず初めにまとめておくべき項目がプロジェクトの概要です。
Webサイト制作の目的やゴールなど、サイト全体の方向性をなるべく具体的に言語化していきましょう。
主な項目は下記の通りです。
- プロジェクト名
- WebサイトのURL（ドメイン）（新規サイト制作の場合は不要です）
- Webサイト制作の目的
- Webサイト制作の背景・課題
- KPI（ホームページのPV数・お問い合わせ数など目標指標）
- Webサイトの公開日
スケジュール
納期の日時はもちろん、開発開始から制作したサイトのテスト期間、修正期間など、できるだけ細かいスケジュールを提示しましょう。
ここで気をつけたいので、技術面での実現難易度、工数、優先度は開発サイドとしっかりすり合わせながらスケジュールを明確にしていくことです。
そうすることで、認識のズレなどが後から起こるリスクを未然に防ぐことができます。
Webサイト制作の工程は案件の内容によって異なりますが、一般的な作業工程は以下になります。
- サイト設計（機能的・情緒的な要件の整理）
- デザイン設計
- サイト開発（コーディング）
- サイトテスト
- サイト修正
- Webサイトのリリース
サイトマップ
サイトマップとは「ホームページ全体でどのようなページが必要か？」といったサイト全体の構成を表すものになります。サイトマップは、Webサイトの構造を視覚的に確認する事に役立ちます。
サイトマップの作成方法は以下の記事を参考にしてみてください⏬
https://udemy.benesse.co.jp/marketing/seo/how-to-make-sitemap.html
ワイヤーフレーム
ワイヤーフレームとは、Webサイトなどを制作する上で各ページごとに必要な要素を整理したものです。言わば『デザインの下書き』的な位置づけに当たります。
ワイヤーフレームは実際にデザインを進める前に、完成イメージを「見える化」できるため、情報の抜け漏れがないか、機能の整合性がとれているかといった確認ができます。
完成イメージが見えないまま作り始めてしまうと、デザイン作成後に「必要な項目が足りてなかった…」「この機能、ここのページにあると使いにくいな…」といった事態が起こりかねません。
デザイン後に修正を必要としないためにも、ワイヤーフレームでの情報整理は大切です。
ワイヤーフレームの作成方法は以下の記事を参考にしてみてください⏬
まとめ
今回はWebサイト制作における開発仕様書の目的から必要な項目について説明していきました。
開発仕様書を作成する目的を正しく理解し、効果的に運用していけば、Webサイト制作をスムーズに進行していくことが可能になります。
仕様書の完成度によって、Web制作・開発が問題なく進められるかが左右されるため、少し大変な作業にはなりますが、妥協せずしっかり取り組んでいきましょう！
DX支援資料
セブンデックスのDXプロセスと実績詳細が解説されている資料を無料でダウンロードできます。
