自サービスのウェブサイトをリニューアルするときに考えたこと

女性起業家のためのITコンサルタント、藤本高司です。

さて、今回はサービス提供のサイト「もっとアシスト(今ご覧頂いているページですね。)」のトップページをリニューアルいたしました。

以前はどんなだったかというと、普通に何も書かれていない画像スライダーが流れていて、ブログの最新記事とお知らせが一覧化されているだけ。
メニューからジャンプしないと何もわからないんですよね。

せっかくLightningという素敵なテーマがあるので、コレの機能を生かして、トップページをリニューアルいたしました。

リニューアル後のトップページ

事前にお伝えしておきますが、私はノンデザイナーですので、あんまりデザインについて突っ込んで考えたくないんですよね。

そういう意味では、Lightningというテーマは、中身さえきちんと考えておけばホームページ然としたページを作れる良いテーマだなと思っています。

デザインが似通ってしまうところはありますが、そこは知識でカバーしていく、ということでしょうか。

さて、今回工夫したのは以下の3点です。

  1. 3PRブロックに置くもの
  2. ページの構成方法
  3. スライダーのメッセージ

それぞれ説明していきますね。

3PRブロックに置くもの

今回、3PRブロックに置くものは悩みました。

以前は、自分のサービスの特徴を3つ書いていたのですが、それでは具体的に何を提供してくれるのかがわかりにくいということを踏まえ、今回は提供するサービスの内容を記述しています。

これで、どういうことをやっている人なのかというのをさっと流し見できるようにしました。

(ここから更に詳細へのリンクも張っていく予定です。)

ページの構成方法

次に、今回のページの構成方法は、Lightningインストール時に合わせてインストールを進められるVK ExUnitというプラグインの機能を使って構成しています。

このプラグインをインストールすると、いろんなウィジェットが追加されるのですが、その中にあるのが「VK_固定ページ本文」というウィジェット。

このウィジェット、何をするかというと、その名の通り固定ページに書かれている内容の本文をそのまま表示してくれるという、一見「何に使うのそれ?」的なウィジェットなのですが、これは実はLPの構成などに使えるらしいのです。

こんなふうに、固定ページの本文を積み木のように組み立てていくことができる。

固定ページを複数作ってサービスの案内を作り、それを1枚のページとして構成しなおせる、というような感じですね。

今回はそれを使ってここに作ったページの内容を順番に流し込むように構成してみました。

ちなみに、それぞれのページは以下のURLで別々に見ることもできます。

パソコン・スマホが怖い

もっとアシスト 3つの特徴

これからも一人で悩み続けるのか、解決の糸口を掴むか

こうすることで、LP然としたページを作りつつ、独立したページとしても構成できるので、ゆっくり巡回してくれる人向け、1ページでまとめて読みたい人向けとそれぞれにページを用意することができるわけですね。

スライダーのメッセージ

さて、そこまで構成したら、最後はスライダーのメッセージを変更しました。

スライダーとはトップページに表示されているこの画像の部分です。カルーセルとも言います。

このスライダーが結構曲者で、実はこのスライダーというものは殆ど見られていないという調査結果もある(*1参照)らしく、本当は必要ない可能性もあるなとも思いましたが、ここを動画を使わずにプレゼンテーションする場として使うこともできると考え、今回は4枚のメッセージスライドとして構成しました。

スライド1、セールスレターで言うところの「ヘッドライン」

まずは、1枚目のスライド。
ここでは、自分の来てほしいと思っているお客様に「あ、自分のことだ!」と思ってもらうためのコピーを掲載してみました。

今回の渡しの場合だと、女性の起業家向けの一文です。

今回は具体的に「女性」とは書いていませんが、多くのITが苦手な女性はITに対して恐怖感を抱いているということがわかってきた(一方、男性はあんまり恐怖感を感じない様子)ので、今回は「恐いと思っていませんか?」と問いかけることで女性に刺さりやすくなるようになる、と考えています。

また、自分でビジネスを回している方は、必然的に集客についても考えていかなければならない。
そういう意味で、「ネット集客」というキーワードも含めています。

スライド2)セールスレターで言う「リード文」

次に、2枚めのスライド。

ここでは、ヘッドに続いてより興味を持ってもらうためのリード文ということで、より具体的な状況がイメージできる文を掲載してみました。

ここに書かれているようなこと、実際にも結構あるみたいなんですよね。
「パソコンのこと聞いたら怒られた!」みたいな。

わたしも知り合いのコンサルタントさんから話を聞くと「自分が教えたいこと以前にパソコンの操作ができない人が多すぎて困ってる」という話が出てくるケースがちょこちょこあります。

これは本当に不幸なマッチングで起こった事故みたいなものです。

でも仕方ないんですよ。
だって本当はパソコンのことを聞かなければならない人が、ぜんぜん違う話を聞いているようなもので、一方でパソコンの専門でもない人が、自分の教えたいと思っていることと全然違うことを聞いてくるみたいなものなので、そんな時はホントわたしまで相談してください。

わたし何回聞かれてもOKです。
他の人が何回聞いてきても怒りません。自分が何回も聞きたいタイプですからw

おっと、脱線しちゃいましたね。
2枚めは、リードというだけあって、最後まで読んでもらうための導線となる部分になります。

スライド3)セールスレターで言う「ボディ」

さて、次は3枚目。いよいよボディ、つまり本文です。

とはいえ、今回は、起承転結の「転」的なポジションでもあったので、言葉は一言にまとめました。

たった一言。
わたしに相談してほしい。
それだけです。

今回のトップページの役割としては、お問い合わせをいただくこと。そう考えたら、アクションを促すための文章といえば「相談してほしい」だけですよね。

ということで、シンプルに一言でまとめるのがベストと判断しました。

スライド4)セールスレターで言う「クロージング」

さて、最後のスライドです。

ここではセールスレターで言うところのクロージング、つまり相手にアクションを取ってもらうための後押しのようなものです。

お客様がほしいと思っている未来。その未来に、わたしだったら連れていけるんですよ、と説明をする文を入れています。

ということで、ここまでできればトップページのスライダーとしてはなかなかいい感じに仕上がったんじゃないかと思います。

このあたりの構成に関して非常に参考になるのが、以下のページです。こちらもぜひご覧いただくと、より理解が進むかと思います。

(*1)アンチパターンと言われるカルーセルを改善するポイント | UX MILK

最後に

ということで、今回はトップページのリニューアルにおいて、工夫をこらしてみたポイント3つをご紹介いたしました。

ちなみに、今回のトップページの目的は、なんといっても「問い合わせをいただくこと」です。
これがないことには始まらない。ということで、最後には申込みフォームまで組み込んでいます。

  • 相手にどんなアクションを取ってもらうことが目的なのか。
  • そのアクションを取ってもらうためにどんな説明が必要か。
  • そもそも読んでほしい人はどんな人なのか。

今回のページ作成を通じて、アタリマエのことではありますが「導線を作ること」がめちゃくちゃ大切だなと改めて痛感したのでした。

ちなみに、ワードプレスの使用方法、テーマ選びなどでお悩みでしたら、ぜひ私までご相談ください。

▼相談はこちらから

https://assist.motta.jp/

 

あとがき

「女性起業家のためのITコンサルタント」←この肩書は今回から使いました。

女性起業家向けとか考えていなかったのですが、現実的には今のクライアントさんが女性比率が高すぎるため、素直に名乗ることにしました。

なんかいいらしいですよ。
悩みとか全部話しやすいって言われて嬉しい限りです。

あなたも人に言えないお悩みを抱えておられるのであれば、ぜひ一度お話しましょう。

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください