月間500万PVの「gori.me」がより見やすく!表示変更点とオススメポイントまとめ(2016年11月版)

スクリーンショット 2016-11-06 12.45.11

こんにちは。部長ナビ(@nabi_1080)です

当ブログ「部長ナビのページ」は月間500万PVのブログメディア「gori.me」のオフィシャルファンサイトとして著者のg.O.R.iさんご本人より認定いただいております。いつもありがとうございます

スポンサーリンク

gori.meのデザインを紹介するシリーズ、今回はモバイルも行くぜ!

ウチのブログデザインは、かなりの部分をgori.meにインスパイアされているわけですが、そのgori.meが進化しさらに見やすく、分かりやすくなりました

パーツにわけて、どの辺がどう変わったのかをお伝えしましょう!

PCデザイン

最上部「ヘッダー」が大きめのロゴに変更

スクリーンショット 2016-11-06 12.44.54

今までは、主要カテゴリメニューボックスの左に「gori.me」というタイトルロゴがある形だったが、今回のリニューアルにより、タイトルロゴが大きく、見やすくなった

そして、主要カテゴリも厳選され、7つのみがヘッダー下部に配置された

また、新着記事は今まで通り大きめのボックスで3つ表示され「最新記事」と表示されるのも見やすい

下にある「新着記事一覧を見る」をクリックすると、新着記事一覧部分へ自動スクロールするのも見逃せない

検索ボックス、主要カテゴリ最新記事、オススメ記事が並ぶ

スクリーンショット 2016-11-06 12.45.46

次に来るのは検索ボックスだが、他のブログには無い「注目キーワード」があるのが嬉しい。コレをクリックするだけで、gori.me内の関連記事をピックアップすることができるのだ

その下には、当ブログでも採用している「主要カテゴリ最新記事一覧」が並ぶ。ハッキリ言って、カッコいい

さらに、その下には大きくスペースを割いて「オススメ記事」が表示されることになった。今は「and factory」の記事があるが、ここもその時期の旬の話題記事が表示されることだろう

月間PVを考えると、とんでもない宣伝効果になるのは間違いない

ランキングとセール情報も見やすくまとまっている

スクリーンショット 2016-11-06 12.46.04

gori.meは、リニューアル後トップページは「1カラム」と呼ばれる「サイドバーの無い」形を採用している

なお、個別記事ページは2カラムで右側にサイドバーがある。コレは変更が無い

サイドバーが無い代わりに、この位置にランキングが来る

前にも記事にしたが、僕は直接g.O.R.iさんに「なぜ、ランキングは5位までなのか」と聞いたことがあるのだが、「5位までで十分だと思っています」という答を得た

確かにウチのブログではスペースの都合と、雑多ブログであるということから、20位までランキングを表示しているが、それほど上位に変わりがあるわけではない。実質使われるのは5〜10位までだろうと思っているので、gori.meのこの「ランキングは5位まで」というのは、スッキリしてて、かつ、計算された表示だと思う

gori.meでは外せない「セール情報」も見やすくまとまっている

上2つが通常アクセサリ等のセール記事で、下2つがAppleの整備済み品の情報となっている。1つ前の記事も読めるところが読者への配慮だと感じる

新着記事は、上2つが大きく、そして、抜粋が掲載されるようになった

スクリーンショット 2016-11-06 12.46.41

新着記事は、今までは「4列4段」の16記事が並んでいたが、今回、上に大きめのボックスが追加されたことにより、18記事の表示となった

上2記事については、アイキャッチ、タイトルの他に、本文の最初の何文字をかを掲載する「抜粋」が採用された

当ブログではこの「抜粋」を一切表示せず、タイトルだけの表示にしているため、コレは斬新だ。面白いと感じる

なお、新着記事からは「更新日」は削除されたこともgori.meマニアからすると外せない変更点だ

ぱくたそコラボの動画レビューも大きなスペース

スクリーンショット 2016-11-06 12.47.30

ぱくたそが編集を行っている本格的な動画レビューも最近スタートし、g.O.R.iさんのテンションに毎回楽しませてもらっているところだが、この動画レビュー、本格的に展開していくことを示すかのようなスペースの取り方と感じる

YouTubeの登録ボタンもあることから、今後の動画レビューも楽しみだ!あのテンションは癖になるぞ!

グルメ他、オススメ記事と商品レビューがトップページ下部に

スクリーンショット 2016-11-06 12.47.55

gori.meと言えば、グルメレビューが素晴らしいのも特徴だ

さらに、雑談系の記事も、さすがのクオリティ。タイル式に目一杯表示されるアイキャッチ画像を思わずクリックしたくなるのは僕だけじゃ無いだろう

