質問クリックで回答スライドダウン--スマートQ&A【無料】

スマートQ&A

よくある質問とそれに対する回答がセットになったQ&Aからなるホームページは業種を超えてよく見かけます。Q&Aページは、ユーザーからのさまざまな疑問をしっかり網羅し、きちんと回答することが好ましいわけですが、そうすると、かなりのスペースを費やしてしまいます。最初は質問リストだけ、ユーザーが関心のある質問をクリックするとその回答が開くようになっているとスマートです。

スマートQ&Aとは

最初は質問リストだけを表示し、ユーザーは質問をクリックすると、スライドダウンして隠れていた回答が現われる -- これがスマートQ&Aです。ユーザーは質問リストに留まったまま、次々と質問と回答を確認できるので、非常に読みやすく、わかりやすいページになります。また、初期設定では、一度開いた回答は、別の回答を呼び出したときに、閉じる設定になっていますので、Q&Aの項目が多い場合も、ページレイアウトをコンパクトのままにできます。
スマートQ&Aは、質問と回答が並んだ既存のQ&Aページにも無料で導入することができます。

スマートQ&Aのサンプル

よくあるご質問

Q1. 回答は文章だけでなく、画像や動画の場合もあるのですが、その場合もスマートQ&Aは対応しますか?
A1. はい、画像でも動画でも、ユーザーが対応する質問をクリックしたときのみ、表示することができます。
Q2. 最初回答欄が表示されないのでは、回答にキーワードが含まれる場合、SEO には不利ではないですか?
A2. いいえ、表示されなくても回答欄自体は存在し、検索ロボットにはアクセス可能です。ですから、回答欄のキーワードも検索データベースに登録されます。
Q3. 1度開いた回答が、別の質問をクリックしても、閉じずに開けたままにしておくことはできますか?
A3. はい、できます。設定する際に、Q&Aセクションに class="open" というクラス属性を追加するだけで、開けたままになります。なお、open属性を付けた場合でも、質問をもう一度クリックすれば、回答が閉じます。
Q4. スマートQ&Aを導入するのはどうすればいいのですか?
A4. 本ページの「スマートQ&A ダウンロード」をクリックすると、ダウンロードページへリンクします。ダウンロードページでは、詳しい設定の仕方を解説し、末尾に無料でダウンロードできるボタンが設置してあります。
Q5. Q&Aページを設置するにはどのようなスキルが必要ですか?
A5. HTMLの初歩的なスキルがあれば、簡単に設置できます。
Q6. 質問の順番を入れ替えたり、新たに質問回答を挿入したりできますか?
A6. はい、できます。スマートQ&Aは質問と回答が並んでセットになっているので、順番を変えたいときは、希望する順番にセットを並び替えればOKです。新たに質問と回答を挿入する場合は、挿入したい位置に新しいセットを挿入してください。
Q7. 1ページのうちに、項目ごとにQ&Aセクションがあり、しかも、普通の説明文や画像があるのですが、そのすべてのQ&AセクションにスマートQ&Aを挿入することはできますか?
A7. はい、できます。各Q&Aセクションに class="smart-qa" の指定をするだけでOKです。
スマートQ&A ダウンロードページ

スマートQ&A のメリット

多岐にわたる質問に対して、丁寧な回答を用意できる。
膨大なQ&Aセクションであってもすっきり、わかりやすく表示することができる。
既存のQ&Aセクションに導入できる。
あとから質問/回答をの修正、削除、挿入・追加できるので、Q&Aセクションを充実させることができる。
Q&Aというコンテンツをスマートに見せることができる。
ユーザーは質問リストから自分が知りたい情報に簡単にアクセスできる。

スマートQ&Aの応用

複雑な手順を説明する際、まずは大まかなステップのみを表示し、どれかのステップをクリックしたとき、それぞれの細かなステップを表示させる。
最初に全体の構成を示し、各要素をクリックしたら、その下層の構成を表示させる。

スマートQ&Aの使用条件

スマートQ&Aは、CC(クリエイティブ コモンズ)ライセンスの 表示 + 継承 です。 ですので、 jquery.smart-qa.js と smart-qa.css 冒頭の弊社のクレジットは消さないでください。
プログラムの改変は自由ですが、改変したプログラムは、本プログラムと同様、CC(クリエイティブ コモンズ)ライセンスの 表示 + 継承 で公開しなければなりません。
なお、商用/非商用関係なく、許可なく、お使いいただけます。

まとめ

スマートQ&Aは、質問と回答を1セットにして並べたもので、最初は質問だけが一覧表示されます。ユーザーがどれかの質問をクリックすると、対応する回答がスライドダウンして表示されます。初期設定では、次の質問をクリックすると、前の回答が閉じ、質問の回答が開きます。スマートQ&Aは、既存のQ&Aページにも導入できます。

スマートQ&A ダウンロードページ


コメントを残す