Webサイト制作の流れと期間

Webサイト制作の流れと期間

2018年3月9日に加筆・修正をしました。

Webサイトの制作は大抵2〜6ヶ月、規模が大きくなると半年以上の期間がかかることがあります。「なる早」を求められるケースもあるので、ケースによっては「プレオープン」の形をとることもしばしば。結局、何をしているのかが見えにくい仕事であると思うので記事として残しておきます。これからご覧いただく内容は、他の制作会社さんとは異なることもありますので、あらかじめご了承を。

よくある質問

Webサイト制作に取り掛かる際は、最初に依頼の経緯や要望を伺います。いわゆる「ヒアリング」と呼ばれる工程です。大抵、最初に持ちかけられるお話の内容は下記のようなことが多いです。

Q1. Webサイトが古くなってきたので、リニューアルしたい。

A1. ではWebサイトを整理してみます

見た目の古さに加えて、コンテンツが分類できていなかったり、スマホ対応ができていなかったりすることがあるので、そのあたりのことも合わせて話をします。Webサイトの見た目については、最近だと「こういう感じ」にしたい、と既存サイトのURLを連絡いただくこともあるので、「なぜ、このサイトを参考にしたのか」を、勝手に推察したりもします。わからなければ、その意図を聞くこともあります。

Q2. ネットで商品を売りたいので相談に乗ってほしい。

A2. ネットショップサービスの利用をお勧めします

商品点数がすごく多かったり、既存のネットショップサービスでカバーできない売り方をしない限り、自前のECサイトを多額の費用をかけて作るのは避けた方が良いと思っているので、こう答えることが多いです。ネットショップサービスの比較 (STORES、BASEほか)という記事を書いています。

Q3. Webサイトは、とりあえず持っておいた方がいいのか聞きたい。

A3. SNSはされてますか?

ヒアリングの結果、「とりあえず」どころか「作った方がいい」と思われることもあるので一概に言えませんが、Webサイトを持つ目的を見出せない場合は、ブログサービスやSNSを使えば済むこともあります。

制作プロセスの確認 / 例. 20ページのWebサイトを年度末までにリニューアル公開

制作プロセスは大きく分けて2つあるかと思います。20ページ程度のコーポレートサイトの場合で考えてみましょう。この確認でWebサイト制作の作業内訳が決まります。

制作開始

2017.08.28(月)10:00

制作完了・公開予定日

2018.03.30(金)21:00

A. デザインカンプ先行提出型の場合 / ウォータフォール型

確認作業を2回とし、デザインカンプ(Webページのイメージを出力またはPDF化したもの)の提出を最終版を合わせて3回とした場合です。中規模以上のWebサイトの場合であれば、ページの構成をまとめたサイトマップというものを、中規模以下であればページごとのラフを作って、並べて見ていただくことが多いです。制作者側からすればメインの仕事ですが、発注主さまからすればそうではないので、お仕事の合間での確認を前提にスケジュールを組みます。

デザインカンプ提出分類案

  1. トップ + 新着情報(Wordpress使用、一覧 + 個別) = 3ページ提出
  2. 事業紹介(概要 + ピックアップ)= 5ページ
  3. 会社概要(一覧 + 個別)= 5ページ
  4. 実績紹介(Wordpress使用、一覧 + 個別) = 2ページ
  5. お問い合わせ(入力 + 確認 + 完了)= 2ページ(としてカウント)
  6. その他必要なページ(CSRなど)= 3ページ

工程例

提出と返答 分類1 分類2 分類3 分類4 分類5 分類6
ヒアリング1次 2017.08.25(金)10:00
ヒアリング2次 2017.09.01(金)10:00
● 全て、カンプの提 2017.09.06(木)10:00
○ 全て、カンプの返 2017.09.13(木)18:00
● 1次の提 2017.09.14(木)10:00 2017.09.21(木)10:00 2017.10.26(木)10:00 2017.10.31(火)10:00 2017.12.04(月)10:00 2017.12.08(金)10:00
○ 1次の返 2017.09.26(火)18:00 2017.09.29(金)18:00 2017.11.01(月)18:00 2017.11.07(火)18:00 2017.12.14(木)18:00 2017.12.19(火)18:00
● 2次の提 2017.10.04(水)10:00 2017.11.13(月)10:00 2017.12.22(金)10:00
○ 2次の返 2017.10.10(火)18:00 2017.10.13(金)18:00 2017.11.16(木)18:00 2017.11.22(水)18:00 2017.12.27(水)18:00 2018.01.12(金)18:00
● 3次の提 2017.10.18(水)10:00 2017.11.28(火)10:00 2018.01.15(月)10:00
○ 3次の返、完 2017.10.23(月)18:00 2017.12.01(金)18:00 2018.01.18(木)18:00
  • 全て、カンプの提 = 全てのページデザインのアタリをとったものの提出
  • 1次の提 = デザイン1回目の提出
  • 1次の返 = デザイン1回目提出分のご返答
  • 完 = ご確認完了

