2012年9月16日日曜日

AddThisボタンをカスタマイズ

このエントリーをはてなブックマークに追加 Evernoteにクリップ

AddThisとは

AddThisとは、様々なソーシャルネットワークやブックマークボタンをサイトやブログに簡単に設置できるサービスです。現時点では336ものサービスに対応しています。海外のサービスなのでmixi Yahoo!Japan Livedoor など日本のサービスには対応していませんが、「はてなブックマーク」はあります。日本でよく使われているサービス(Facebook, Twitter, Tumblr, Instapaper, Pocket, Evernote)は対応されていますし、印刷ボタンやメール送信ボタンも追加できるので、十分使えるサービスだと思います。

AddThisボタンをブログやサイトに追加する

AddThisサイトからGet The Code For Your Site!をクリックします。

AddThis Site

登録を促されますが登録しなくてもボタンの設置はできますので、右上部の×でRegisterの画面を閉じます。

登録は不要!

BloggerにAddThisボタンを追加する

登録は簡単です。WordPress、Bloggerなど幾つかのサービスは、専用のコードを生成してくれます。Bloggerの場合は、専用のウィジェットを作成してくれます。ボタンの表示スタイルは4種類ありますが、32×32px、16×16pxのアイコンを選択した場合は、デフォルトでは閲覧者側のAddThisの設定によって表示されるアイコンが変わってきます。

AddThisボタンの種類

Bloggerを選択して、32×32pxのアイコン表示を選んで『Install Blogger Widget』をクリックします。

Bloggerに追加
取り敢えず、ここではデフォルト設定のままで『ウィジェットを追加』をクリックします。

Bloggerのレイアウト画面

右側上部のHTML/JavaScriptがAddThisのコードになります。この位置に追加されても実体は別な場所に表示されるので問題ありません。逆にサイドガジェットにないと正しく動作しません。

ブログの表示

下記が32×32pxのAddThisボタンで、デフォルトではフッター位置に表示されます。左からBlogger, Twitter, Facebook, ブックマーク, AddThisのツールボックスとなっていますが、これは表示する環境等によって異なるようです。

AddThis 32x32 デフォルト表示

AddThisのカスタマイズ

AddThisのカスタマイズ方法について調べてみました。Bloggerの場合は、レイアウトから追加されたガジェットの右下にある「編集」をクリックしてコードを編集します。

AddThisウィジェットの変更

AddThisツールボックスのカウントを消す

AddThisのツールボックス右側にバブル表示でAddThisの利用回数(カウンター)が表示されています。折角シンプルなアイコン表示を選択したので、このカウンターを表示しないようにします。

下記のコードを探して削除します。
<a class='addthis_counter addthis_bubble_style'></a>
※Bloggerの場合は”(ダブルクォート)ではなく’(シングルクォート)で囲みます。

これでAddThisのカウンター表示がなくなりました。

カウンター表示を削除したAddThisボタン

AddThisのアイコン(サービス)を変更

AddThisボタンに表示される共有サービスを変更するには、下記のaddthis_button_xxxのxxx部をサービス名にします。
<a class='addthis_button_preferred_1'></a>
<a class='addthis_button_preferred_2'></a>
<a class='addthis_button_preferred_3'></a>
<a class='addthis_button_preferred_4'></a>
※Bloggerの場合は”(ダブルクォート)ではなく’(シングルクォート)で囲みます。

Twitterボタンを利用する場合は、addthis_button_twitterとなります。下記は代表的サービスのサンプルになります。またサービスアイコンの表示数は初期値は4個に設定されていますが、個数に制限はなく1つでも10個でも設定可能です。AddThisのツールボックスを削除することも可能です。

Service Code
name code
Twitter twitter
Facebook facebook
Google+ google_plusone_share
はてぶ hatena
印刷 print
メール email

Google+1はgoogle_plusoneを使用するとカウンター付きとなってしまうので google_plusone_share を使います。利用可能なサービスとサービスコードの詳細については、Service Codesに記載されているので参照してください。

ボタンの間にセパレータ入れる

下記のコードを使って各ボタンの間にセパレータをいれることができます。
<span class='addthis_separator'>|</span>
※Bloggerの場合は”(ダブルクォート)ではなく’(シングルクォート)で囲みます。

