Facebookページのタイムライン化に合わせてやらなきゃいけないのはカバー画像の設定なんかよりもカスタムタブ画像の設定

3.30
2012

今日から、全てのページが強制的にタイムライン化しました

どうも。
今日は落ち着きませんね。
期末だから、というわけではなく、Facebook側でタイムライン化という大きな仕様変更がある日だからです。

さて、「No study No life」の「Facebookページのタイムライン化に合わせてやらなきゃいけないのはカバー画像の設定なんかよりもメッセージの設定」という良エントリーを見て、それなら俺も!ということで、この記事を書いています。

今日未明ぐらいから一斉にタイムライン化しました。
ほとんどのページが趣向を凝らしたカバー画像をドーンと設定して、「どやっ!」って感じですが、カバー画像とかどうでもいいと思います。

「うちのページはタイムラインでのコミュニケーションしかしないぜ!!」というページはいいんですけど、そんなページ少ないですよね。

皆さん、さんざん手間とコストをかけて作り上げてきた「アプリ」があるのでは?
今までは、ページにランディングした時に1stビューをどのタブにするか選ぶことが出来ました。
今後はそれが出来ません。つまり、タイムラインのページがTOPページとなり、ユーザーはそこから二階層目以下に移動するわけです。

一般的なホームページの考え方で行くと、TOPページから二階層目以下に移動させるには、相応のナビゲーションが必要です。
例えば大昔のホームページって、たいていが左右にフレーム分けされてて、左のフレームにメニューがありましたよねww
最近は左右に分けるのは時代遅れ?だいたい上部にメニューが配置されている気がします。

さて、Facebookページの話に戻りますが、タイムライン化したことにより、今まで左に並んでいたメニューが上部に並ぶようになりました。

前置きが長くなりましたが、この上部にあるアプリが並んでいるメニュー、ここをおざなりにしているページがあまりにも多いので、むしろカバー画像なんかよりこっちのが重要だよ、って言うお話し。

■最初から表示されるアプリは4つのみ。しかもうち1つは「写真」で固定。


(1)まず、タイムライン化されたページを見てください。まあ、こんな感じでしょう、きっと。
アプリのアイコンが並んでるかと思います。
でも、4つしか表示されてないですよね。5つ目以降は、右にある矢印を押さないと出てきません。


(2)こんなかんじですね。
元のページでタブが多かった場合、ここにずらっと並んでるわけです。


(3)さて、最初に表示されている4つのアプリ、ここに一番見せたいものを表示させましょう。
つまり、並び替えです。ただし、一つ目の「写真」は変更できません。実質3つ分のスペース。
並び替えをするには、上記で説明した矢印を押した状態で、アプリの上にマウスを持ってくと表示される、「鉛筆マーク」をクリックしてください。

★ちなみに、今日のエントリーはFacebookページの管理人でないと意味ないですからね、。念のため!


(4)すると、「位置を入れ替える」と書いてあります。
現在選択しているアプリを、別のアプリと入れ替える、ってことみたいです。
試しに、今選択しているRSS for Pagesを、左から2番目(現在の「いいね!」の位置)に移動してみましょう。


(5)ほい、入れ替わりましたね。
いやー、なんという糞仕様難しい仕組みでしょうか。
まあ、やってみりゃわかります。

■アプリのアイコン画像を変更しないと、ダサい。どうしようもなく、ダサい。

さて、俺が声を大にして言いたいのはこっちです。


ご覧の通り、ブログのRSSフィードをまとめているアプリ「RSS for Pages」と、YouTubeの動画をまとめている「YouTube for Pages」、それぞれアプリのデフォルトのアイコンが、メニューにも表示されてますね。
もう、とにかくダサい。

実は、仕様変更前のビューで左側に並んでいた時、faviconぐらいのサイズで出でいたアプリのアイコンがあったのを覚えてますか?
あいつが表示されてるんです。

これはちょっとありえないですね。

前述のホームページの話しに戻りますが、タイムラインから各アプリのページにユーザーが移動するかどうかは、この上部メニュー部分のナビゲーションにかかっています。
それがこんな、よくわからんアイコン画像が出てても、クリックする気にはとてもなりません。

というわけで、この画像を変更しましょう。
そう、ここの画像は、管理画面から変更出来るんです。


(1)Facebookページの管理画面から、アプリの画面に行ってください。
インストールしてるアプリが並んでるはず。
そして、画像を変更したいアプリの「設定を編集」をクリックしてください。
まずは、RSS for Pagesの写真を変更してみましょう。


(2)こんな感じです。真ん中にある「カスタムタブの画像」の「変更」をクリックしてください。


(3)こんな画面が開きます。「Change」をクリック。


(4)で、こう。ローカルから写真を参照して下さい。
ちなみに、この画像のサイズは、【111×74px】です。
フォーマットは何でもいいのかな。とりあえずJPEGはOK。


(5)写真をアップすると、こうなります。
ちなみに、このページに「完了」とか「戻る」とか、そういうボタンが無いんですよ。
なのであきらめてこのページは閉じて下さい。


(6)というわけで、ちゃんと設定すればこんな感じ。全然違いますよね。

※注意点1
タブの画像を変更しても、ページの管理画面のアプリ一覧のところでは、引き続きデフォルトのアイコンが表示されています。
画像が変更されたかは、実際にページを見てみないとわからないっす。

※注意点2
タブの画像を変更出来るのは、サードパーティー製のアプリだけです。
Facebookデフォルトの、「写真」「イベント」「ノート」とかは、変更できないです。
ただし、
・写真→最新の写真が表示される
・イベント→最新のイベントに設定された写真が表示される
・ノート→最新のノートの一部が表示される(テキスト)
という仕様みたいですね。

では最後に、この「カスタムタブの画像」をとても上手く作ってるページをご紹介。
・・・つっても、別にそんなに事例を知ってるわけでもないので、手近なところでw


ふふふ、手前味噌!手前味噌!うちの会社のページです。
ご覧の通り、どういうキャンペーンなのか?、期間は?、といった情報がちゃんと画像に入っていてわかりやすいですよね。


「asomin」というFacebookページのアプリのページです。
とても直観的で分かりやすいですよね。


asominで紹介されていたページです。
左から2番目は微妙ですけど、残り2つは良いですね。

ようは何が重要かって、この画像はあくまでもメニューだ、ってことです。
カバー画像と違って、かっこつけて画像にこだわったって、それが何なのか分からなければ誰もクリックしませんよ、って言う。

一応、アプリのアイコンの下にアプリ名は青字で表示されてますが、まぁ、目立たないわ表示文字数少ないわ。てんでダメ。

というわけで、まだまだこのタブ画像にこだわってるページは少ないと思いますが、ぜひ皆さんも工夫してみてください。

・・・なんてエラそうなエントリーでしょう。
ごめんなさい。