先週の話ではありますが、新しくサイトを作って公開しました。

5文字の地図検索

名前通り5文字縛りの地図検索ができるのみの簡単なサイトです。

元々は、仕事でジオコーディングなどを扱っている時、試しに入れてみた「テスト」「hoge」などの適当な単語で座標がとれてしまって、それが気になったスタート。これは他にもいろいろあるだろう、と思って遊んでるうちにこんな風になりました。

割と普通の単語で座標が出てくるので、もし良ければつついてみてください。個人的には愛知にある「地獄」とか中国にある「サガ県」とかが気になってます。

ちなみにですが、制作期間は7,8時間くらい。使っている技術は

• CakePHP1.3系
• MySQL5系
• Bootstrap, from Twitter

このあたりです。

Bootstrap, from Twitter は初めて使ってみたのですが、簡単にそこそこ綺麗なレイアウトが作れましたので、デザインが苦手な人にはかなりお勧めです。

さて次は Mashup Awards 7 に向けて何か作ろうと思います。今後も地図系・座標系、かな。

最初に押さえるべき事

短時間に多数の発言は避ける（1時間に一発言程度が目安）

タイムライン（ログイン後の表示画面）にはいろいろな人の発言が並びます。
連続して多数の発言を行った際には、その発言でタイムラインが埋められてしまいます。
タイムラインが1人の発言で占められてしまう事を嫌う人は多いようです。
ただし、返信「頭に＠がつく発言」に関しては返信先の人にしか見えないので、上記の範疇外です。
もし、誰かから質問などが有った場合は（頭に @自分のアカウント名 がつく発言）なるべく早めに返信しましょう。

Twitterクライアントについて

twitter.com でも良いのですが機能が貧弱です。

http://hootsuite.com/

このサービスを使うのがオススメです。
Androidでの場合このアプリが便利です

http://jp.androlib.com/android.application.jp-r246-twicca-xqpF.aspx

誰かにフォローされたら

メールで通知がきますので、SPAMアカウントなどでなければフォローしてくれた人をこちらからもフォローしましょう。

Twitter運用第一段階

まずはともかく登録

• プロフィールには自サイトのURLを掲載しましょう
• ぱっとみてわかるようアイコンを変更しましょう
• 登録できたら今手元にある情報を少しずつ発信していきましょう

Twitter運用第二段階

ある程度発言が貯まったら（25件程度）興味をもって貰えそうな人をフォローしていきましょう。

フォローをすると、相手にTwitterから「○○さんにフォローされました」というメールが届きます。
相手に興味を持って貰えればアカウントをフォローしてもらう事ができます。

興味を持って貰えそうな人を探すにはTwitterの検索機能を利用します。たとえば「○○　欲しい」で○○に興味がある人が検索できます。

またGoogleのリアルタイム検索も便利です。たとえば、パソコンを探してる、て人だとこんな感じ。

パソコン 探して

発言からその人のアカウントを見て、興味を持って貰えそうだったらフォローしましょう。

手動で1日10人10日間、100人程度。感覚をつかむまでは程々の人数で。

Twitter運用第三段階

もし企業や団体のアカウントであれば、ツイナビに登録しましょう。
以下のURLの一番下から登録する事ができます。

ついナビ

困っている人にアドバイスを。「○○　困った」「○○　探している」といった方に解決の手助けになるようなメッセージを投げてみましょう。

Twitter運用第四段階

リツイートしてらいましょう

有用な発言であればリツイートで発言が広がる可能性があります。
が、コンスタントにそういう発言をするのは難しいので企画をやりましょう。

たとえば粗品を出す
ＲＴキャンペーン

たとえば割り引きをする
ツイ割り

ただし、炎上騒ぎになった例もありますので注意が必要です。

そうそう…一番大事な事を忘れてました、上記の全ては僕の想像。そして、うまくいかなくても僕に文句を言わない、重要です。

とはいえ数年Twitterを利用してきて、このような企業アカウントであれば有用だろう、と思ったものを纏めたものです。何かの参考になるのでは、と思っております。

そんな時にぼんやりFacebookを眺めてると「いいね！」を全部「いい質問ですね！」に置き換えたくなったので作りました。仕事しろっていわれそうだけど、忙しいときって変なこと考えちゃうよね。たまには息抜きさせてください。

アドレスバーに下のJavaScriptを打ち込んだら、ニュースのおじさんがいっぱいに。ついついいい質問をしたくなりますね。Facebookを表示しているときに実行してみるのがオススメです。

JavaScript:with(document.body)innerHTML=innerHTML.replace (/いいね/g,'いい質問ですね');focus()

せっかくなのでブックマークレットにもしました。説明しても需要はないとおもいますが、下のボタン、ブックマークバーにドロップしておけば、ボタンを押すだけでいつでもどこでもニュース学べる感じになります。

