『ヘルプサイトの作り方』
https://gyazo.com/753867a39818afe8bff6b2a3d6b5d717
2019年2月16日紙版発売
2019年2月16日電子版発売
はじめに
第1章 ヘルプの基本
ヘルプ制作に必要なスキル
ヘルプ制作に文章力は必要?
文章力より設計力
ヘルプの役割
プロダクトの使い方をユーザーに伝える
サポートコストを低減する
プロダクトの改善ポイントを知る
良いヘルプの要素
役に立つ
探しやすい
正しい
わかりやすい
ヘルプを制作する流れ
誰に何を伝えるかを整理する
構成を設計する
スタイルガイドや用語集を準備する
記事を作る
記事をチェックする
公開後にフィードバックをもとに改善する
第2章 誰に何を伝えるかを整理する
プロダクトの利用ユーザーを理解する
ヘルプのターゲットユーザーを絞り込む(ペルソナの設定)
ペルソナとは
ペルソナの設定による効果
ペルソナの例と構成要素
課題と目的
立場と役割
事前知識
プロダクトの仕様に関する情報を収集する
プロダクトの使い始めに必要な準備と基礎知識
各機能の利用目的と操作方法
期待に応えられないところ
よくあるトラブルとその対処方法
自分でプロダクトを使う
使用中に感じたことを書き出す
使用中につまずいたところを書き出す
第3章 ユーザーの使い方を意識して構成を設計する
ユーザーの情報の探し方を理解する
情報探索の4つの行動モデル
既知項目検索
探求探索
再検索
全数探索
回遊的な動線と直線的な動線がある
ユーザーはページを流し読みする
ユーザー像を意識してヘルプの構成を設計する――サイトマップの作成
構成設計の2つのアプローチ
カテゴリー構成と動線を決める
初心者向けカテゴリーの動線
カテゴリー構成のパターン
内容をイメージできるカテゴリー名にする
意味の重なりを避ける
一般的な用語を使う
記事のタイトルを決める
ユーザーが使うキーワードに合わせる
内容をイメージできるタイトルにする
記事を読む必要があるかわかるタイトルにする
語尾を統一する
第4章 ユーザーの動線からナビゲーションを設計する
ナビゲーションの種類と役割
構造型のナビゲーション
グローバルナビゲーション
ローカルナビゲーション
関連型のナビゲーション
機能型のナビゲーション
検索
サイトマップ
パンくずリスト
トップページからのナビゲーション
トップページに配置する情報を選ぶ
トップページに情報を載せすぎない
トップページからの移動だけを考えない
モバイルのナビゲーション
レスポンシブデザインでモバイルに最適化する
モバイルユーザーの行動を理解する
記事の表示を優先する
構成をPC向けと合わせる
プロダクトからのナビゲーション
ユーザーの迷いどころにヘルプリンクを配置する
ヘルプだとわかるリンク名にする
リンクを管理する
ユーザーが疑問を解決できているか確認する
第5章 スタイルガイドや用語集を準備する
スタイルガイドで表現を統一する
文字表現
文体
漢字とひらがなの使い分け
日時の表現
数値の表現
記号
参照リンク
例として出す人名やドメイン
スクリーンショット
OSとWebブラウザー
画像の形式
加工方法
ファイル名のルール
注意事項などのスタイル
用語集で用語を統一する
用語集に載せる用語
Webデータベースで効率的に用語を管理する
第6章 記事を作る――文章と図解のテクニック
アウトラインを決める
ユーザーのスタートとゴールを決める
ユーザーに伝えることを書き出す
書き出した情報を整理する
見出しを決める
わかりやすい文章のテクニック
一文一義
簡潔に書く
ユーザーに求める操作を明確に書く
主題(言いたいこと)から書く
ユーザーを主体にする
列記には箇条書きを使う
項目の順番に意味がある場合は番号を付ける
項目が多い場合は分類する
表を適切に使う
見出しで情報の区切りを明確にする
視覚的な変化をつける
誤解を防ぐ文章のテクニック
二重否定を使わない
係り受けを明確にする
主語と述語の対応に気をつける
主語,目的語と述語を近づける
わかりやすい機能説明のテクニック
ユーザーの馴染みのある知識と関連付ける
リード文から入る
概要を挟む
わかりやすい操作手順のテクニック
一画面一手順
ユーザーの操作だけを手順にする
作業の目的を書く
スクリーンショットを効果的に使う
説明したいことに応じて撮影範囲を変える
ほかと区別のつく色で加工する
ハイライトする箇所を説明と一致させる
わかりやすいトラブルシューティングのテクニック
ユーザーが何をどのように探すかを意識する
状況,原因,対処を伝える
図解で視覚的に伝えるテクニック
図解の効果
図解の弱点
ルールを理解した上で使う
図解のテクニック
ユーザーの視点から描く
「囲む」「配置する」「つなぐ」を組み合わせる
囲む
配置する
つなぐ
特定の意味を持つ図形に注意する
細部は削って単純化する
フローチャートでトラブルを診断する
色の基本を理解する
色相
彩度と明度
ドミナント
アクセントカラーでポイントを強調する
第7章 記事を検索最適化する
記事の検索最適化
トピックごとに記事を分ける
タイトルと見出しに検索キーワードを入れる
わかりやすいURLを付ける
タイトルの重複を避ける
リンク先の記事の内容がわかるリンク名を付ける
HTMLの検索最適化
リッチエディターのデメリット
HTMLの役割は情報への意味付け
サイト全体の構成を示す
記事のアウトラインを示す
強調を示す
重要度,深刻度や緊急度が高い情報の記述
操作画面上のボタンやリンクを表す記述
リッチスニペットで検索結果に記事のカテゴリーを表示する
第8章 データからヘルプを改善する
KPI(改善の効果を測る指標)を決める
KPIとは
ヘルプのKPI
アンケートの回答結果
平均解決時間
検索結果ページでの離脱率
結果が0件になる検索の割合
アンケートから改善する
アンケートでフィードバックを取得する
アンケートの質問項目を検討する
デザインを工夫して回答率を高める
アンケート結果を集計する
アクセスログから改善する
アクセスが多いページを確認する
検索頻度が高いキーワードを確認する
検索結果ページでの離脱が多いキーワードを確認する
わかりやすい集計レポートを自動的に作成する
Googleデータポータルの用語
期間を設定する
ヘルプ全体の情報を表示する
わかりやすい見出しを付ける
月ごとの集計値の変化を表示する
アクセス数が多いページを表示する
レポートのサイズを調整する
検索頻度の高いキーワードを表示する
検索結果ページでの離脱が多いキーワードを表示する
アンケートの結果を表示する
レポートの表示を確認する
レポートを共有する
第9章 ユーザーテストでヘルプを改善する
カードソーティング――記事分類のユーザーテスト
運用中のヘルプのカテゴリー構成をテストする場合
新規ヘルプのカテゴリー構成を検討する場合
ナビゲーションと記事のユーザーテスト
目的を設定する
タスクを設定する
シナリオを用意する
テスト前のストレッチ――思考発話の練習
テストを実施する
テスト後のインタビュー
第10章 アジャイル開発に対応するヘルプ管理システム
ヘルプを取り巻く環境の変化――アジャイル開発への対応
アジャイル開発に対応したヘルプ管理システム
記事制作を効率化する
マークダウン記法を使って記事を作成する
バージョン管理システムを使って記事を管理する
チェックを効率化する
プルリクエストを使って記事をチェックする
文章やリンクのチェックを自動化する
翻訳を効率化する
翻訳支援システムと連携する
機械翻訳
CMSへの取り込みを効率化する
GitHubを使ったサイト運用のワークフロー
ブランチとは
幹がない
ブランチをほかのブランチに合流させることができる
ブランチを活用するメリット
公開のタイミングを調整できる
開発要件の変更に合わせやすくなる
プルリクエストを活用できる
ブランチの種類と用途
プロダクトの更新に合わせてヘルプを更新する場合のフロー
リリース用ブランチを作成する
作業用ブランチを作成する
作業用ブランチをリリース用ブランチにマージする
リリース用ブランチを公開用ブランチにマージする
プロダクトの更新と対応しないヘルプ更新のフロー
作業用ブランチを作成する
作業用ブランチを公開用ブランチにマージする
参考文献,参考Webサイト
索引