ただ、残念なことに、g.O.R.iさんが紹介するグルメスポットはほとんど岩手に無い。よって、また、今度東京に行くときに堪能することにしよう

g.O.R.iさんと一緒に行った「トンテキ」はいまだに忘れることができない衝撃のウマさだった!

下部には、gori.meの主要記事と言える「商品レビュー」が並ぶ。ここだけで、ある程度の期間のレビューを全て網羅できるのも嬉しいところだ

フッターも参考にしまくり

スクリーンショット 2016-11-06 12.48.11

当ブログのフッターを見てもらえればわかるが、gori.meに影響されまくったフッターだ

シンプルだが、分かりやすい。そして、思ったよりも情報量が多いので、この数センチだけでかなりの「gori.me」にアクセスできるのだ

ヘッダー部には余計なモノを置かずに、フッターにまとめるこの手法を僕は参考にしている。

1つだけ疑問があるのは「trackfeed」ってなんだ?WordPressを運営して、僕も1年になるが、いまだにわからない・・・。

モバイル

ヘッダー部は、タイトルロゴが小さくなった

image

次にモバイル。

ヘッダー部はタイトルロゴが小さくなり、その分、下の方まで見えるようになった。検索窓下の主要カテゴリへのアクセスは「カテゴリ一覧」が「カテゴリ」になり、見た目もスッキリとなった

この部分も僕は参考にさせていただいているのは、モバイルで当ブログへアクセスすれば一目瞭然だ

ランキングはまさかのサイドスクロール

image

ランキングは、縦に表示では無く、上位5記事を「横にスクロール」する形だ

その下に、SNSフォローボックスがあるのは今まで通り

僕も「縦に長いと見る気がしない」と読者にいわれたことがあるので、ランキングの横スクロールは非常に素晴らしいアイディアだと思っている

オススメ記事、セール情報もサイドスクロール

image

その下にはオススメ記事が並ぶが、サイドスクロールだ

image

セール情報もサイドスクロール。この辺の統一感は非常に見やすさを感じる

一般記事はリスト式

image

PC版はいわゆる「タイル式」と呼ばれる配置なのだが、モバイルはリスト式だ。左端にアイキャッチ、右にタイトルが並ぶこのスタイルは非常に見やすく、視線の移動が少ないと言われる

タイル式とリスト式は好みが分かれるところだが、僕は、この「使い分け」が新しいブログデザインの1つとして浸透するのではないかと感じている

ちなみに、僕が使っているSimplicityだとカスタマイザーでこのスタイルを決めるので、多分だが、リストとタイルを共存させることは相当難しいのではないかと感じている

商品レビュー、動画は下部に配置

image

オススメコンテンツの商品レビュー、動画レビューについては、下部に配置されている

コレもサイドスクロールで、上下の移動が少ないのが嬉しい

このサイドスクロールもこれから追従するブロガーが増えるのでは無いだろうか?と感じた

フッターはシンプルに

image

フッター部分の変更は特にないが、僕も参考にさせていただいている

まとめ

g.O.R.iさんは僕がgori.meのブログデザインを採用することを認めてくださっている

不思議に思い、聞いてみたことがある

g.O.R.iさん「僕は、いつでも、「一歩前」を行きたいんです」

カッコいいと思ったし、シビれた

真似されることは光栄、真似してもらっても構わないが、僕は、常に先を行く、そんな姿勢がカッコいい

僕が取り入れているのは「旧gori.me」デザインなのだ。g.O.R.iさんは常に僕の一歩前を行く

だから、gori.meはいつまでも僕の憧れだし、いつまでも「偉大なる目標」なのだ

PVもそうだが、ブログにかける思い、姿勢、情熱、色んなことをg.O.R.iさんから学ばさせていただいた

Messengerのやり取りの中で「なるほど」と思ったことは数知れず。直接何かを聞くことはなるべく避けるようにしているが、にじみ出るg.O.R.iさんの「イズム」みたいなものを僕は確実に感じ取り、自分のブログ運営に生かしているつもりだ

もちろん、ブログは個性なので、その辺は真似することはできないのだが、僕とg.O.R.iさんは会ってわかったのだがテンションがほぼ同じ(笑)、ノリも同じ、なんか、他人とは到底思えない、そんな人だった

だから、これからも交流を深めながら、少しでもgori.me見たいな素晴らしいブログに近づけるように精進していきたいと思った

また、大幅なリニューアルがあったら紹介するので、シクヨロ!

(この記事については、事前にg.O.R.iさんの了承を取っています)

スポンサーリンク

この記事をシェアする!

この記事が気に入ったら
いいね!しよう

最新情報をお届けします

この記事の関連カテゴリ

サイト内検索