いい質問ですね

いいね！

で、せっかくなのでいろいろ調べた事をメモがてら書いてみます。基本的にな話であれば

• JQuery Mobile[基礎編]
• jQuery Mobile リファレンス的なもの

このあたりが詳しいのでこちらを。このエントリではちょっと気になって調整した箇所などを。

ロード中の文字を日本語にする

JavaScriptファイルを準備して以下のように記述、これを読み込めばロード中の「loading」って文字が「読み込み中」になります。

$(document).bind("mobileinit", function(){
$.mobile.loadingMessage = "読み込み中";
});


Backボタンを一括して日本語に

JavaScriptファイルを準備して以下のように記述すれば、「Back」ボタンの文字が全部「戻る」になります。

$(document).bind("mobileinit", function(){
$.mobile.page.prototype.options.backBtnText = "戻る";
});


Selectメニューをネイティブのものにしたい

Alpha2だとセレクトメニューにちょっとバグがあって、ネイティブのものを利用する必要がありました。以下のように書くことによって、JQueryMobileのselectメニューを無効にできます。

$(function () {
$.widget( "mobile.selectmenu", $.mobile.widget, {
options: {disabled: true}
});
});


いまのところこんな感じ。テーマファイルなんて機構もあって、つくった覚えがあるんだけど詳しいやり方忘れちゃいました。思い出したら追記します。

JQueryMobileは細かくデザインしなくても、それっぽいサイトが直ぐにつくれるのでいいですよね。リリース版が出るのがとっても楽しみです。

で、サイトを作っている際にカレンダーを使うことがありまして。いろいろ調べてはみたものの、iPhone向けのカレンダーってのは殆ど見当たらない。iCalがあるからあまり必要とされないのかもしれないですね。

とはいえ、必要ですので仕方なしに、PC向けに作られているものにちょっと手を入れて、iPhone, Androidで使えるようにしてみました。

ベースはiCal-like calendars with jQueryを使わせて頂いております。

一回タップでツールチップ（ていうのかな？）が表示されます。で現在はコメントアウトしてますが、もう一度タップすると別ページに遷移できるようになっています。

PCの場合はマウスオーバーでツールチップ表示、クリックで別ページに遷移、って感じです。

ソースコード及び一式は以下。

2011/01/10版

改善点
今回は動作変更です。2011/01/10版とは大幅に動きが変わっていますので、上記のデモをみていただいてお好きな方をどうぞ。

• ツールチップを自動的に隠す動作から、テーブル内の別箇所タップで消去に変更
• ツールチップが表示されている場合は、ツールチップクリックでリンク先に遷移するよう変更

2011/01/10版

改善点

• ツールチップが重ならないよう、過去の表示を消す処理追加
• <td cal_link_to=’http://www.yahoo.co.jp’>のようにダブルタップ時の遷移先を設定できる機能の追加
• 画像のサイズが合っていなかったので修正

2011/01/07版

いろいろいじくってみてはいますが、正直JQueryとかあまりよくわかりせん。ここおかしいよ、ってのはがあれば指摘いただけますと嬉しいです。

といったわけで、Symfony1.4について 備忘録として情報をまとめてみました。まぁ、日本Smyfonyユーザー会のこのページ見ればだいたい辿れるんですけどね。自分が便利に使うためです（笑）

日本Symfonyユーザー会

• インストール、初期設定手順[日本語]
• Blogチュートリアル（CakePHPブログチュートリアルと同じ構成）[日本語]

Symfony公式サイト

• A Gentle Introduction to symfony（機能一通りの説明）[日本語]
• The symfony Reference Book（設定ファイルの説明）[日本語]
• The symfony and Doctrine book（DB周りの説明、1.2向けだけど）[日本語]

チートシートなど

• 本家にあるチートシート一覧[チートシートは英語]
• sfFrormチートシート[英語]

プラグイン

• jpSimpleMailPlugin（組み込みのSwift Mailerは文字化けする？）[日本語]

Admin ジェネレーター

• 第14章 – Admin ジェネレーター（管理側を作る際に、Doctrineにて）[日本語]
• Practical symfony 13日目: ユーザー（管理画面に認証処理を）[日本語]

その他

• symfonyのFormで確認画面を実装する方法（確認画面はよく必要になるので）[日本語]

Doctrine

• 初心者による初心者のためのdoctrine（DB操作はdoctrine、慣れるまでちょっと大変）[日本語]
• Doctrineのmigration機能でデータベーススキーマの差分管理（一旦リリースした後はマイグレーションでDBを更新）[日本語]
• Doctrine ORM for PHP Table of ContentsDoctrineのドキュメント[日本語]
• YAML Schema FilesYAML Schema Filesの書き方[日本語]
• [doctrine]DoctrineでSQLを直接実行する集計処理などで必要になるSQL直接実行の方法[日本語]