コーディング工程

作業内容 日時 日数
コーディング開始 2018.01.19(金)10:00 土日、祝日を除いて 20日間
デモサイト限定公開からご確認・微調整 2018.02.19(月)10:00 5日間
Webサイトリニューアル作業開始、現行サイトの閉鎖 2018.03.27(火)9:00 4日間

 

B. モック先行提出型の場合 / アジャイル型

既存サイトを元に改善案を制作側で仮に策定し、最初にモック(仮サイト)を制作します。モックを実際に操作しながら、動線や操作性を確認しながら作業を進めます。連絡手段はミーティングに限らず、メールやチャットでも行います。全体と詳細を行ったり来たりしながらなので、出戻り工程が出ることはありますが、だんだん仕上がっていく様子がおもしろくお互いに充実感が味わえることが多いので、BUS STOPでは可能な限りこの方法で進めることにしています。

工程例

作業内容 日程
ヒアリング 2017.08.28(月)10:00
モック作成 2017.08.29(火)10:00 〜 2017.09.08(金)18:00
依頼主による検討 1次 2017.09.11(月)10:00 〜 2017.09.22(金)18:00
検討ミーティング 1次 2017.09.25(月)10:00
モック修正 1次 2017.09.26(火)10:00 〜 2017.10.06(金)18:00
依頼主による検討 2次 2017.10.10(火)10:00 〜 2017.10.20(金)18:00
検討ミーティング 2次 2017.10.23(月)10:00
モック修正 2次 2017.10.24(火)10:00 〜 2017.10.31(火)18:00
依頼主による検討 3次 2017.11.01(水)10:00 〜 2017.11.10(金)18:00
検討ミーティング 3次 2017.11.13(月)10:00
モック修正 3次 2017.11.14(火)10:00 〜 2017.11.24(金)18:00
依頼主による検討 4次 2017.11.27(月)10:00 〜 2017.12.08(金)18:00
検討ミーティング4次 2017.12.11(月)10:00
未支給原稿の支給 2017.12.12(火)10:00 〜 2017.12.29(金)18:00
モック修正 4次 2017.01.05(金)10:00 〜 2018.01.19(金)18:00
依頼主による検討 5次 2018.01.22(月)10:00 〜 2018.02.02(金)18:00
検討ミーティング 5次 2018.02.05(月)10:00
本番コーディング 2017.02.06(火)10:00 〜 2018.02.23(金)18:00
依頼主による確認 2018.02.26(火)10:00 〜 2018.03.09(金)18:00
確認・調整 2018.03.12(火)10:00 〜 2018.03.23(金)18:00
Webサイトリニューアル作業開始、現行サイトの閉鎖 2018.03.26(火)9:00 〜 2018.03.29(金)9:00

事前の準備

​Webサイト制作に必要なことを事前に済ませておいたり、情報を集めます。

ページ作成・更新者の確認

お話を伺う時点で、どのページを誰が作成・更新をするかを確認します。新着情報・ブログなどは発注主さま側で、レイアウトが比較的複雑でビジュアル重視のページは制作者側で、というような段取りにすることが多いです。

ドメイン

リニューアル案件の場合はドメインは取得済みなことがほとんどですので、変更しない限りそのまま使用します。ただし、ドメインの取得名義が発注主ではない場合は、ドメイン譲渡の作業が発生することがあるので確認します。くわしくはドメインとは?をどうぞ。

サーバー

すでに使っているサーバーのスペックに問題がなく、名義も発注主のものであればそのまま使用します。SSLについても確認します。

アクセス解析コード

Google Analyticsなどのアクセス解析ツールを利用中であれば、そのコード情報を連絡してもらいます。

検索エンジン対策

Search Consoleのような、サイトの情報を検索エンジンに知らせるための登録作業を発注主、制作側でどちらが行うかの取り決めをしておきます。

仕様書の作成

Webサイト制作に必要な情報をまとめます。準備で得た情報やディレクトリ構造、FTP情報、対応ブラウザ、CMSなどの設定が含まれます。提出のタイミングは大抵、ヒアリング2次や全てのカンプ提出、分類別提出の初めの方になることが多いです。

デザイン・コーディング・公開

事前の確認を終えると作業を進めます。コツコツやります。

Webサイト公開後

検索エンジン対策やURLリダイレクト設定、公開後に気づいた部分の調整をします。あと、CMSを使用する場合はマニュアルをお渡しして説明をしたりと、Webサイト運営ができるようにして完了です。

Webサイト制作のだいたいの流れは以上です。

Author

  • Shinichi Kuroda - 黒田晋一
  • 香川県高松市 - Takamatsu-shi, Kagawa, Japan.
  • Mail - info@studiobusstop.com