画像を使わずCSSだけで角が欠けた表現をする方法がBeveled corners & negative border-radius with CSS3 gradients | Lea Verouに書かれていた。角丸の表現も飽きてきてたので新鮮だったが、CSSの量が多く（ベンタープレフィックスの為だけど・・・）面倒なのでジェネレーターを作ってみた。
「Css3 Corner Cutter」
この角が欠けた表現をする仕組みは背景を4分割してそれぞれの角に透明から急に色が付くグラデーションを塗って角が欠けた表現をしているので、背景もうまく透過している。
ただ、元のCSSだときれいに4等分（縦横50％）しすぎで要素の幅や高さが奇数の場合に隙間があいてしまっていたので、ジェネレーターでは縦横51％にして少しかぶせて隙間が現れ無いようにしています。
MooToolsのプラグインSlideshow 2!を使ったサイトを過去に作っていた。
Slideshow 2!はすごく重いけど（この時点で問題があるがクライアントの希望なので・・・）、簡単にかっこいいスライドショーのアニメーションを実現するするプラグインで制作当初はちゃんと動いていたが今日InternetExplorerで見てみると「DOM Exception: INVALID_CHARACTER_ERR」なんてエラーが現れた、しかもmootools.jsの15行目とか言ってる。
調べてみるとSlideshow 2!が使用してるフレームワークMootoolsでエラーが出たので最新版のMootoolsに差し替えてみたが変化なし。
検索しても日本語サイトに解説してるところが見つからないのでがんばって英語のサイトを見てみると1.2.5ならOKっぽい事を書いていたが今度はslideshow.js側でエラー。
最新版のMooTools1.4.3にしてもMootoolsでエラーが出る。両方とも最新にしようと思ったがSlideshow 2!の最新版はMootools 1.3用だった。
今のところ問題なのはIE9だけなのでIE8の互換モードを使う事にした。
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />IE8だと描画速度が落ちそうな気がするが仕方ない。
仕事で使うつもりで作ったけど使わなくなったのでアップしときます。
縦横比の違う画像を並べる時に横幅基準や高さ基準にしてしまうと、画像の面積がまちまちになり、画像の印象の優劣が出てしまうので面積を統一できます。
基準となるサイズを選んで、画像のサイズ（ピクセル）を入力すると結果が表示されます。
結果は倍率と画像のサイズ（ピクセル）として表示されます。
あまっこに「いいね」ボタンを付けたのだけど、なぜかちゃんと動かない。
一瞬追加された様に見えるが戻ってしまうという奇妙な動きをする。facebookにログインしてみてもいいねが反映されていない。
Like Buttonで再度ボタンを作成してみたが
「Only verified developers can be added as listed developers of this application.」
というアラートが現れて作成に失敗する。
「キャッシュを削除すると作成できる」という記事があったので試してみると問題無く作成できたが、再作成したコードでも動かない。調べてみると以前は動いていたマイリリースの「いいね」ボタンも動かなくなっている。
なんやかんやでURLリンターというツールを見つけて試してみるとmetaタグで画像ファイルを指定していたのだがローカルパスだったのが原因だったようだ。
以前は画像パスが間違えていても「いいね」できていたが最近は厳しくなったようだ。
以前、ソーシャルブックマークが流行ってるって事で、このブログにもソーシャルブックマークのボタンを付けたり、マイリリースにもトップと公開ページにもソーシャルブックマークのボタンを付けていたが、時代は移り、最近では「いいね！」ってのを付けてる所が多い。（ソーシャルフィードバックっていうらしい）
なんでも、海外の人気SNS「facebook」で使われてる機能らしく、最近ではmixiやgreeも同じ様な機能を付けている。この「いいね」ボタンを付けるとアクセス数が増加するという事で一気に広まっている。
個人的にはfacebookもGREE（PC版）もやった事ないしmixiも殆どログインしていないのでどんなに便利なのか分からないが、ただ携帯版のモバゲーにmixiのいいね（mixiチェック）が付いていて気にはなっていたので調べてみた。
まず、今までのソーシャルブックマークは基本的にブックマークレットを使って登録するので、ページ制作側は特に何もする必要が無く、ボタンを付けたければボタンをJavaAcriptなどでタイトルとURLを送るボタンを用意するだけでOKで製作者側は楽だった。
ソーシャルブックマークだと「タイトル」と「URL」の2つの情報だけしか無く、ブラウザに付いてる「お気に入り」の様に埋もれてしまう事が多かったが、facebookの「いいね！」の場合はOpen Graph Protocolという書式に従ったタグをHTMLに記載してこの情報を元にブックマーク（？）をするので、ページ概要や画像等の情報を含めた内容が保存出来て埋もれにくそうようだ。
OGPは標準の書式にしておけば良さそうで携帯版が別URLの場合はmixiやGREE様に追記する感じでOK。（画像を載せる場合はmixiの仕様に合わせてリサイズすると他でも使えるかと思います。）
他にもTwitterやEvernoteへのボタンも欲しいところだ。
ソーシャルブックマーク系のもGoogleブックマークとYahoo!ブックマークとLivedoorクリップは人気なので残す事にした。
個人的にソーシャルネットワークを使いこなせてないので、仕様を読んで理解するのにかなり時間がかかってしまったがようやく設置できた。
mixiチェックにamazonからの画像が掲載されなくて悩んだけど、ミクシィ デベロッパーセンターにて許可するドメインにamazonの画像サーバーを登録していない事が原因だったようで、登録すると表示された。
facebookは「いいね」か「シェア」かを最後まで悩んだけど「いいね」にしました。
MyReleaseの新規セッションの割合が低下していた。
Yahoo!が検索エンジンをGoogleの検索エンジンに切り替えた為だ。
そこで、PHPの高速化をとスクリプトを調整していたが限界が来たのでサーバーの設定を変更することにしました。
とりあえず「eAccelerator」を入れてみた。
MyReleaseはCPIのVPSで元々PHP4でPleskという環境に、無理やりPHP5を導入してるので不安だったが何の問題もなくインストールできた。体感できるほど速くはならなかったがコンパネから利用状況が分かり頑張ってる様子がわかる。
次に「eAccelerator」と同居できるという事で「ZendOptimizer」もインストールした。
これは入会する手間はあるが簡単にインストールできた。
ただ、バージョンが3.3.9と新しく色んなサイトで紹介されてるインストーラーを使ったインストールができないが、必要なファイルをコピーしてphp.iniにコピーした場所を記述するだけでOKという簡単な作業でインストール完了。
更にmySQLのインデックスも微調整した。query_cacheを調整したりすると、ようやく体感できるレベルに改善された。
このおかげかは分からないけどランキングは約一年ぶりに5位に戻った。
まとめサイトのサイドバナーによくamazonのフィギュアを載ってるのをよく見る。amazon画像編集ツールamacco -あまっこ-も元々CDのジャケット用に作ったのだけど実際は殆どフィギュアばかりだ。
大抵フィギュアの背景は白で味気ない「PhotoShopとかで魔法の杖（マジックワンド）を使ったら簡単に切り抜き画像作れそうだな」と思ってPHPのGDで出来ないか調べてみた。
GDにはそんな機能は無かったがアルゴリズムの紹介にシードフィルというアルゴリズムを使って塗りつぶす方法がC言語で書かれていたのでPHPでもやってみた。
PHP 切り抜き
画像上の切り抜きたい場所を適当にポチポチ数カ所クリックして画像生成を押すと切り抜き画像が出来る。
白（左上の端の色）と画像の各ポイントの色の差を連想配列に入れておいて、画像上でクリックされた各ポイントからシードフィルアルゴリズムで塗りつぶしを繰り返し、（実際塗りつぶす訳じゃなく塗りつぶしのデータはマスク用の連想配列に入れる）処理が終わったら、マスクデータにぼかしをかけたりして、マスクを適用させて画像を生成するという感じ。
今回はテストなので普通に多次元配列を使ったが色情報なのでサイズ固定のSplFixedArrayを使った方が速そうな気もするが・・・。
あまりキレイでは無いので役に立たないかもしれないけどPHPで簡単切り抜き画像が作れることはできるという事が分かった。
パスワードを記録し、暗号化するための、超アナログな方法 : ライフハッカー［日本版］の記事を見て圧縮して財布の中に入れられるようなモノを作ってみました。（前にも似たような記事を見たような気がするが）
Password Matrix
本家と同じだと財布に入るサイズにすると字が小さくなって読めなくなるので26あるアルファベットを2分割し、13×13のマスにしています。本家だと半角記号も含まれてますが日本では半角記号を許可していないサイトが多くあるのでデフォルトでは外しています。（あと間違いやすい0ゼロとOオーとか1いちとl小文字のLとか間違いやすそうなの文字も外しています。）
年賀状の時期ですので間違えた年賀状に印刷してカードサイズに切るといいかもしれません。
amazonのAPIなんかを利用して画像のパスを取得し保存していると稀に画像が削除されてしまってる事がある。
毎回、amazonのAPIを叩く様にしてもいいかもしれないけど頻繁にアクセスするとamazonに怒られるかもしれない。
そこで、ファイルが存在するかチェックする事にしたのだけどPHPには色々関数があるのでそれぞれチェックしてみた。
(さらに…)
yahoo!の検索エンジンがGooleの検索エンジンになるというニュースはありましたが
とうとう切り替わったのを確認してしまいました。（徐々に切り替わっていくらしい）
Googleはページの表示スピードも見てるらしいので少しでもPHPのスピードを上げたくて最近ではベンチを使って速度を比較している。
他者の計ったベンチがGoogleで調べればすぐに出てくるのになぜ自分で調べるかというと、例えば文字の置換はstr_replaceを使い。
$str = str_replase(“AAA”, “BBB”, $str);
とするが普通で速度も早いが、検索文字（例の場合”AAA”）の出現がレアな場合
if (strpos($str,”AAA”) !== false) $str = str_replase(“AAA”, “BBB”, $str);
と置換する前に先に検索した方が早かったりするので、実際のデータが無いと分からないのでベンチを計る必要が出てきたりする。
そんな中、比較的遅いというmb_ereg_replaceを使ってるマルチバイトのtrimを調査してみることにした。
$str = mb_ereg_replace(“^[ ]+”, “”, $str);
$str = mb_ereg_replace(“[ ]+$”, “”, $str);
昔、Shift-JISで単純にtrimの第2引数に全角スペースを入れてトリムすると文字化けしたのでmb_ereg_replaceを使ってるが、安全だけど遅い。
そこで昔文字化けした理由を調べに文字コードをwikipediaで見てみた。
Shift_JIS
第1バイトが81-9FとE0-FC、
第2バイトが40-7Eと80-FC
EUC-JP
第1バイトがA1-A8とADとB0-F4とF9-FC、（亜種は8FとF5-FEも）
第2バイトがA1-FE（亜種は第3バイトにもA1-FE）
UTF-8
第1バイトがC2-FD、
第2バイト以降が80-BF
trimのデフォルトの第2引数は
” ” (0x20), 半角スペース
“\t” (0x09), タブ
“\n” (0x0A), 改行
“\r” (0x0D), 復帰
“\0” (0x00), NUL バイト
“\x0B” (0x0B), 垂直タブ
とどの文字コードにも危険なコードが含まれていないので普通に使える。
ただtrimはマルチバイトには対応していないのでシングルバイトに変換され削除されるので全角スペースを除去しようとすると下記のように問題が発生する。
Shift_JISの全角スペースは0x8140でtrimの第2引数に全角スペースを入れると81と40が削られアウト
（http://charset.7jp.net/sjis.htmlの81と40が絡む行や列が文字化けする。）
EUC-JPの全角スペースは0xA1A1でtrimの第2引数に全角スペースを入れるとA1が削られアウト
（http://charset.7jp.net/euc.htmlのA1が絡む行や列が文字化けする。）
UTF-8の全角スペースは0xE38080でtrimの第2引数に全角スペースを入れるとE3と80が削られアウト
正しく全角スペースをトリムするならmb_ereg_replaceしか無く、すべての全角スペースが半角スペースになってもよければ
$str = trim(str_replase(“ ”, ” “, $str));
と先に全角スペースを半角スペースに変換するなど、シチュエーションによって使い分けるしか無いようだ。