他にも良いドキュメントがあれば追記していきます。

で、今回はThe Cookbookの開発例をやってみたけど、CakePHPの良さがいまいち判らなかった人向け。

bake コマンドを使ってちょっと感動してもらおう、ついでにhasManyとかbelongsToの話もできれば、って感じで資料を作ってみました。

ダウンロード可にしてますので、使えそうでしたら使ってください。間違ってるところがあれば直しますので、教えて頂けるとうれしいです。

勝手に使うのに抵抗がある人向けにライセンス、つけときますね。

CakePHP勉強会資料「導入編」 by http://firstlife.jp/ is licensed under a Creative Commons 表示 2.1 日本 License.

http://ユーザー名:パスワード@localhost/

みたいなURLが無効になっているので、PHPやHTMLを用いた方法では出来ない事はできなさげです。

どうしてもBASIC認証をHTMLベースでやりたい場合は、モジュールを使うのが良さそうです。

いつのバージョンから含まれているのか判らないですが、Apacheに mod_auth_formっていうのが含まれているそうです。

他にも、同名のモジュール（中身は別物）で二つほど同じような事を実現するモジュールを作成されている方がいるようで。

mod_auth_form

mod_auth_form

どちらもちょっと古いので、Apacheに含まれているのを使った方が良さそうですが。

今後は公式の mod_auth_form を使ってHTMLでBASIC認証するようになるんでしょうね。

ではここからが試してみた事のメモ。

WEBサイトに認証をつけたい、けど、BASIC認証のダイアログは嫌だ、というよくわからない依頼、たまに有りますよね。認証処理を別途設置するコストを考えると、なんか無駄だなー、と思うんですが。

で、ちょうど人に聞かれたので、BASIC認証でダイアログ出さずに処理出来るか、ちょっとやってみました。

こんな感じになりました。
http://firstlife.jp/demo/20090628/login.html

で、以下がやり方。IE7で動かないので使う人も居ないだろうけど。

BASIC認証の設定方法は、Googleあたりで調べて貰うとして、BASIC認証がかかった領域の外に、以下の様なHTMLとPHPを置きます。

login.html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt;
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>login</title>
</head>
<body>
<form action="login.php" method="post">
username : <input type="text" name="username"><br />
password : <input type="password" name="password"><br />
<input type="submit">
</form>
</body>
</html>

login.php

<?php
$username = htmlentities($_POST['username']);
$password = htmlentities($_POST['password']);

