LoveLetterWorks Logo

こんにちは。LOVELETTER WORKS株式会社の長浜です。

2020年11月ごろからFrigateの運営をしていますが、これまでWebサイトのデザインにまでは目を向けてきませんでした。個人的に「そこまで見えづらさは感じない」と思っていたからです。

しかし、よくよく考えるとカテゴリの機能を果たしていないことに気づきました。そこで2024年2月9日にWebサイトのデザインを変更！

今回は、Webサイトのデザインを変更した理由と変更するにあたって考えたこと、変更した結果についてまとめます。

Webサイトのデザインを変更した理由

FrigateのWebサイトは以前、カテゴリを「ニュース＆話題」「使い方/ノウハウ」「活用事例」の3つに分けてはいたものの、すべてまとめて更新された投稿順での表示でした。そのため、カテゴリの機能をあまり果たしていない状態になっていたのです。

そこで、カテゴリの機能を果たすためにWebサイトのデザインを変更することにしました。カテゴリを「インスタグラム」「TikTok」「アプリ」で分けることで、ユーザーが知りたい情報をすぐに探せるようにするためです。

そして「Frigate＝見やすいWebサイト」と認知してもらえてブックマークしてもらえたらいいな、というのがWebサイトのデザインを変更した理由です。

Webサイトのデザインを変更するにあたって考えたこと

1. カルーセルの表示

カルーセルの表示は以前からあり、残すようにしました。トップページにアクセスした際、最初に目につくのがカルーセルだからです。

カルーセルには、最新記事を入れるようにしています。たとえば、インスタグラムの新機能が出たときにカルーセルで表示されると目立ち、見てもらえる（PV数が上がる）と考えたからです。

直近でいうと2024年3月29日にアップした「インスタのストーリーズエフェクトが消えた！？原因と対処法」の記事。

3月29日〜5月9日のデータを見てみると、Webサイト内で71番目にPV数を獲得しています。1位〜70位までは過去の記事ばかりだったので、カルーセルに新規記事を入れるのは効果があると感じました。

2. カテゴリ別の表示

「インスタグラム」「TikTok」「アプリ」のカテゴリに加えて、「最新の記事」を含む4つをトップページに表示させるようにしました。カテゴリを分けることで、ユーザーが一目で「インスタグラムの記事」とわかるようにするためです。

また、インスタグラム・TikTok・アプリのカテゴリ別でも最事の順番に表示されるようになっていますが、最新の記事のカテゴリを追加した理由は「カテゴリを分けずに最新の情報を調べたいユーザーもいる」と考えたからです。実際に、FrigateのWebサイトはインスタグラムの記事だけでなく、アプリやTikTokの記事も見られています（インスタグラムに比べるとあまり見られてはいませんが……）。

たとえば「スマホの空き容量が無くなっても安心！写真や動画を保存するのにおすすめの保存サービス7選」の記事は、2024年1月1日〜5月9日でPV数「2,823」を獲得しています。

「アプリ」のカテゴリにあると4記事までしか表示されませんが、最新の記事のところは更新順に何記事も見られるようになっているため、見逃しを防げると考えて設置しました。

3. トップページ全体のデザイン

まず、記事は縦に1記事ずつしかなかった状態を横に2記事並ぶようにしました。最初は「多く見てもらえるよう横に3記事並べようかな」と考えていましたが、3記事だとギュッと狭くなり見えにくくなりそうだったため、2記事に変更。2記事にしたことで余白ができ、記事が見やすくなっています。

次に、インスタグラム・TikTok・アプリの記事はそれぞれ合計で4記事までの表示にして「Read More」を追加しました。表示される記事数が多いとごちゃごちゃした印象になってしまい、見えにくいWebサイトは離脱されやすいと考えたからです。

また、記事数が多いとスクロールをする手間が増えてしまいます。これもWebサイトから離脱される原因だと思うので、インスタグラム・TikTok・アプリの記事をそれぞれ4記事表示させるようにしました。

もっと調べたい方には「Read More」をクリックしてもらい、そのカテゴリのページにアクセスしてもらうようにしています。それぞれの記事を4記事表示にしたことで、個人的には見やすくなったと思います。

最新の記事に関しては、無限スクロールにしています。これは、新しく更新した記事をたくさん確認できるようにするためです。無限スクロールにしたことで、トップページを見るだけで「どの記事が最新なのか」を把握できるようになっています。

Webサイトのトップページのデザインを変更した結果

トップページのデザインを2024年2月9日に変更したので、2月9日以前とそれ以降の約3ヶ月間のデータを見てみました。

• 2023年11月10日〜2024年2月9日までのトップページのPV数は「559」
• 2024年2月10日〜5月9日までのトップページのPV数は「687」

少しではありますが、トップページのデザインを変更したあとのほうがPV数が増えています！ 現状デザインを変える予定はありませんが、Webサイトのデザインも重要なので時代の変化に合わせて変えていこうと思います。

まとめ

Webサイトのデザインは正直そこまで気にしていませんでした。ですが、よくよく考えるとカテゴリの機能があまり果たされておらず、それに加えてTikTokの記事を新たに追加したことにより、インスタグラム・TikTok・アプリの3つのカテゴリの記事が混ざってしまい、見えづらさを感じたこともあり、変更しました。

変更する前と後でトップページのPV数が少しだけ伸びたので、Webサイトのデザインも重要だと実感。今後も、Webサイトのデザインも意識してFrigateの運営をしていきます。