http://mamok.com メタルな音楽・Web・Mac・三十路男の思いつき・・ Fri, 15 Aug 2008 07:10:48 +0000 http://backend.userland.com/rss092 ja もう1ヶ月以上前になってしまいますが、葛飾菖蒲祭りに行ってきました(^^; 都立水元公園で開催され、約14,000株の菖蒲と、歌謡ステージなんかもありましたよ。 →水元公園 葛飾菖蒲まつり /レッツエンジョイ東京 本来は菖蒲が綺麗だから・・って人は集まるのですが、私の目的はこれ↓。 めずらしい東京の「地酒３種セット」なのであります♪ 下町.comのこの記事で、グッときちゃった訳です。なんせ地酒3カップで500円ですよ！ そして、私が頼んだのはこの３つ。※もらったパンフレットより引用。 すべて辛口なんですが、私は「桑の都」が１番のお気に入りに。 すっきりしつつ、味わい深いのです。店のおじちゃんもハマル人が多いとか。 ちなみに奥に写っているのは、ボリューム満点の広島焼き。ずいぶんなボリューム感にやられちゃいました。 ・・で、やっぱり主役も載せないといけないですね。シャオスタイルで接写です。 帰り道、小川にかかる小さな橋には、粋が良さそうな魚がこんなところに。 車で来るとかなり混んでいますので、（個人的に）「歩いて地酒コース」がお勧めの葛飾菖蒲祭りでした♪ http://mamok.com/2008/07/25/414/ ちょっとした情報を付加してあげるのに便利な、ツールチップ。 「title属性があるじゃないか！」と思うのですが、表示は少なからずブラウザ解釈に依存しているようです。 ※Alt属性は代替テキスト用なので、そもそもの用途が違います。 ちょっと必要になったので調べてみました。 が、下記にリスト化されるぐらいあるんで・・・さてどれにするか・・ List of 25 Javascript/Ajax & CSS Tooltip Scripts まずは上記リストの中から。 #################################################### ■qTip http://qrayg.com/learn/code/qtip こんな感じで、CSS らしくスパッ！っと表示されます。 スクリプトサイズも2KBということで軽量、記述法も「aタグのtitle属性」に内容を書く形で、とても良いです。 #################################################### ■Pure CSS Tooltips http://psacake.com/web/jl.asp qTipに似ていますが、リンク文字の後にタグでツールチップ内容を記述する形の記述法で、なんか慣れない気がします・・。 こちらもCSSメインですが、JSも併用してますね。 次は、リスト外から見つけた最後の本命です！ #################################################### ■Fading JavaScript Tooltips 2kb http://www.leigeber.com/2008/06/javascript-tooltip/ こちらもqTipと同じくスクリプトサイズ2KB！なのに、上記の噴出しがフェードインフェードアウトしてくれちゃいます！ このようなものは「prototype.js」+「script.aculo.us」で実現するのが今風ですが、この2KBのスクリプトでも表現力は全く劣りません。 これは良い♪ 記述法は「onmouseover & onmouseout」で記述する必要があり、ちょっと今風?ではないですが、とても魅力的なスクリプトです。 特に、「スクリプトが軽い」→「スクリプト量が少ない」→「わかりやすい」→「カスタマイズしやすい」となる訳で、２KBのフェードツールチップのこれが大本命。 phpspot開発日誌でも簡単に紹介されています。 アニメーションする2KBの軽量ツールチップJS:phpspot開発日誌 http://mamok.com/2008/07/08/418/ 最近出会った「ヨモツネットさんの実験室」は、とても興味深いJavaScriptサンプルが多い。 利用者のためのスクリプトなのだが、Web制作者がうれしくなってしまうのだ。 例えば、 ■フォームに入力された全角文字を自動で半角に変換する 　Webフォームで「全角でお願い！」とか「こっちは半角だけ！」とか・・・ほんと入力する人に制限を強いるフォームが多いこと多いこと！ 　これを導入すれば、「どうぞお好きに入力ください♪」となります。 ■フォントサイズ変更ボタン 　公共機関のWebサイトを中心に、アクセシビリティの高いサイトを目指すことが増えてきていますが、その代表的な施策として君臨する？「フォントサイズ切り替えボタン」。実現することはまったくその通りで、他サイトと同じなのですが・・ 　フォントサイズの変更は文書ファイルであるHTMLの機能として提供するものではない気がするので、どうしても「つけてほしい!!」というときには、完全に外部のJavaScriptとして提供してみてはどうかなと思ってます。 ここの思想がすばらしいです♪完全外部・・ヘッダにポン付けです。 ■hr要素をかっこよく使う 　hrに関してはせいぜい点線ぐらいまでとデザイン的にはあきらめていたような気がする。IEとその他で表現が違うこともあり。 それが・・ IEだった場合のみ、hrをdivに置き換えしてしまうためのスクリプトを書いてみました。 う～ん、すばらしい！これで、hrのデザインが自由自在ですよ♪ 装飾線のために画像を挿入したりせず、コードはあくまでだから、文書構造の正当性が保たれます。 ■a要素のtarget="_blank"の代わり a要素のクラスに「外部の」という意味である"external"が指定されているか、pdf、doc、xls、pptファイルにリンクしている場合、リンク先を別ウインドウで開くことのできるJavaScriptです。 えー！こんなことがJavaScriptでぇ？と思うわけで。めちゃくちゃ便利じゃないですかっ！多量のPDFリンクなんかを普通にAタグ書くだけで「target="_blank"」されるんです。 ・・というわけで、それなりのWeb制作があれば、何気に不満だったことや面倒だったことを、ヨモツネットさんのピリッと小技が利いてるJavaScriptサンプルがスマートに解決してくれてるのです。 GNU General Public Licenseの範囲で個人利用、商用利用を問わず自由にご利用いただけます。 と、宣言いただいていることもうれしい。 ※ちょっとサイトデザインは怖いですがね（＾＾； http://mamok.com/2008/03/05/410/ もう1年前の記事なんだけれども、良く使うわけじゃないから、なかなか身になっていない「正規表現」。 ちょっとしたことなんですが、こんな風に書いておくと、後で見たときに非常に分りやすい！ ということを覚書・・。 PHPプロさんより・・ たとえば、もともとの正規表現が以下のようなものだったとします。 $regex = '/(w+s+){6}w+/x'; この状態ではパッと見どのような正規表現か判断しにくいと思います。 ここで、正規表現の文字列を「単語」、「スペース」、・・・と使用しやすい単位に区切って変数に保存し、その変数を正規表現で使用します。 $word = "w+"; // 単語 $spaces = "s+"; // スペース $regex = "/($word$spaces){6}$word/"; これで正規表現内に使用されている変数を読むだけで、 「単語にスペースが続く文字列が6回繰り返され、単語で終わる」と一目で分かるようになります。 ■関連リンク 正規表現をより読みやすく記述する小技 - PHPプロ！ニュース http://www.phppro.jp/news/346 正規表現メモ http://www.kt.rim.or.jp/%7ekbk/regex/regex.html サルにもわかる正規表現入門 http://www.mnet.ne.jp/~nakama/ http://mamok.com/2008/03/04/409/ 今までたまに早起きして、近所の公園で走ったりして、その朝の景色と清清しさで「すげー気持ちいい♪」なんて感動したりしていたのですが、それでも人間はなかなか習慣づかない生き物でして・・(^^; と言うわけで、最近またCM流れ出している「Nike + iPod Sport Kit」を買ったのですよ。 iPod touch買ってから、車専用ジュークボックスになっていたiPod nanoが活躍してくれるのです♪ iTunesにつなぐと、自動でNikeのサイトにランニングデータが送信され、自分の走りがきれいなグラフとなるのです。 ・・・で、コレが１回目の走り。 こうやって、ヘナチョコで休憩ばかりしてるランニングを振り返ることが出来るのですね（笑）。 そして次の週、２回目（500kcal消費を目標に設定）。 それでも確実にペースは上がり、休憩も少なくなっていくのです！ がんばれオレ！ http://mamok.com/2008/02/21/392/ 今まで日本語のWordpressと言えば「WordPress Japan」のWordpress MEだったわけですが、なんかver2.2.3以降、アップデートされないな・・・と思っていたら、本家の日本語版として、別にパッケージが出ていたことを知りました。 そのサイトがWordPress | 日本語です。 いま、MEと日本語版が並行リリースされていることで、下記のようにパッケージ比較表があり、日本語版の方がより良さそうだとわかりました。 ■WordPress パッケージ比較 この日本語版と下記のマルチバイトパッチを使えば、日本語環境は完璧のようです！ ■WP Multibyte Patch | EastCoder; ・・でも、そもそもなんで別パッケージとして新たに日本語版が出てきたのでしょうか？？ そんな疑問にも下記のQ&Aで解消です。 [Q] このサイトは、WordPress Japan に置き換わるものですか？ または派生・分裂したものですか？ [A] どちらでもありません。このサイトは WordPress.org の公式ローカルサイト立ち上げの取り組みにあわせて新たに作られたものです。ただしこのサイト、WordPress Japan いずれも日本の WordPress ユーザに向けた情報提供を行っており、互いに協力的な関係にあります。 協力関係にあるということで一安心♪ おっ！日本語版の開発にはdetlog.orgでおなじみのNaoさんがいらっしゃる！ これは心強いです。 このバージョンアップを機会に、以前から気になっていた「Gravatarが2.0になって2/15に復活」な「Gravatar」に登録してこのサイトもGravatar対応ブログにしてみようかなと思っています。 caramel*vanillaさんの記事に触発されたことも一因です。 caramel*vanillaさんより・・ Gravatar対応のblogのコメント欄にあらかじめ登録したメールアドレスを入力すると自分のアバターが表示されるという海外のblogではおなじみサービスです。 日本ではまだあまり浸透していないようですがWordPressのblogでは対応してるところよく見かけます。 面白いのに何であんまり広まらないんだろう?? ■Gravatarのサイト ■みんなGravatarに登録すればいいと思う | caramel*vanilla ■Gravatarリニューアル!!登録のススメ | caramel*vanilla ※早速バージョンアップしようと、利用しているXREA+サーバで新規インストールを試しているのですが、DB接続OKの後、どうしてもinstall.phpで500エラーが出てしまう・・orz　なんでだーーー！ http://mamok.com/2008/02/20/399/ もう頻繁に流れている「封筒からでてくるMacBook AirのCM」。 Macbook Air買ったら、是非あの封筒にいれてウケを狙いたいところ！・・・でやっぱり発売されて人気のようです。 左画像のMacBook Air の封筒ケース「AirMail」は海外サイトで、$29.95で購入できます。 そんな中、日本のAmazonで「buzz-house design」というところが作ったようで、即品切れのよう。 ■Amazon：ハンドメイドフェルトケース　MacBook Air用　オレンジ ⇒黒バージョン（ハンドメイドフェルトケース　MacBook Air用　ブラック）も品切れ？ buzz-house designのAmazonでのラインナップを見ると、iPodの裏面用に斬新なデザインのシールを多数出している会社とわかります。 日本でも続々初回出荷分が届いていて、その軽さ・薄さ、そしてアルミのソリッド感と頑丈さに、みなさん大満足のようですね！ わたしは、2月26日発表と言われる「新MacBook Pro」にひそかに期待しています。 ■MacBook Air のCM http://mamok.com/2008/02/19/393/ MacBook Air のCM曲は、YAEL NAIMの「New Soul」という楽曲だそうです。（Amazonで1800円でっせ！） 今まで知らなかったアーティストですね～。 あの軽～い薄～い感じによくマッチしていて、AppleのCMのセンスの良さに一役買っています。 そしたら、モダシンさんでなんとピアノ譜まで見つけられたそうです！ MacBook AirのCMの曲はYAEL NAIM（ヤエル ナイム）という人の「NEW SOUL」という曲なんですが、ピアノがとても印象的です。でもって割と簡単そうなのでピアノ譜を探してみたらありました。 Yael Naim - New Soul - Sheet music for Piano - TaPartoche.com おー、このサイトって無料で印刷できちゃうようです。すばらしい♪ さぁ、Youtubeで聞いてみましょう♪そして弾いて見ましょう♪ http://mamok.com/2008/02/18/400/ もう登場から2週間ばかし経って、冷静に見ることが出来る人も多くなったかもしれない「MacBook Air」。アメリカでは発送が始まり、店頭にも並び始めたとのこと。 日本での展示もApple Store 銀座や渋谷で昨日からはじまってます！！私も銀座で触ってみましたが、ホント薄い！そして軽い！ 実物を見て薄さのあまり衝動買いする人が多いのかもね！ ascii.jpの記事、MacBook Airの神髄は「引き算のデザイン」より・・・ 「ポイントは、iSightやフルサイズキーボードといったMacのバリューが、どのマシンでも同じように提供されているということです。その中でモビリティーを重視する人にはMacBook Air、価格的な魅力を求める人にとってはMacBook、ワークステーションクラスのパフォーマンスが欲しい人にとってはMacBook Proという選び方になります」（アップルジャパン） そう、いくらモバイルであろうとも「Macのバリューが、どのマシンでも同じように提供されているということ」。 Appleは（ジョブズは）、AppleStoreの店舗設計でもそうですが、必ずユーザのMac体験というものを、1番重要に考えています。 日本のモバイルPCって、とても軽く機能も豊富についているのですが、狭いモニタ・ペコペコなキーボード・安っぽすぎるプラスチック筐体、なんてものだと全く所有したい気にならず・・。 使えば色々こなせるんだけど、メーカーに愛着が沸いたり、同じPCのユーザに親近感を持つなんて全くなさそうだ。 自分たちの様々な顧客に、一様に同じブランド体験をしていただく。 どんなビジネスにおいても教訓になります。 MacBook Airに触ってみた! SF発ファーストインプレッション http://mamok.com/2008/02/03/391/ taroさんが好きな「はっぴいえんど」がiTunes Storeに登場してるんですね！ KUMANOMIXさんの記事より・・ 「はっぴいえんど」というと日本のロックの草分け的存在。 YMOで有名な細野晴臣、数々のヒットで知られる大瀧詠一、超売れっ子作詞家松本隆、異色のギタリスト鈴木茂の4人によって結成された伝説のバンドです。 最近、iTunes Storeが随分充実してきましたよね♪ほんと気軽に試聴でき、すぐ購入できる。（iPod touch ならなおさら！） これを機に、伝説のバンドに聞きほれましょう。 ■iTunes ではっぴいえんどを試聴する！ ■楽天で「はっぴいえんど」を探す！ ■関連リンク KUMANOMIX: iTunes Storeにはっぴいえんど登場 ナタリー - はっぴいえんどの全アルバムをiTunes Storeで配信 http://mamok.com/2008/02/01/397/ 先日記事にした「Pixelmatorなどのシェアウェア詰め合わせが$49!」のお祭り騒ぎがもうすぐ終わります。 いやー、このチャリティーの勢い、スゴイです。もうすぐ終了となるかと思いますが、＄50万に達しそうな額まで行ってしまいました。 アプリも10個から14個に増え、最後の「VectorDesigner」まで余裕で提供される額に。 しかも、そのVectorDesignerも日本語パッチ登場！（感謝、感謝！） Mac.EGOism.jp　VectorDesigner 日本語化インストーラー 1.0 ところで、このMacHeistってなんだ？？今回はじめて知ったけど。 そしたらppmwebさんの記事でだいたい分かりました。 ppmweb » MacHeist bundle の、ちょっと分かりにくかったところ http://ppmweb.lolipop.jp/blog/mac-softwares/to-enjoying-macheist-bundle-more ■MacHeist にメンバー登録しておくと、さらに２ドル安くなる 僕もよくは分かっていないのですが、MacHeist bundle って、「年に一度のお祭り」みたいなもので、普段の MacHeist は、定期的に出題されるクイズ（「クイズに答えると抽選で…」といったタイプのものとは違う。すごい難しい！）を解くと、シェアウェアのライセンスがただで貰える、というサイトなんです。 クイズに答えるには、メンバー登録をしておく必要があるのですが、登録しておくと、MacHeist bundle も、ちょっとだけ割引される、というわけです。 へ～、とても面白いサイトです♪今後定期的にチェックが必要ですね。 しかしメンバー登録で$2引きは、知らなかった。しかも自分の紹介リンクを登録しておけば、 LaunchBar と NoteBookももらえた可能性があったんですな(^^; ちなみに購入したソフトたち、全部インストールしました。日本語化されたPixelmatorはかなりいいです♪ グラフィックボードの無いMacBook(CoreDuo 2GHz)ですが、サクサク動きます！ http://mamok.com/2008/01/24/396/ Internet Explorer 7の「ページの拡大」機能によるレイアウト崩れの回避方法は、letter-spacingをうまく設定してあげることだった。 CNET Japan：Internet Explorer 7の「ページの拡大」機能によるレイアウト崩れの回避方法について。 http://japan.cnet.com/blog/webclip/today/2008/01/09/entry_25003869/ 「ページの拡大」機能まで検証する機会がなかったため、このような現象に悩まされているWebデザイナーが多いことを知りませんでしたが、CNET Japanさんの記事を見て、これはこれはと覚書。 具体的な方法は以下。 bodyや必要箇所では値を設定し、brタグにletter-spacing: 0;を設定することで、Internet Explorer 7の「ページの拡大」でも崩れず、また文字間も調整することができる。具体的には次のようにする。 サンプルソース body { letter-spacing: (任意の文字間を指定); } br { letter-spacing: 0; } WinIEでは、<br>にletter-spacingの値が0でないと改行が無視されるバグがあるのですね～。 ■関連リンク WinIEのバグ：letter-spacingを指定した要素内で連続したbr要素が無視される http://cssbug.at.infoseek.co.jp/detail/winie/b022.html letter-spacingをマークアップする際の注意点 - TRANS [hatena] http://d.hatena.ne.jp/aratako0/20070131/p1 http://mamok.com/2008/01/22/386/ PISCESさんの記事に触発され、私も購入してしまった「MacHeist Bundle 」 Macのシェアウェアたち（12個⇒残り3日を残しなんと14個に増殖中！）を、激安でバンドルし、一部の売り上げ金をチャリティーに寄付する企画です。 バンドルソフトは以下の通り。 1password（パスワード管理） CoverSutra（iTunesアルバムジャケット） Cha-Ching（家計簿） iStopMotion（連続した静止画で動画を作成） Awaken（目覚まし） AppZapper（ソフトを綺麗にアンインストール） TaskPaper（タスク管理） CSSEdit（CSSエディタ） Snapz Pro X（スクリーンショット） Pixelmator（画像編集） Wingnuts 2（シューティングゲーム） 総額 $428.65 （⇒1/21現在$498.60に。）がなんと $49 とな!! しかし、これはとても良い企画です。全てのソフトが欲しかったわけではないけれど、 特にPixelmatorはフォトショップCS3を買えない私に大ヒット！！Mac.EGOism.jpさんのPixelmator 日本語化インストーラの併用で、サクサク動きかっこいいフォトショップもどきが手に入りました。 iStopMotionも楽しいです。手軽にMacBook内蔵のiSightを使って連続で写真を取っていくと、それがパラパラアニメになるのです。Boinx Software - iStopMotion 2 - Examplesに色々作品例がありますのでどうぞ。 MacHeist http://www.macheist.com/ なんと、残り3日を残し2本追加！ Tiki Magic Mini Golf（ゴルフゲーム） VectorDesigner（イラレもどき） なんとこれでフォトショップとイラストレータの代わりが一気に揃いそう♪ ■関連リンク 世界初のGPUを使ってサクサク動く画像編集ソフト「Pixelmator」 - GIGAZINE http://gigazine.net/index.php?/news/comments/20070601_pixelmator/ [N] iSightで写真を撮ってお金を管理する「Cha-Ching」 http://netafull.net/macosx/016060.html Komachikid a Go Go!! Pixelmator等10個セットで49ドル http://komachikid.oops.jp/index.php?ID=228 Notes Inegales: CSSEdit http://yostos.typepad.com/yostosweb/2004/10/cssedit.html CSSEdit 日本語化インストーラ 1.0 - :: Mac.EGOism.jp :: http://mac.egoism.jp/nu/item/5790 http://mamok.com/2008/01/21/384/ あけましておめでとうございます！とうとう2008年ですね。このブログ、2003年からなので5周年となる年でございます。 さて、今年は元日に葛飾柴又帝釈天に初詣に行ってきました。（昼にはフジテレビ「第41回初詣爆笑ヒットパレード2008」でも中継されて、いろんな芸人さんも来ていたようです。）たっくさん人がいまして・・自分はさっと手を合わせ、すぐお店の方に・・。あー、今年もいらっしゃいました！ぬいぐるみをかぶった甘酒おばちゃん！！ 2年前もこのブログで話題にしたあのおばちゃんにあうことが出来ましたよ。さっそく100円甘酒とサラミウィンナー（おつまみに最適）をいただきました。おばちゃんと甘酒で心も体も暖まりました。 その後、きな粉飴・セキトメ飴を買い帰ります。 ※ちなみに名物「草だんご」はどこも行列なのであきらめました(^^; 帰る途中には、スタバで本日のコーヒーと福袋2008 （3000円）を購入。 福袋はあまり買わずスタバのものも初めてですが、南米／アフリカ／アジアの３種類あり、私はアフリカを選択。 タンブラー／マグカップ／フリース膝掛け／オリジナルCD／スタバかるた／コーヒー豆というおよそ6000円ぐらいの内容（写真参照）。 なかなか良いんじゃないでしょうか？ 今年もよろしくお願いします〜。 http://mamok.com/2008/01/01/379/ 先日、当ブログ記事の「iPod touchで公衆無線LAN。再び悩む・・」で、かなり比較調査したあげく、「どうすんよの、俺。」と迷い、「Yahoo!BBモバイル+BIGLOBE（HOTSPOT）」ではじめて見ることにした私。 マックでBBモバイルをちょくちょく使っていたところ・・このニュースです！ WIRELESS GATE　ヨドバシカメラオリジナルプラン http://www.tripletgate.com/yodobashi/ あの公衆無線LAN複合サービスの「WIRELESS GATE」がヨドバシカメラと組むことにより、月額380円で使い放題になっちゃいました！ ワイヤレスゲートは、BBモバイルポイント・livedoor Wireless・成田空港エアポートネットなど複数のサービスをひとつのIDで横断的に利用できる公衆無線LANサービスです。マクドナルドや、駅や空港、商業施設といった場所で街中でブロードバンド（高速インターネット接続）が出来ます。しかも、ヨドバシカメラオリジナルプランなら、使い放題で月額たったの380円（税込）！ 気軽にワイヤレス・ブロードバンドが楽しめます。 ということで、これは速攻乗り換え決定です。 ■Yahoo!BBモバイルオプション：210円　⇒　オプションの解約。 ■BIGLOBE（わいわい1時間」コース）：210円　⇒　「コンテンツ」コース：0円　に変更。 HOTSPOTがなくなってしまうのは若干惜しいけども、livedoor Wirelessが使えるようになって、380円は大満足。 しかも！今「登録月+翌月」の最大2ヶ月無料キャンペーン中なので、急がない方は1/1に登録すると、最大2ヶ月無料を満喫できますのでどうぞ～。 HOTSPOT系は、いまiPod touchキャンペーン実施中のwi-fine（ワイファイン）でフォロー。iPod touchで接続すれば、2月末まで無料で1日1回、時間制限無く利用できます。 ワイファイン│Wi-Fi、街に出る！ http://wifine.jp/ iPod touchの発売で、やっと公衆無線LAN業界が動き出しましたね。ユビキタス社会に一歩一歩近づいていることが実感できて、ワクワクしますね♪ http://mamok.com/2007/12/25/377/