無料で使える高機能な携帯アクセス解析サービスができたようです。早速自分のブログにも導入してみました。

なんか、ケータイ対応はしてるものの、ケータイでどれだけ見られているのか今まで取ってなかったのですが、うごくひと2を設置して、結構閲覧されていたので驚いた。

まずうごくひと2で何ができるかというと

■アクセスの多い端末を写真つきで表示

■どの検索キーワード来た人が2ページ以上閲覧されてるとか

■ユーザー属性

■足あと(mixiのようなＵＩで親しんでる人にはわかりやすい)

とこれだけでも驚き。見た目的にもかなり作りこんである。

ページに仕込むアクセス解析タグは、html(imgタグ)のほかに、php、ruby、perlの言語が用意されている。

で、これをwordpressに仕込むにはどうすればいいか紹介しますね。

雨のち晴れではケータイでの閲覧に対応させるためKtai Styleというプラグインを利用していますが、このthemeディレクトリにテンプレートがあるので、そこのfooter.phpに埋め込む感じです。

以下ようにbody閉じタグ直前に埋め込んでいるのですが、ページのタイトルをURLエンコードする事によってページのタイトルも送れる様にプチ改造が必要。

<?php
$UH2url  = "http://b16.ugo2.jp/?u=******&h=*****&ut=1&guid=ON&qM=";
$UH2url .= urlencode($_SERVER[HTTP_REFERER])."|Az|".(int)($_SERVER[SERVER_PORT]);
$UH2url .= "|".urlencode($_SERVER[HTTP_HOST])."|".urlencode($_SERVER[REQUEST_URI]);
$UH2url .= "|H|&ch=UTF-8&sb=".urlencode("[page_title]");
echo '<a href="http://ugo2.jp/m/">';
echo '<img src="'.$UH2url.'" alt="携帯アクセス解析" width="72" height="16" alt="" border="0" />';
echo '</a>';
?>
</body></html>

で、wordpressの個別ページでタイトルを呼び出すタグはthe_title();なのだけど、これだとhtml出力のechoも含まれてしまうので、変数値として使いたい場合は、第三引数にfalseを入れてやります。

the_title(“”,”",false);

実際のタグは以下のような感じ

<?php
$aaa=the_title('', '', false);
$UH2url  = "http://b16.ugo2.jp/?u=******&h=*****&ut=1&guid=ON&qM=";
$UH2url .= urlencode($_SERVER[HTTP_REFERER])."|Az|".(int)($_SERVER[SERVER_PORT]);
$UH2url .= "|".urlencode($_SERVER[HTTP_HOST])."|".urlencode($_SERVER[REQUEST_URI]);
$UH2url .= "|H|&ch=UTF-8&sb=".urlencode("$aaa");
echo '<a href="http://ugo2.jp/m/">';
echo '<img src="'.$UH2url.'" alt="携帯アクセス解析" width="72" height="16" alt="" border="0" />';
echo '</a>';
?>
</body></html>

ね、簡単でしょう？

普段使っているアンケートフォーム。以前に比べてかなり使いやすくなったところもあれば、未だに古いものもありますよね。

記入漏れがある場合、エラーだされて、ブラウザの戻るボタン押して戻ったら全部入力消えてるとかありましたよね。二度と入力しねーとか思いますよね。

で、こういう使いにくいアンケートフォームをいろいろ改良していくことが勉強になるんですね。最初は入力したものが特定のメルアド宛に送られてくるだけのものを、今度はDBを使いきちんと顧客管理できるようにしたり。データをcsvでまとめて落とせたり。アンケート項目も好きなように作れると便利ですね。

で、実際仮のアンケフォームを作ってみた。

デザインの観点で言えば、必須項目を入力しないで送信された場合・・・

入力されてない項目を目立つように赤枠で囲んだりしてみるとかやるといいっすよね

送られてきたデータは管理画面で一覧表示

修正がある場合は編集

アンケ項目の編集とかもできる

で、今回これらの事をいかに少ないソースと処理で行うためいろいろダイエットしてみた。よく、プログラム書くとき、同じ処理は2度書かないと言うけど、そういうのを施すわけで。

で、これを突き詰めたものがライブラリとかフレームワークなんだなぁと。

自分管理ツール(開発中)作ってた。phpで。

アレなんですよ。転職してからもうすぐ3年目ですけど、プログラム書かなくなったりhtml組まなくなったりして、それはそれで仕方ないんですけど、「作る」ってう事をしないとアイデア力も衰えてきてる気がするんですよね。実際前の会社にいた時の方がいろんなもん作ってたような気がするし。（ブラックマンとか。エロブロック崩しとか。ライブイベントとか。etc…)

要はネットで出来ることを把握しないとアイデア量も半減してしまうというのがココ最近の結論。

というわけで自分管理ツールつくりますた。なんで自分管理ツールなのかって言うと、役立つので飽きないと思ったから。知識まとめと言うか、自分記憶力が悪いので、書き留めたものをすぐに探せるとか、そういうツールです。記憶力が悪くなるのは仕方ないけど悪いままにせず、知恵を絞って補完ツールを作れば記憶力なくても人生何とかなると思う。人の名前をすぐ忘れるのはさすがにヤバイと思ってますが。。。

このツールをどんどんカスタマズすることでプログラムの勉強、及びアイデア力の鍛錬になる。はず。ライブカメラの動画も久々配信しようか迷っている。

実はこの自分管理ツールですが、静的なhtmlでかなり前から作ってたのですが、今回バージョンアップしてデザインも変えて内容も1から組みなおしています。仕事の事やプライベートな事など、「自分まとめサイト」を作るかのごとく記述していくわけですが、まだ情報が少ないので素っ気無し。、あと2、3年したら色が出てくると思われ。まあ公開はしないけど。

まだちょっとしか使ってないけど、結構いいね。自分が買ったパッケージはWeb Premiumなんだけど、動画系以外は全て入ってます。

DreamWeaverに関して言うと、htmlファイル開いたら、それに読み込まれているCSSとかJSとか一気に読み込まれるんでかなり効率アップです。新しい機能でライブビューというのがあって、サーバーにアップロードせずにプレビューできるようになった。今までもプレビュー機能はあったけど、実際ブラウザを開くやり方だった。ライブプレビューの場合は左にソース、右にライブプレビューのようにソース編集してリアルタイムにプレビューが変わる感じです。ライブプレビューのhtmlレンダリングエンジンはsafari並の表現力を持ってるので再現度は文句なしです。

photoshopは複数のプロジェクトをいじるとき、前は個別ウィンドウ切り替えだったのがタブになったのがいい感じです。これはイラレもFlashも共通ですね。タブになるとかなり効率上がると思う。

あと、若干軽くなったかな？

ひとまず使ってみないとなんともなので、あまり書けないんですが、第一印象は「悪くない」です。

自分の前職、今の職。比べてみるとだいたい合ってる気がする。

特にこの部分
＞法律的に正しい仕事のやり方を教わることができます。

これのおかげでベンチャーと大企業の違いを思い知らされたわけで。

よく会社に入ると「大学でもっと勉強していればよかった」なんて事を言う人が多いですが、今の職場に来てから確かにそう思った。

ただ、ちゃんとしてるのはいいんだけど、ネットビジネスに必須なスピード間が削がれるのが痛いんですよね。ネットサービスって先にやったもん勝ちじゃないですか。あまりクソ真面目にやると自分で自分の首を絞める感が結構感じられるんですよね。

数億円かけて犯行予告を探知するソフトを開発しようと政府が試みてる最中に個人が0億円で2時間で開発しちゃう例とかありますからね。

Wonderfl Build Flash Online

他人の作ったソースはForkという分類で改造してまた共有できるみたいです。

すごいな－、またFlashが一段と面白くなってる。残念ながら仕事で使う機会は今のとこないんだけど、こういうのはひそかにメモっといて実験してみたい。

利用にはログインが必要だけどOpen ID・Hatena・Yahoo!・livedoor・mixiのIDが利用できるようです。

My DebugBar | IETester / HomePage

こんな感じ

新しいタブを開くときにどのバージョンで開くか決められます

開いたタブはどのバージョンか分かりやすくなってて(　・∀・)ｲｲ!