Pocket (Formerly Read It Later)と印刷ボタンの間にセパレータを入れるには下記のように記述します。”|”を区切り文字としていますが、区切り文字がなくても構いません。
<a class='addthis_button_readitlater'></a>
<span class='addthis_separator'>|</span>
<a class='addthis_button_print'></a>
※Bloggerの場合は”(ダブルクォート)ではなく’(シングルクォート)で囲みます。

できあがったカスタマイズしたAddThisボタンの例は下記になります。

カスタマイズしたAddThisボタン

AddThisのトラックIDを削除

AddThisボタンで共有するとURLの後ろにクリック・トラッキング用のパラメータが付与されます。下記はTweetした例ですが、http://walking-elephant.blogspot.jp/2011/11/blog-post.htmlの#以降(#.UFCxpFQAm6Q.twitter)がクリック・トラッキング用のパラメータとなります。

Click Tracking のパラメータが付与されているURL



詳細はClick Trackingに記載されています。AddThisの利用状況をトラッキングする パラメータでSEOにも影響がないとありますが、自分のURLの後ろにパラメータが付いているのも気持ち悪いのでクリック・トラッキング用のパラメータが表示されないようにします。下記のコードを追加すれば、URLの後ろにパラメータが付かずにクリック・トラッキングされないとあります。
<script type="text/javascript"> 
var addthis_config = {
     data_track_clickback: false 
} 
</script>

