SNSで曲を気に入ってくれた人が、プロフィール欄のリンクから公式サイトに来てくれる。せっかくのその瞬間に、何を見ればいいのかわからないサイトだと、数秒で離脱されてしまいます。せっかく作った公式サイトを本当に機能させるには、デザインの見た目以上に「初めて来た人がどう動くか」を考えた構成が重要です。
初めて来た人は何も知らない
サイトを作っている本人は、自分の活動をよく知っています。そのため、つい「知っている前提」でページを組んでしまいがちです。しかし初めて来た人は、活動名の読み方も、どんなジャンルの曲を作っているのかも、何一つ知りません。
トップページを開いた人が最初の数秒で知りたいのは、主に次の3つです。
- 誰が、何をしている人なのか
- どんな曲を作っているのか(ジャンルや雰囲気)
- どこで曲を聴けるのか
この3つが最初の画面(スクロールしなくても見える範囲)に収まっているかどうかで、そのあとページを読み進めてもらえるかが大きく変わります。逆に言えば、この3つさえ最初の数秒で伝われば、多少デザインが簡素であっても、次の行動につながる可能性は大きく上がります。
「最初の数秒」で判断される理由
インターネット上のコンテンツは、ほかにも無数に存在します。SNSのタイムラインで次々と流れてくる投稿の中から、ある人がわざわざリンクをタップして公式サイトを訪れたとしても、そこで「読み込みに時間がかかる」「何のサイトかすぐにわからない」という状態が続けば、タイムラインに戻ってしまうのは自然な行動です。
これは怠慢ではなく、情報が多すぎる環境での合理的な判断です。だからこそ作り手の側は、「相手が興味を持ち続けてくれる前提」で作るのではなく、「相手はいつ離脱してもおかしくない前提」でページを組み立てる必要があります。
トップページに置くべき優先順位
限られた画面の中で、すべてを平等に見せることはできません。優先順位をつけて配置することが大切です。
| 優先度 | 要素 | 置く場所 |
|---|---|---|
| 最優先 | 活動名・肩書き・代表曲の再生 | 最初の画面 |
| 高 | プロフィールの要約(1〜2文) | 最初の画面の近く |
| 中 | 新着のお知らせ | トップページの上部 |
| 中 | 作品一覧への入り口 | トップページの中盤 |
| 低 | 詳しい経歴、写真ギャラリー | 別ページに分けてもよい |
代表曲がその場で再生できることは特に重要です。曲を聴くために別サイトへ移動が必要な構成だと、そこで離脱する人が一定数出てきます。ボタンを押して外部の配信サービスに飛ばされ、さらにそこで再生ボタンを探す、という手順が増えるほど、実際に聴いてもらえる確率は下がっていくと考えられます。
迷わせない導線を作る
メニューの項目は絞る
メニューに項目を詰め込みすぎると、どこに何があるのかわかりにくくなります。多くの場合、次の程度で十分機能します。
- トップ
- 作品
- プロフィール
- お知らせ
- お問い合わせ・リンク
「メンバー紹介」や「ライブ情報」など、活動の形によって必要な項目は追加してかまいませんが、7〜8項目を超えると、初めて来た人はどこを見ればいいか迷い始めます。メニューは「案内板」であって「目次」ではありません。すべての情報を並べるのではなく、次にどこへ進めばよいかを示す最小限の道しるべとして設計しましょう。
ボタンの文言は具体的に
「詳しくはこちら」より、「最新曲を聴く」「プロフィールを見る」のように、押した先に何があるのかがわかる文言のほうが、クリックしてもらいやすくなります。特にスマートフォンでは、ボタンの文言だけを見て次の行動を決める人が多いため、具体性が効果を発揮します。
スクロールの終着点を作る
ページの一番下までスクロールしたときに、次に何をすればいいのかわからない状態は、そこで訪問が終わってしまいます。ページの最後には、SNSのフォローボタンや、ほかの作品への誘導など、次の行動につながる要素を置いておくと、1回の訪問から複数の接点が生まれやすくなります。
情報の順番にストーリーを持たせる
トップページを上から下に読んだときに、自然な流れになっているかも確認しましょう。「誰なのか」→「どんな曲か」→「もっと聴きたい人はここへ」→「フォローや連絡はここへ」というように、訪問者の疑問が解消される順番で情報を並べると、途中で読むのをやめられにくくなります。逆に、経歴や受賞歴のような、初めての人にとって優先度の低い情報を冒頭に置いてしまうと、肝心の「どんな曲か」にたどり着く前に離脱されるおそれがあります。
スマートフォンでの見え方を最優先に考える
多くの訪問者は、SNSのアプリ内ブラウザやスマートフォンからサイトを開きます。パソコンの大きな画面で見栄えよく組んだレイアウトも、スマートフォンでは要素の順番が変わったり、文字が小さくなったりすることがあります。
- 最初の画面に収まる情報量を、スマートフォンの縦長の画面で確認する
- ボタンや文字が小さすぎて押しにくくないか
- 画像の読み込みが遅く、表示に時間がかかっていないか
パソコンで作ったサイトをスマートフォンの実機で開き直してみると、意外な見え方の崩れに気づくことがあります。制作の最後に、自分のスマートフォンから実際にアクセスして確かめる工程を、必ず入れておきましょう。
情報の「鮮度」を保つ
離脱を防ぐ構成を作っても、中身が古いままでは意味がありません。次のような状態は、せっかく来てくれた人の期待を裏切ってしまいます。
- トップページの「最新情報」が半年前のまま
- 「近日公開」と書かれた曲が、数ヶ月経っても公開されない
- リンク切れのSNSアカウントが残っている
新曲を出す、ライブに出演する、といった活動があるたびに、トップページの情報を更新する習慣をつけておくと、再訪問した人にも「ちゃんと活動している人だ」という印象を与えられます。更新を習慣にする具体的な工夫は、公式サイトの更新を習慣化するための考え方でも紹介しています。
読み込みの速さも導線の一部
デザインにこだわるあまり、大きな画像や動画を多用すると、ページの読み込みが遅くなることがあります。特にモバイル回線では、表示に数秒かかるだけで、読み込みを待たずに離脱されてしまうことがあります。
- 画像はできるだけ圧縮してから使う
- トップページに動画を自動再生で埋め込む場合は、読み込みへの影響を確認する
- 使っているサービスに画像の自動最適化機能があれば活用する
見た目の美しさと表示の速さは、しばしばトレードオフになります。どちらも完璧を目指すより、「初めて来た人がストレスなく必要な情報にたどり着けるか」を基準に、バランスを取ることが大切です。
見直しのタイミングを決めておく
サイトの構成は、一度作って終わりではありません。活動のフェーズが変わるたびに、見直す価値があります。
- 新曲をリリースしたとき、代表曲を差し替える
- 活動の軸が変わったとき(バンド活動からソロ活動になったなど)、プロフィールと構成を見直す
- 半年に一度は、初めて来た人になったつもりでトップページを開き直してみる
こうした定期的な見直しの機会を作っておくと、サイトが活動の実態から取り残されることを防げます。マイグルのようなアーティストページ作成サービスでは、作品やお知らせを追加するだけで構成がある程度整うテンプレートも用意されているため、細かいレイアウト調整に時間をかけられない場合の選択肢としても検討してみてください。