ほんとはこー言うツールってマイクロソフトが出すべきじゃない？っていつも思うんだけど。

例えばこの雨のち晴れでも、トップページでどこがクリックされてるか訪問者が分かるようになるとどうなるか？

一番クリックされているところは、その先にユーザーが求めているものがある可能性が高いと言う事だし、初めて訪れた人にとっても、常連がどこに遷移しているかが分かれば迷うことがないと思う。

ビジネス観点で言ったら、広告バナーはおそらくネット暦が長い人ほど押さないと思うけど、そこに「昨日は500人がクリック」という情報を添えただけで押したくなる心理があったりする。

ニコニコ市場みたいに、***人が購入しました、みたいな見せ方ってうまいと思うんだよね。自分もそれに釣られていろいろモノを買ったりしたので。「え？こんなに買ってる人がいるの？なんで！？」と思わせることによって、その先の展開を見たくなるのは当然の真理。そこで見た情報で買う買わないは判断すればいいわけで、そこにより多くの人を到達させるために、クリック数情報はユーザーにとって、また管理人にとってもメリットがあると思う。

で、googleanalyticsを使ったトラッキングの情報をマッシュアップ的に表示できないのか、その辺を今度調べたい。PV上げるよりCTR上げる事って結構重要だと思うんだよね。

・floatをクリアーする用の意味のないタグはもう使用していない

これはあれですよ。float使うと縦の背景がうまく敷けない事があるのでわざわざfloatをclearするclassを付けた空タグをfloatを使ったboxの閉じタグ直前に入れるんです。こうすると背景がうまく敷けるようになります。

でも今はこんなやり方をしています。

構造のマークアップなしでフロートをクリアする方法

なんでこの方法に変わったかって言うと、本来web標準に沿ったhtmlを書くなら、float解除のためだけの無意味なタグを入れるのは不要なんです。それを回避したのがこの方法で、今では一般化しています。

・*でCSSをデフォルトにする方法は使用していない

*(アスタリスク)で全てのタグのmarginやpaddingを0にして、ブラウザ固有のCSS設定をまずリセットするやり方は、例えばfirefoxでリストボックスを使うとテキストが途切れたりするらしいのであまりいい方法じゃなかった事が判明。

今ではYahoo! UI LibraryのReset CSSというのを使ってリセットするのが一般的。

一方、ぬかみそCSSと言うのがあって、シックスアパートに在籍している2xup.orgの管理人が作成したcommon.cssもリセットCSSとして一般的です。

スタイルシートを分けて管理する方法をまとめる – 2xup.org

なんでぬかみそかと言うと、常に手を入れているからだそう。ぬかみそ。1日1回はかき回す。そういう意味合いだそうです。

で、さらにはそのリセットCSSに若干アレンジを加えた「浅漬けCSS」というのもあります。

default.css

つまりリセットCSSの進化版で、多少イケてるデザインを施したオレオレ的なCSSです。実際default.cssを適用するとこんな感じ。

とまあ、CSS、いろいろ進化しているんですよ。1年に1回は復習すべきだと思った。現在webページはmobileやiphone、プリント用、いろんなデバイスに対応させなきゃいけないし、それを効率的に管理するCSSの作り方が開発されています。さらに定期的に見た目のデザインを変えるためにthema.cssだけをいじれば変化できるように改良されていたり。

うむ。。。

今日ちょっと失敗をやらかしてこれは学ばなきゃと思った次第。知識として知るのもそうだけど、web技術に関しては知識＝組める事なので、やっぱりガリガリ書ける事が目標。

実際それができるかできないかで大きな違いが出るのも実感したし、サービス担当者として分からないのはあまりよろしくないと。

これから毎日1時間ずつ書いてみることにする。前も学びかけたけど、AS3の方を先に手を出してしまったが、やっぱりJavascriptの方が優先度、実用度共に高いっす。

技術が分かり、サポートができ、代替案を提案でき、新規企画を考え、お金に結びつける。幸い今の職場はお金に結びつけるプロと技術のプロ両方いるので、お互いに助言を頂きながら仕事ができる環境なので相当恵まれていると思う。

今日1日で目の色変わったわ。