姉妹サイト『PLROG』がリニューアルオープンしました

0 コメント
姉妹サイト『PLROG』がリニューアルオープンしました

姉妹サイト『PLROG』のリニューアルが終わりましたので、更新を再開します。

ジャガアポー
シナモン
パイナポー

『PLROG』とは?

今年の4月に『PLROG』という姉妹サイトが誕生しました。『Moxbit』は“ジャガアポー”、“パイナポー”、“シナモン”の3人が登場し、WindowsやらMacやらの情報をお伝えするサイトですが、『PLROG』はキャラクター要素を大きく減らし、“売れるブログの作り方”をご紹介するサイトです。

『PLROG』は2013年3月30日に閉鎖されました。詳しくは以下の記事をご覧下さい。

『Moxbit 4.4 Bluebird(ver 4.44)』へアップデート+『PLROG』閉鎖のお知らせ

追記:2013年03月30日

『PLROG(プログ)』は“売れるブログ”の育て方を皆様へご提供するサイトです。

インターネットで「売れるブログを作る方法」と検索すると、HTMLの最適化やSEOの対策など技術的なことを指摘するウェブサイトがほとんどです。

『PLROG』ではそのような技術的な方法をお教えするのではありません。

  • ブログの定番機能の必要性を考える“コンテンツの必要性”
  • 我々人間が無意識で行動する“心理学”
  • 色に対する人間が持つイメージである“色彩心理学”

以上3つの観点から“売れるブログ”の作り方を掲載していきます。

しかし、公開してから半年も更新は続かず…。コンテンツがまったくといっていいほどありません。

そこで今回、『PLROG』のデザインと内部処理を大きく変更し、気持ちを改めることにしました!

シナモン
ジャガアポー

この記事では、どこがどう新しくなったのかを説明していきます。

1. 「『PLROG』が売れなかったら閉鎖」の発言を撤回!

『PLROG』公開当初は、

“売れるブログの作り方”を教えるサイトが売れていなければ意味なくね?

という考えを持っていて、“公開から1年後(2013年4月)までに月間10万PVを突破できなければ閉鎖する”というポリシーのもと、運営していました。

しかし今回のリニューアルによって、この発言を撤回したいと思います。

シナモン
パイナポー

撤回した理由は以下の5つです。

  • 更新頻度がひどいのでコンテンツが増えない
  • コンテンツが少ないのに売れるわけがない
  • 100万PVを突破する自信がない
  • 100万PVを突破する自信がない
  • 100万PVを突破するなんて非現実的
パイナポー

というわけで、今後『PLROG』が売れても売れなくても閉鎖しません。売れなかったら泣きながら売れるようになるまで更新します。

2. 新しい表情“興奮”、“いらつき”、“つぶやき”、“じと〜”を追加

plrog-renewal-open-new-face

『Moxbit』に比べ、『PLROG』ではキャラクター要素をかなり減らしています。とはいっても、『PLROG』では“ジャガアポー”のみが登場し、毎回、記事の最下部で“管理人のつぶやき”として一言コメントが載っています。

当サイトの特徴の1つでもある表情機能『Bourbon』。先ほどの“管理人のつぶやき”部分にも、この『Bourbon』は搭載されていますが、搭載されていた『Bourbon』のバージョンが古く、『Moxbit』で追加された新しい表情にも対応していませんでした。

そこで最新の『Bourbon』であるバージョン3.1を『PLROG』に搭載。このバージョン3.1は『Moxbit』に搭載される予定のもので、先駆けて『PLROG』に搭載しました。

執筆時現在の『Moxbit』が対応している表情“いらつき”と“興奮”に加え、バージョン3.1で対応する“ぶつぶつ”、“ジト目”を追加しました。

ジャガアポー

3. iPadでの閲覧に最適化したiPad版レイアウト

PCで新しい『PLROG』を見ても、「どこが新しくなったの?」と思うでしょう。それもそのはず、PC版レイアウトは従来とほとんど変わっていません

今回のリニューアルで大きく外観を変えたのはiPad版レイアウト。今までPC版レイアウトをそのままiPadへ表示させていましたが、今回はiPad版レイアウトを作成し、それを表示させるようにしました。iPad版レイアウトでは、ランドスケープ(横向き)モードでの閲覧はPC版とほぼ同じ外観を、ポートレイト(縦向き)モードでの閲覧は縦向きに配慮した外観を実現しています。

plrog-renewal-open-ipad-new-design

