Downloaded 10 times
Uploaded bySeiko Kuchida
SaCSS vol.79「CMSがらみのサイトの受発注で確認すべきこと」
SaCSS（札幌コーディング勉強会） vol.79の資料に補足を加えたものです。CMSを利用したサイトを制作する前、デザイナー・コーダーへの発注・着手前にディレクション関連で確認すべきことを紹介しています。
More Related Content
![運用まで見越したWeb CMS導入のチェックポイント[効率化] Webマスター必見！](https://cdn.slidesharecdn.com/ss_thumbnails/ust20110203hk20110131hk-110202020305-phpapp01-thumbnail.jpg?width=640&height=640&fit=bounds)
SaCSS vol.79「CMSがらみのサイトの受発注で確認すべきこと」
- 1. 口田 聖子 ::WebbingStudio 2016.08.27（Sat）@ わくわくホリデーホール SaCSS 札幌コーディング勉強会 vol.79 CMSがらみの サイトの受発注で 確認すべきこと
- 2.
- 3.
- 4.
- 5.
- 6.
- 7. CMSサイトの制作前の話 • まず、念頭に置くこと • 受注時のヒアリング •ワイヤーフレームから読み取る • デザイナー・コーダーへの発注 • ハマりやすい落とし穴 • まとめ 発注側のディレクターさんに知ってほしいこと
- 8.
- 9. 何が入るか わからない イレギュラーな入力例は 常に考えておく photo by ArtoAlanenpää - CC BY-SA 4.0 https://creativecommons.org/licenses/by-sa/4.0/
- 10.
- 11.
- 12.
- 13.
- 14.
- 15.
- 16. 最初の問い合わせ時 • 最も重要な情報はサイトマップ • サイトマップもまだであれば 参考にしたいサイトのURLを確認 •リニューアルであれば現行サイトのURLも • サイトを見てコンテンツの種類と ボリューム感を推理する
- 17.
- 18. ボリューム感とは 想定される細かい作業の量・やり取りの手数 • 作業量が少ないコンテンツ • ギャラリー／資料アップロード •作業量が多いコンテンツ • ブログ／商品情報／イベント情報 • インポート作業を含むコンテンツ • 現行サイト／ECサイトからの移行
- 19. 提供してほしい情報優先度 1. サイトマップ 2. 予算感 3.必須要件 4. 採用するCMS（採用する理由も） 5. 使用予定サーバー 6. 更新担当者の情報（人数・リテラシなど）
- 20.
- 21.
- 22.
- 24.
- 26.
- 29.
- 31.
- 33.
- 35.
- 37.
- 38.
- 39.
- 40. デザイナーとCMS (1) • 文字数が変わる可能性がある箇所を必ず伝える •デザインが固定となる箇所も伝える • サムネイルの縦横比（正方形／4：3／幅だけ固定） • SNSボタン • ブロック編集型CMSの特殊パーツ • プラグインで自動生成するフォーム
- 41. デザイナーとCMS (2) •ページネーションこわい • デザイン・コーディングが自由にできるCMSが少ない •「○ページ中 ○～○ページ」が困難なCMSも • jQueryライブラリ前提の演出を入れてしまう デザイナーさんがけっこう多い • メニュー表示、ページ遷移などはワイヤーできちんと指示
- 42.
- 43. コーダーとCMS (1) • スケジュールがけっこうタイトになる •最初に作ってもらうのはプライバシーポリシー • 見出し、段落などの基礎構造がはっきりしている • 基礎構造が出来次第、一旦送ってもらう • 急ぎ案件ではCSSフレームワークが共通語 • ただし、デザインが細かいと工数が増えることも
- 44. コーダーとCMS (2) • マークアップ変更が難しい箇所 •ブロック編集型CMSの特殊パーツ • プラグインで自動生成するパーツ etc… • 状況により対応を判断 • 出力されるHTMLを抜き出して渡す • functions.phpでHTMLを加工 • そこは省いて作ってもらい、CMS担当が巻き取る
- 45.
- 46.
- 47.
- 48. デザインカンプの確認 • 変更の可能性がある箇所に デザインフォントを使っていないか？ • Webフォントを使うなら問題なし •文字数の増減を想定しているか？ • 工数が極端に増える演出を入れていないか？
- 49. コーディングデータの確認 • グリッドの一覧ページは特に注意 • 行ごとの回りこみ解除をどのようにしている？ •CMSでの再現・モバイル対応に無理はないか？ • コンテンツごとにCSSが 異なる場合 追加CSSはどうしてる？ • bodyのclass？ • カテゴリーごとにCSS切り替え？
- 50.
- 51.
- 52. スケジュールの悩み • CMS構築が予定通り進まないことが増えた • 「○日までに着手できないと間に合わない」 デッドライン式でスケジュールを組む •デザイン未確定でもできる CMSの設置・設定・検証などを 先に作業させてもらう アジャイル？
- 53. 一般向けのCMSと予算 予算を減らしたいだけの理由で、ライセンス費用がかからない CMSを指定されることがあるが… 理由もなく、特別安くすむCMSはない。 必ずどこかに「工数」がかかる。 ラ 調査コスト デザイン・コーディングとの連携保守コスト ラ 調査コスト デ・コ連携 保守コスト ライセンス 調査コスト デ・コ連携 保守コスト ライセンス 調査コスト デ・コ連携 保守コスト
- 54. 補足 「ページ・ブログで構成された、10ページ前後のサイトを 構築した場合に想定されるコストの内訳」 に対する、うぇびんの雑感です それぞれがどのCMSを指しているかはここでは伏せます ラ 調査コスト デザイン・コーディングとの連携保守コスト ラ 調査コスト デ・コ連携 保守コスト ライセンス 調査コスト デ・コ連携 保守コスト ライセンス 調査コスト デ・コ連携 保守コスト
- 55. サーバーは早めに確認 • 予定していたCMSが設置できないのは致命的 • クラウドサーバーの場合 公開前は予算節減でスペックを落としていることも （管理画面おっそ！） •.htaccessやphp.iniなどの編集権限がないと 日数ロスが大きい
- 56. 誰が更新する？ • ページ更新を制作会社がする場合は HTML直打ちを前提とした方が喜ばれることも • 初心者にWordPressのUIは操作しにくい •外部委託の更新担当者の端末が古くて CMSが動かない！ということも…
- 57.
- 58. パーマリンクとリダイレクト • Movable Typeに慣れていると見落としがちなこと •パーマリンクを自由に操作できないCMSもある • つまり、旧サイトからのリダイレクトが難しい • 数百行のリダイレクトを書くことになることも… そもそも、リダイレクトが 必要なコンテンツなの？
- 59.
- 60. ほうれんそう • 各方面との連絡を常にしっかり取る • クライアント不在は厳禁 •CMS構築で社長のちゃぶ台返しはダメージが大きい • チャット・タスクがある管理ツールは必須 • Slackは過去ログのタスク化が難しい • チャットワークはスマホアプリの操作がいまいち • Backlog・サイボウズLiveは見落としが出やすい
- 61.
- 62.
- 63.