if($username==""||$password==""){
	header('location: login.html');
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt;
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>login</title>
<meta http-equiv="Refresh"content="0;url=http://<?php echo $username?>:<?php echo $password?>@firstlife.jp/demo/20090628/restrict/">
</head>
<body>
自動でログインしない場合は<a href="http://<?php echo $username?>:<?php echo $password?>@firstlife.jp/demo/20090628/restrict/">こちら</a>
</body>
</html>

で、login.htmlにアクセスすると上に書いたアドレスのような動きになります。

そうそう、ログインが失敗した時用に .htaccess に

ErrorDocument 401 /demo/20090628/login.html

みたいに書いておくと、ログイン失敗時もログイン画面に戻るのでいいかもね。

とまぁ、こんな感じです。モジュールの方はまた時間のあいたときに試してみます。

前から書きたいと思ってたんだけど、インターネット上で商売とか何かする、って場合には、個人的に読んでおいて貰いたい文書があるんです。インターネットについて知ってた方がいい話。ま、おっさんの昔話って言われればそれまでですが。そうそう、普段開発やっている人は飛ばしちゃっていいですよ、きっと知ってる話だから。

最近、クラウド、ってバズワードが出てきましたね。WEB2.0、SaaSの次はクラウドですか、って感じだけど、インターネット自体分散処理、って思想が根本にあります。

サーバーをいろんな所に置いて、分散して処理しようぜ。メールも中央サーバーで管理するんじゃなくて、別々のサーバーに置けばいいんじゃね？じゃ、DNSも、WEBも！ってな感じ。

そのインターネットを支えるのがオープンソース。世界中にあるWEBサーバーなんて、ほとんどがオープンソースのアプリケーションなんだぜ。

で、オープンソースの開発なんて、世界各地に居る人達が、自分が得意な分野でプログラムを書き、1つのアプリケーションを作ってる。とってもクラウドでしょ？それも15年以上前からそんな形態。

クラウドって考え方は最近出てきた物ではないと思うんだ。以前からあったものがお金になりそうだから「クラウド」って名前をつけてあおってる感じがするんだよね。

複雑な物をばらして1つ1つを単純化、そして分散させる、ってのがクラウドコンピューティングであるとすれば、1つ1つは単純化してコンパクトに、それらを組み合わせてって難しいことやろうぜ、ってのはUNIXの思想。
大勢の力をちょっとずつ借りてなんかやろうぜ、元気玉みたいな感じでさ、ってのがクラウドソーシングであるとすれば、同じ事に興味持つ人達が自分の得意分野で協力して、寄ってたかって物を作り上げ問題可決する、ってのがオープンソース。

社会起業って言葉も最近出てきたよね。会社として社会貢献するんだっけ。けど、それもオープンソースのコミュニティでずっと似たような事やってたし、クラウドにしてみても以前から似たような形態で動いてるインターネットがある。

じゃ、それについて書かれた古典を読んで見るのもいいんじゃないかな、と思うんだ。読むことで、クラウドや社会起業の展開について思いをめぐらせたり、展開を考えたり、こういう人達のつくった物の上でインターネットが成り立ってるんだ、と言うことを知ることも出来る。

そこに確かな実例があるんだからさ。

残念ながらオープンソース系のコミュニティって、目の前にある問題に一生懸命で、ビジネス書なんて書く人は少ない。だから、こういった方面の意見を目にすることは普通の人には難しい。
けど、インターネットってものに根ざす組織で有るが故に、インターネット上には多数の文書が公開されてる。紙で製本された本の方が絶対正しいんだ、って言う人は居るかもしれない。けど、本だって百万くらいはたけば誰でも出版できるんだぜ。確かに敷居は高い。けど、英語から翻訳され、10年以上も読み継がれるインターネット上の文書ってのも、また値打ちがあるとは思わない？お金をだせば誰でも出版できる物よりかはさ。

以下に、特に読んで欲しい文書を二つ挙げます。技術系じゃない人にとってはちょっと難しいかもしれないけど、組織論としても、技術論としても優れた文書です。

伽藍とバザール

気になる言葉：「多くの重なり合う意志による真剣な努力」

あるオープンソースプロジェクトの運営の話。
オープンソースのプロジェクトとクラウドソーシング、ボランティア組織の運営は似ているところがある。
もちろん、実際の経営にも参考になるかもしれない。個人個人が目標を掲げ、各々の良しとする事を進める、そういった組織も多くなってきてるように思いますので。

The Revenge of the Hackers(ハッカーの復讐)

気になる言葉：「世界を本当に制覇する唯一の方法は、世界に貢献することだ。」

Firefoxの起源について（FirefoxはNetscapeのオープンソースプロジェクトが起源）。また、革新的なプロジェクトの進め方、手法についての文書。

おまけにもう一つ。

魔法のおなべ

気になる言葉：「オープンソース・インフラは信頼と対称性をつくりだし、それが長期的には、もっと顧客を引きつけて、クローズドソースのインフラを競争でうち破ることになる。」

オープンソースの経済的な話。これを読めば、GoogleがなぜAndroidをオープンソースで提供するか、Google Waveの通信の仕様を公開するか、それが判るはず。
下世話な言い方をすると、少ない投資で質の高いものを手に入れる方法について。

ともかく、読んで頭が良くなるか、新たなひらめきがあるはず。もしそれが無くてとも、開発者ともうちょっと仲良くなれることは請け合いです。

メディア界隈の人、大変大変。各WEBサイトのページビュー、ユニークユーザー、ユーザー層が判っちゃうよ。

いきなり何を、と思うだろうけど、とりあえず上の画像を見て欲しい。私のサイトの情報なんだけど、見て何が判ります？

ページのユニークユーザー数、ページビュー、閲覧者の平均閲覧ページ数、平均、滞在時間、年齢層、学歴、性別、収入。

ね、凄いでしょ？

ともかくGoogle Ad Planner が凄い。うちのサイトでも見れるくらいなので、ほとんどのサイトの情報が一目でわかります。

たとえばアメブロ。

媒体紹介「アメブロ」では73.6億ページビュー。

Ad Plannerでは…こちら。11億ページビュー。1.1 Bilionって11億だよね。間違ってないよね？

PCのPVが11億で、モバイルで残り60億ページビュー稼いでる、のかな？？広告出してたらとっても気になりますよね。

ってわけで、メディア界隈の人は週明けが大変になると思います。

情報がとれるのはGoogle Adsense、Analytics、Googleツールバーがあるからしょう。もしかするとこれから、企業を中心に Google離れが始まるかもしれません。

2009/05/23 22:30追記

実のところ、このサービスがリリースは結構前みたいですね（
Google、サイト属性を調査できる「Google Ad Planner」をリリース）。でも、日本で話題で話題になり始めたのは昨日今日、やっぱり週明けは大変だと思います。

やっぱり記事のタイトルは大事ですね。

黒船Google汐留沖に出現でWeb広告業界に激震！

過去30日間に書かれた、Google Ad Plannerを含む日本語のブログ記事

このグラフをブログに貼ろう!

Kizasi.jp「Google Ad Planner」

（via ascii.jp）