Bloggerのウィジェットに追加する場合は、document.doAT=function(cl)の直前に追加します。
<script type='text/javascript'>
var addthis_config={data_track_clickback:false};
document.doAT = function(cl)
{

これで、下記のようにクリック・トラッキング用のパラメータがURLに付加されなくなります。

Click Tracking 用のパラメータが削除された

AddThisボタンを右寄せ表示に変更

AddThisボタンの表示はデフォルトでは左寄せですが、右寄せにすることもできます。AddThisのオプションというよりは、CSSやhtmlコーディングと同じです。まず下記のコードを見つけてください。
var at = <div class='addthis_toolbox  addthis_default_style addthis_32x32_style' addthis:title='"+title+"' addthis:url='"+encodeURI(url)+"'>

右寄せ表示を追加します。
var at = <div style='float: right;'><div class='addthis_toolbox  addthis_default_style addthis_32x32_style' addthis:title='"+title+"' addthis:url='"+encodeURI(url)+"'>

DIVステートメントを閉じるのを忘れないようにしてください。div class='addthis_toolbox'のDIVステートメントが閉じられている後ろに追加します。
</div></div>";

AddThisボタンの表示位置を変更(Blogger)

Blogger用のウィジェットでAddThisを追加した場合、AddThisボタンはブログのフッターに追加されます。フッターに表示されるのは下記のコードがあるためです。赤字の部分を変更することによって表示する場所を変更することができます。
var myPostContent = new RegExp('post-footer');

1.post-header
2.post-body
3.post-footer

その他変更

Customizing AddThis にその他色々とカスタマイズ方法について記載されていますので、色々と試してみてください。

今日の一曲

Add This について説明したので、今日の一曲はその名もずばりGus GusのAdd This Songです。色々なミックスバージョンを集めたAdd This Songというアルバムというのがあります。ネットラジオで Add This Song (Gluteus Maximus Mix)が流れていて、久しぶりに所謂UKエレクトリックミュージックを聴き、iTunesで購入してしまいました。

個人的にはAdd This Song (Klovn Mix) - Add This Songが一番好きです。夜のドライブには最適なアルバムです。


2012年9月6日木曜日

HuluがApple TVに対応!

このエントリーをはてなブックマークに追加 Evernoteにクリップ
huluは、月額980円でスマホ、タブレット、PC、ゲーム機(PS3, Xbox 360Wii)、テレビ(SONY BRAVIA 46V型 など)とマルチデバイスで視聴できるオンライン動画配信サービスです。



米国でApple TVに対応というニュースをみて、早く日本でも対応しないものかと心待ちしていましたが、ついに日本でも2012年9月4日からApple TVのホームメニューにHuluが追加されました。

Apple TVのホームメニューにhuluが
huluのiPhone/iPadアプリは、AirPlayに対応していたもののミラーリングが必要でした。また視聴中に途中で切断されてしまったり、上部にタイトルが表示される完全なフル画面ではなっかたりと、AirPlayでの利用については、いまひとつ快適ではありませんでした。しかし、今回のApple TV対応で完全フル画面で視聴できるようになりましたし、iPhoneやiPadというデバイスが占有されなくなったので、TVを視聴しながらの作業が可能となりました。何よりもテレビの入力を切り替えれば自動で電源が入るApple TVの手軽さはリビングでの貢献度は高いです。

初期起動時にのみアカウント設定の画面
初期はアカウントの登録が必要です。iTunesアカウントでも購入できるようになっていて、通常は2週間の無料トライアルですが、iTunesでアカウントで購入すると1ヶ月の無料トライアルとなるキャンペーンを行っています。

Apple ハイビジョン対応 Apple TV MD199J/A
アップル (2012-03-16)
売り上げランキング: 15

Huluでウルトラセブンを見よう!

もともとHuluは、米国のサービスなので米国のドラマ、映画が中心のサービスでしたが、BBCとの提携したドラマやドキュメンタリーが追加されたり、更には日本の各企業との提携で日本のコンテンツも増えてきています。今回、ギャガ、円谷プロダクションとの提携も併せて発表され、円谷プロダクションとの提携により「ウルトラマン」「ウルトラセブン」「帰ってきたウルトラマン」などのウルトラシリーズ8作品も視聴可能となっています。是非ともウルトラQも追加してもらいたいものです。

ウルトラトラセブンといえば、どうしても気になってしまうのが第12話です。Huluでも、第12話は欠番となっていました。ウルトラセブンはリアルタイム世代ではないので、12話が封印されているという事実を知ったのは1987年にTBSで放映された『泉麻人のウルトラ倶楽部』でした。

封印されているウルトラセブン12話
当時は詳細について知るよしもなっかたのですが、現在では、ネットで容易に調べることができるようになりました。第12話のタイトルは「遊星より愛を込めて」で、登場する怪獣は「スペル星人」です。かなり劣悪な映像ですが、Youtubeにも動画がアップされているので、どんな内容かを確認することができます。著作権の問題は別として、1970年から放映されていない映像がネットにアップされているということには驚きを覚えます。

スペル星人のコンセプトはいかがなものかと思いますが、

「あたし忘れない、決して、地球人も他の星の人も、同じように信じ合える日がくるまで」

という台詞は印象的でした。

なぜ自主規制になったのかということについては、Wikiにも記載されていますが、封印作品の謎―ウルトラセブンからブラック・ジャックまで (だいわ文庫)にその経緯が載っていますので興味がある方は閲読してみてください。

封印作品の謎―ウルトラセブンからブラック・ジャックまで (だいわ文庫)
安藤 健二
大和書房
売り上げランキング: 132642

2012年9月3日月曜日

CSポートフォリオをExcelで描く

このエントリーをはてなブックマークに追加 Evernoteにクリップ
顧客満足度調査(CS調査)を行う目的は、お客様が自社の店舗、商品、サービスについて、どの程度満足しているかを調べるためです。そしてCS調査の結果から改善すべき項目をみつけることが重要です。では、どうやって改善すべき項目を見つければよいのでしょうか。CSポートフォリオでは、重要度と満足度でポートフォリオを描くことにより、この改善点を可視化します。

満足度:

各評価項目の満足度です。下記の値が用いられます。
・平均点
・満足率(良いの割合)
・良い(%)-悪い(%)

Q.商品の価格に満足されていますか?
回答項目 回答数 構成比
5.非常に満足している 20 20%
4.満足している 35 35%
3.どちらともいえない30 30%
2.不満がある10 10%
1.非常に不満がある 5 5%

上記の場合の平均点は、
((5点×20)+(4点×35)+(3点×30)+(2点×10)+(1点×5))/100=3.55

満足率は、単純にどれくらいの人が満足かしているかの率です。例えば下記の設問に対しては、非常に満足していると、満足しているしているとした回答が何%あるかが満足率になります。つまり、「非常に満足している」と「満足している」の構成比を合算(20%+35%)した55%が満足率となります。

良い(%)-悪い(%)については、過去のブログで「良い(%)-悪い(%)」に記載していますが、満足している(20%+35%)から不満がある(10%+5%)を減算した、40%となります。この考え方は、ネットプロモータスコアも同じなので「NPS: Net Promoter Score」も併せて参考にしてください。

重要度:

各項目が総合満足度にどれくらい寄与しているか(相関があるか)が重要度となります。下記の手法を用いて重要度を計算します。
・単相関
・回帰分析
・数量化Ⅰ類
・因子分析

重要度を表す指標に関しては、「総合満足度」「次回利用意思」「推奨」などを用いればよいのではないでしょうか。

例えば、ある商品に関しての満足度調査を行った場合に下記のような設問になります。

あなたは、○○○に満足していますか?【総合満足度】
あなたは、○○○を次回も購入したいと思いますか?【次回利用意思】
あなたは、○○○を友人や知人にも勧めたいと思いますか?【推奨】

そして各項目の満足度がどれだけ総合評価に寄与しているかを調べます。単相関、回帰分析であればExcelのデータ分析ツールで簡単に求めることができます。回帰分析の場合には係数を利用します。

CSポートフォリオの4象限

CSポートフォリオの4象限

①重点改善項目

ここに位置する項目は、重要度が高いのに満足度が低い項目となります。つまり総合満足度を上げるために最優先で改善しなければならい項目となります。

②重点維持項目

現状の満足度調査で、重要度も満足度も高い項目になりますので、引き続き項目の満足度を下がらないようにする必要があります。

③維持項目

満足度は高いけど、あまり総合評価に起因しない項目となります。折角、満足度は高いので維持する必要はあります。

④改善項目

総合評価への影響は少ないけれども、満足度が低い項目となります。重点改善項目の次に改善を必要とする項目となります。

CSポートフォリオを描こう

ポートフォリオについては「偏差値でポートフォリオを描く」でExcelでのポートフォリオの描き方を説明していますのでこちらを参考にしてください。コツは4象限に分けるので、データを標準化して平均値を使うことです。CSポートフォリオでもY軸とX軸の単位の意味はあまりないので、偏差値にして偏差値50で交点させるときれいに描写できます。

また散布図にラベルをふる方法については、「Excelの散布図にラベルをつける」を参考にしてください。

下図が作成したCSポートフォリオになります。
CSポートフォリオの例
上記のCSポートフォリオから重要度が高く、満足度が低い「商品が品切れしていない」ことがお客様にとって大切なことであり、全体の満足度低下にもつながっていることが読み取れます。つまり、最優先で改善すべきことが「在庫の担保」であることがわかります。

最後に...

CS分析やCSポートフォリオについては、すべてわかるアンケートデータの分析Excelで学ぶ多変量解析入門に詳細の説明がありますので、参考にしてください。上記のポートフォリオについても2冊に掲載されているサンプルをもとに作成しています。またExcelで学ぶ多変量解析入門には、付属でCD-ROMがあり、CSポートフォリオが簡単に描写できます。

次回は、CS分析で改善項目の優先度の指標となる改善度について説明したいと思います。
(「CSポートフォリオの改善度をExcelで計算する」を更新しました[2012.12.16])


すべてわかるアンケートデータの分析
菅 民郎
現代数学社
売り上げランキング: 354116
Excelで学ぶ多変量解析入門
菅 民郎
オーム社
売り上げランキング: 242115

今日の一曲

ひと月に2回満月になることがあります。この2回目の満月のことをブルームーンと呼びます。先日の2012年8月31日がちょうどブルームーンでした。英語では「once in a blue moon」というと、めったに起きないということの慣用句となっています。本来は、大気中の塵などが反射して月が青くなることをさしていたようですが、青い月を想像するとなんだか妖艶な感じがします。そして、今日の一曲のタイトルは、Mabel Mercerが歌う「Once In A Blue Moonです。古いJazz歌手ですが、とても切なくこの歌を歌いあげます。ブルームーンでなくても月を見上げてこの曲を聴くと切なくなります。

once in a lifetime when moon is blue...