PC版レイアウトを見ると、右側の一部のナビゲーションがスクロールに追従してくることがわかります。この追従は“JavaScript”というプログラミング言語によって実装されていますが、iPadでは、PCの“JavaScript”による挙動と同じ挙動を再現できません。

そこでiPad版レイアウトでは“CSS”というマークアップ言語で、この追従機能を擬似的に実装しました。iPadのランドスケープモードで『PLROG』を見ると、右側のナビゲーションがしっかり追従してくることが分かります。

plrog-renewal-open-ipad-portrait-global-nav

ポートレイトモードでは、記事のみに集中できるように、右側のナビゲーションが表示されないように設計しました。PC版レイアウトで閲覧したとき真っ先に目に入る『PLROG』のカテゴリナビゲーションは、ポートレイト時の縦幅を考慮して縦置きにしました。

plrog-renewal-open-ipad-portrait-intro

Webデザインで重要なのは、『iPad』のようなモバイル端末であっても、サイト内すべてのページにアクセスできるようにすることです。ポートレイトモードによって失われた右側のナビゲーションは、すべてのページの最下部に表示するように設計しました。

plrog-renewal-open-ipad-portrait-intro-retina

もちろん、『Retinaディスプレイ』にも対応しています。

4. iPhone版レイアウトの改善

iPhone版レイアウトの見た目に大きな変化はないように見えますが、実はかなり大幅に改善しています。

plrog-renewal-open-iphone-entry-meta

まず、記事のヘッター部分。従来はカテゴリ名と投稿日時のみでしたが、今回のリニューアルによってコメント数も表示するようにしました

僕が読者からのコメントに返信するとき、自分が書いた記事は読まずに最初からコメント欄まで移動します。そのとき、いちいちスクロールするのは大変でした。そのため、コメント欄までの移動リンクが欲しかったのです。このコメント数も表示する改善は、読者よりも僕にとってのメリットの方が大きいですね。

plrog-renewal-open-iphone-bourbon

iPhone版レイアウトの『Bourbon』も、『Moxbit』のiPhone版レイアウトの『Bourbon』と同じスタイルに変更。ただし『PLROG』のカラースキームにあわせて、配色は少し変えてあります。ランドスケープモードにすると、顔アイコンの横にコメント本文が移動するのも『Moxbit』と同じ仕様です。

plrog-renewal-open-iphone5-landscape

iPhone版レイアウトの改善リストの中に、『iPhone5』の対応も含まれていました。『iPhone5』では縦の長さが伸びたので、ランドスケープモードにすると従来のiPhoneよりも横幅が増えたことになります。つまり、従来のiPhoneよりも一度に表示できる情報量が増えたわけです。

新しい『PLROG』のiPhone版レイアウトでは、従来のiPhoneと『iPhone5』によって表示方法を少し変えてあります

上の画像を見てもらえば分かりますが、『PLROG』のトップを『iPhone5』のランドスケープモードで表示すると、ロゴと3つのグローバルナビゲーションを表示できます。従来のiPhoneでランドスケープモードにしたとき、『iPhone5』ほど横幅がないことを考慮して、『PLROG』トップでは、ロゴと2つのナビゲーションを表示するようにしています。

『PLROG』を閲覧していくと、他にも、従来のiPhoneで見たときと『iPhone5』で見たときの違いが分かるでしょう。

plrog-renewal-open-iphone-retina

iPhone版レイアウトも、もちろん『Retinaディスプレイ』に対応しています。

これからの『PLROG』にご期待ください!

というわけで様々な改善をしたわけですが、やはりコンテンツが充実していなければ意味がありません。

今回のリニューアルによって僕の“『PLROG』を更新したい感”がグングン上昇してきたので、『PLROG』の更新を続けていきたいと思います。

今後の『PLROG』にご期待ください!

『PLROG』は2013年3月30日に閉鎖されました。詳しくは以下の記事をご覧下さい。

『Moxbit 4.4 Bluebird(ver 4.44)』へアップデート+『PLROG』閉鎖のお知らせ

追記:2013年03月30日
あとがき
パイナポー
ジャガアポー
シナモン
パイナポー
ジャガアポー
シナモン
ジャガアポー
シナモン
パイナポー
記事は執筆時の情報に基づいており、現在では異なる場合があります。
この記事をシェアする
コメント
コメントを投稿した際には、コメントガイドラインに同意したものとみなされます。
コメントを投稿した際には、コメントガイドラインに同意したものとみなされます。
コメントを投稿した際には、コメントガイドラインに同意したものとみなされます。