calendarcodediamondfacebookfingerglobalgoogleplushatenahomepagetopplainpocketrssservicetwitterwordpresshome2searchfoldernext-arrowback-arrowfirst-arrowlast-arrow

すごい役立った!Web制作に特化した「提案書」に入れておきたいこと、知識

Website_Proposal

提案書に必ず書いておきたいことを順を追ってメモしました。イメージはブログ用なので簡易的なものとなっています。フローや内容は会社によって違うと思います。

PR
IT/WEB業界への転職なら
Sponsored Link

もくじ

サイトリニューアルの提案

サイトリニューアルの提案

企画提案書の流れをメモしておきます。実際に提案するときは、ポイントをおさえて簡潔に説明していきます。必要な部分だけピップアップして使います。

自社分析によるサイトの問題点とその解決策

problems_solutions_coding

表紙はクライアントの会社名(株式会社○○御中)、企画提案書の題名、年月(○○年○月○日)、自社名を記載します。

次にサイトリニューアルの場合は、ヒアリング内容をもとに現状分析と問題点を書き出し、それに対しどういった解決策を提案するのかを書き出します。具体的な数値を入れるといいですね。型は以下のサイトを参考に(Webデザインのタネさんのページは上部はリンク切れ、下部はリンクあり)。

どういったサイトにつくり上げるのか明確にわかりやすく記載していきます。例えば情報を探しやすいサイトなのか、デザイン(見やすさ わかりやすさを重視したデザイン)、システム(専門的な知識を必要とせずに運用できるシステム)、保守(管理者に負担をかけない)など。

見やすさ、管理しやすさへの主な工夫

uxui

上の図はナビゲーションに対しどういった工夫をするか一例を書いてます。「誰に何をどのように」を伝えることができるのか考え整理します。画像とテキストで1ページ内におさめて書きます。ポイントはクライアントにとって、どういったメリットがあるのか、どう利益につながるのかを伝えることだと思います。一例だと以下のような感じです。

  • グループ毎にまとめられた探しやすい情報ブロック(可読性・精読率を高め直帰率を下げる)
  • サイトストラクチャに従ったページ遷移するためのナビゲーション(回遊率を高め平均PV数を上げる)
  • 階層構造とは独立した機能を持つナビゲーション(目的の情報への到達速度を上げ、快適に使えるように)
  • 効果的なレコメンドを展開できる情報ナビゲーション(ファーストビューで関連商品の認知率を上げる)
  • キーワード候補を動的生成するダイナミックナビゲーション(ページ遷移なしで、カテゴリ一覧を見れる)
  • 背景色+色のコントラストやaltタグなどのアクセシビリティ
  • サイト内絞込検索は使いやすいか、分かりやすいか
  • スマホ表示では、限られたスペースで必要な情報と機能を配置するデザイン
  • 会社概要はプリントアウト可能、常に最新情報

サイトレイアウト案(トップページ)

layout_toppage_coding

簡易的ですが上の図はトップページの案。実際はトップページ、詳細ページ、カテゴリページなどのレイアウト案を3パターンほど用意します。実際に作ったワイヤーフレームやデザインカンプを埋め込み、クライアントさんにサイトイメージを理解してもらうためのものです。企画をどのようにデザインに落とし込んだのか、クライアントへ伝えることが目的となります。

フロント画面+管理画面 イメージ

screenimage_coding

クライアントさんが実際に使う場合、どういったCMSなのか、ログイン画面や管理画面のイメージ図を盛り込みます。管理のしやすさや使い方も気にしている人がいるからです。

集客で悩んでいるようであれば、SEO対策の施策を追加します。ヒアリングで聞いた内容をもとに改善させたいキーワード例、メタの改善例、どれだけ情報を追加することが可能かを明記します。また保守内容、無料サポート期間の内容を記載します。

保守+運用

maintenance_coding

クライアントさんは、納品後に制作会社がどこまでサポートしてくれるのか、月間保守はどのような内容なのか気になってます。無料サポートが切れて、保守を頼まれるクライアントさんもいます。サーバー保守、解析レポート、広告出稿、SEOレポートなど自社で可能なことを書きだし、毎月どういった立案をしていくのか、対策方針を立てれるのか、PDCA運営をサポートできることをアピールします。

クライアントさんは、サイトリニューアルした後にどれだけ利益が出ているのか、効果的な集客等を考えるので、ここに一番力をいれます。

セキュリティ面でのご提案

security_coding

実現可能であれば絶対に記載しておきたい部分です。暗号化通信処理(https)の利用、個人情報の取り扱い、ベリサイン証明書、ガンプラー対策、DoS攻撃対策、アップデートなどが可能であることを記載します。

問い合わせフォームや管理画面にhttpsを利用するのか、ウィルス対策でFTPによるサーバーアクセス禁止にするのか、脆弱性への早期対策が可能であるなど具体的に明記します。

バックアップと緊急時の対応

emergency

ページ+DBバックアップ先と方法、サイクル、保存期間。データ復旧方法、HP稼働確認の実施など、データ復旧に対する問い合わせは日中いつでも対応できる体制だと明記します。

サイトマップ案

sitemap_proposed_coding

新規サイトの場合は通常のサイトマップ、リニューアルの場合は現行と新サイトマップを比較できるような提案内容に。

強み、実績、事例

強み、実績(例:様々なCMS、EC-CUBE、XOOPS、OpenPNEなどの開発実績、他社が行えない保守)どれだけ構築事例があるのか。

構築事例はURLとサイトキャプチャを使い見せ、使用CMS、CVの成果などを書き足します。

スケジュール

schedule_coding

制作の一連の流れ(例:ご提案、企画、画面構成作成、UIデザイン作成、コーディング、画像作成、アップ、ご確認、サイト公開)と制作期間をエクセルにまとます。

最後のページでは会社概要や問い合わせ先とロゴを入れたら完成です。

スポンサード リンク

この記事を書いた人
投稿者:commte

株式会社コムテ代表取締役。2015/8:弊社にてWeb制作スクールを開始。 WebDesign + Web制作 (最新情報 配信)。おっとりした話し方をするおっさん。

URL:西田 鉄平
この後によく読まれている記事

Comments

Leave a Comment

コメントする