ウノウラボ Unoh Labs: ゼロからはじめる携帯サイト構築。
こんにちは、日食を妙に楽しみにしていたわりには見ようともしなかった ryosuke です。曇りで残念でした。曇りでも日食と分かるぐらい暗くなったら嬉しかったのですが、東京ではそんな事は全然ありませんでしたね。 さてさて、そんな私ですが入社後半年が経過したところで、入社当初より携わって来た携帯サイト構築に関して得た知識(失敗談)をまとめてみようと思います。 初ラボブログ記事でも触れた様にそもそも本格的な携帯サイト構築は経験に乏しく、バッドノウハウの塊の様な面倒な思いこみが先行しがちだったわけですが(実際バッドノウハウの塊ですが)、端末の機能や表現力が豊かになるのと同時に開発環境的なツールやライブラリの充実、ノウハウの蓄積と情報公開により随分すんなり入って行けた様に思います。 結局はキャリア感の差異を知り吸収する事がすべて いきなりですが、PCサイトと携帯サイトの違いで最も厄介な所はこれにつき
ウノウラボ Unoh Labs: RDBで階層構造を扱うには？
yukiです。ダイエットを始めて3kg減ったと思ったら、風邪を引いて見事に1kg増量。 運動しないと駄目ですね。あと残り20kg、道のりは遠いです。 さて今回は、「RDBで階層構造を扱うには？」です。 あるサイトを構築中に階層構造をもったカテゴリ構造にすることになり、どのようにDBで扱うか悩みました。 DBはMySQLを採用していたので、この時点でぱっと頭に浮かんだ選択肢は以下のようなものでした。 XML-DBを利用する 親カテゴリレコードのプライマリIDを子カテゴリレコードに持たせる 親を含めた『絶対パス』を名称として扱い、取り出した後にパース ファイルシステムに同様のディレクトリ構造を作り、毎回パースする (1)のXMLDBはオープンソースのeXistやXindice、Yggdrasillなど様々な選択肢がありましたが、カテゴリのみの利用な割にメンテナンスコストが高すぎるので見送りま
ウノウラボ Unoh Labs: Ext JSをUIに使って携帯サイトのシミュレータを作ってみた
五十川です。 携帯サイトの見栄えをシミュレートするウェブアプリ作りました。と言っても、実際に作ったのはかれこれ半年以上前で、手直ししてから公開しようと思ってたら、結局「guid=ON」を付け足したくらいであとは放置だったので、さすがにいい加減晒そうと。 任意のヘッダでリクエストして、レスポンスの絵文字とか変換してサイトの見栄えを確認するというものですが、これはそもそもExt JSをいじってた頃に、Ext JSでこういうの作ればいい感じになるんじゃね？ということで、丁度2.0がリリースされた頃にデモ用に作ったものなのでした（なので、かれこれ半年以上前） 実機テストの代用になるわけでは、もちろんありませんが、絵文字も含めたマルチキャリアでの見栄えを手軽に確認したいときなどに、わりと便利に使えてたりします。 スクリーンショット 機種ごとのプリセットのヘッダグループをYAMLファイルに書いておいて
ウノウラボ Unoh Labs: CSSによるデザインワークと相性のよいHTMLって？
yamazakiです。最近だいぶあたたかくなってきましたね。おかげで日中眠くて仕方ないわけですがいかがお過ごしでしょうか。 ウノウに入る以前も含めてそれなりに長いことHTMLとCSSを書いてきたわけですが、今回は試みに、「だいたいこういうところに気を使われたHTMLだと、CSSでのデザイン適用やレイアウトがやりやすいな」というこれまでの経験則を簡単ですがまとめてみたいと思います。 まあ、このあたりはCSS書く人とHTML書く人の間でちゃんとルールを決めておけばいいだけの話なので、そもそも何の役に立つのか疑問といえば疑問ですが（笑 たとえばユーザがCSSを書いてスキンを作れるようなサービスを作る際、どういったHTMLにするかを決める、みたいな時には少し参考になる、かもしれません。 ID、クラスを適切に割り振って、要素がCSS側から一意に特定できるように たとえばグローバルナビゲーションとカ
ウノウラボ Unoh Labs: プロセスの監視を行う デーモン monit
こんにちは satoです。 monitは プロセスの監視を行うデーモンです。 条件とそれに伴うアクションを指定することができます。 条件とは例えば以下のようなものがあります プロセスが起動していなかったら 特定のプロセスのメモリの使用量が あるサイズを超えたら 特定のプロセスのCPUの使用率が 50%を超えている状態が 10分続いたら 特定のポートに接続できなくなったら など アクションには以下のような物があります 起動、再起動する アラートメールを送信する ユーザスクリプトを実行する など これらを組み合わせて、プロセスの監視を行います。とくにユーザが作成したプログラムの監視などに効果を発揮します。インストールは RedHat系なら yum install monit で入ります。(CentOSや商用のRedHatはrpmforgeをリポジトリとして追加する必要があります) 主な設定ファ
ウノウラボ Unoh Labs: Emacsを自分で拡張する際のTips
ウノウでは少数派なEmacsユーザのbokkoです。 今回は自分でEmacsLisp(以下、elisp)を書いてEmacsを拡張する際のTipsについて紹介します。 拡張する際に気に留めておくこと Emacsを拡張する上で覚えておくべきなのはEmacs上で行える対話的な動作は「M-x 関数名」で実現できるということです。例えば、C-bはカーソルを1文字分左へ戻しますが、これは「M-x backward-char」とタイプすることと同じです。もしC-bが押しにくい(多分私だけです)のであれば、以下のようなelispを評価してキーバインドを変更することができます。 (global-set-key "\C-l" 'backward-char) Emacsではこのようなキーバインドに限らず、あらゆる操作をelispを使って変更したり、新たに定義することができます。関数名もしくはキーバインドの一方し
ウノウラボ Unoh Labs: 画像の遅延読み込み
yamaokaです。 webページの表示を高速化する手法にはいろいろありますが、 その一つとして遅延読み込みという手法があります。 初期状態で表示する必要のない要素については読み込まず、 必要になったタイミングで読み込み、表示するようにする手法です。 ページの読み込みにかかる時間の大半を 画像の読み込みが占めている場合が多いので、 画像の読み込みを遅延させるという手法が多く取られます。 検討するべきケース では、画像の遅延読み込みはどのような場合に検討されるべきでしょうか。 最初から表示されている必要がない画像が存在し、その画像のサイズが大きかったり、 そうした画像の数が多い場合は検討してみる価値があると思います。 例えば、次のようなケースです。 初期状態では表示されないブロックに属する画像が存在し、 JavaScriptで表示するかしないかを切り替えているような場合 ページのずーっと下の
ウノウラボ Unoh Labs: jQueryのパフォーマンス最適化に関するTips
こんにちは、山下です。 今回は、jQueryのパフォーマンス最適化について説明したいと思います。 軽量と言われているjQueryですが、いろいろな機能を実現しようとして複数のプラグインを導入すると、だんだんと動作が重くなってきます。サーバ側をいくらチューニングしたところで、ブラウザ側での処理に時間がかかっていたら、せっかく訪問してくれたユーザに重いサイトとして認識されてしまいます。以下に、ウノウで運営している「映画生活」で実際に行っている方法を紹介します。 1. Packed版ではなくMinified版を使う jQuery1.1まではPacked版のみだったのですが、jQuery1.2からMinified版もダウンロードできるようになりました。Packed版よりもMinified版を使うことをお勧めします。どう違うのかというと、Packed版はファイルサイズを極限まで削減するために静的辞
ウノウラボ Unoh Labs: ブラウザから使用できる仕様書を書くツールまとめ
こんにちはsatoです。Windows以外の環境で仕様書を書こうと思うと、なかなか良いアプリがなかったりまします。今回はブラウザから使用できる仕様書作成ツールをまとめてみました。 1) オンラインで配置図などを描く Gliffy 配置図などをオンラインで描くことができます。また 画像への出力なども対応しています。いわゆるVisioの代わりになるツールです。 2) pdfファイルをtextに変換する PDFTextOnline pdfをtextに変換することができます。pdfの内容をスクリプトなどで切り出して、データ化するときなどに役に立ちます。他にもいろいろな変換するサイトやツールがあるのですが、ここは日本語が正常に通って見た目通りに変換できます。 3) データベースのテーブル定義などを書く WWW SQL Designer オンラインでER図などが書けます。以前miyakeさんが紹介して
ウノウラボ Unoh Labs: Linuxをネットワーク経由で自動インストールする方法（前編）
miyakeです。今回は近頃流行りの、サーバの自動インストール方法をご紹介します。 1エントリにまとめるには内容が多かったので、2回に渡って書きたいと思います。ひとまず今日のところは「ネットワークブートから手動インストール」までです。 自動化の部分を期待された方は申し訳ありませんが、次回のエントリをお待ちください（普段より早めに書きたいとは思います）。 ウノウラボでは「 ベンチャー流サーバ構築のススメ(ソフトウェア編)」と題して、OSをインストールではなくコピーする方法をご紹介しています。両者を簡単に比較してみると、それぞれ以下のような特徴があります。 ■OSコピーのメリット 新サーバの環境構築の手間がほとんどない 最低限、IPアドレスの設定だけ変更すればすぐに実践投入できます。 完全に同じ構成のサーバを用意出来る 当然ながら、インストールされたパッケージだけでなく、サーバ内のファイルも同
ウノウラボ Unoh Labs: PHPで暗号化・復号化あれこれ
shimookaです。 皆さんはPHPでデータの暗号化・復号をする必要に迫られた場合、どのようにしているでしょうか？今回は、PHPで利用可能なモジュールやパッケージとそれらのサンプルを3つほど挙げてみました。 mcrypt拡張モジュールを使った暗号化 libmcryptを利用したPHP拡張モジュールです。DES、3DES、Blowfish、RIJNDAEL（ラインダール：AES暗号とも呼ばれる）、Blowfishなどのブロック暗号をサポートしています。利用可能な暗号モードはCBC、OFB、CFB、ECBです。 PHPで利用するには、libmcryptをインストールし、configureオプションに「--with-mcrypt」を付ける必要があります。また、PHP5以降、libmcrypt 2.5.6以降が必要です。 以下は、SSHやファイル暗号化ソフトウェアなどに広く利用されているBlow
ウノウラボ Unoh Labs: 携帯へメールを送る際の確認事項
harukiです。 ケータイ宛にメールを送信するサイトにおける確認事項をまとめてみました。 サーバ側 DNS IPアドレスが逆引きできるようになっているか SPFレコードが正しく設定されているか SPFは、2007年11月1日からDoCoMoも対応します。 http://www.nttdocomo.co.jp/service/mail/imode_mail/sender_id/index.html MTA EHLO/HELOコマンドでのドメイン名が正しいか エンベロープFrom/Toは正しいか その他 Fromフィールドのドメインが正しいか (Aレコード、MXレコードが存在しているドメインか) Return-Pathは設定しているか 端末で表示できる文字コード・形式で送っているか あとは、OP25B(Outbound Port 25 Blocking)に該当する場合は、その確認も必要にな
ウノウラボ Unoh Labs: auとSoftBankの絵文字一覧YAML
auとSoftBankの絵文字については、下記のページに公式の情報が掲載されています。しかし、情報がPDFであったり、HTMLであったりと、プログラムから使うのが難しいという問題があります。 EZFactory 絵文字 EZWeb絵文字一覧【タイプD】(リンク先はPDF) ソフトバンク 絵文字一覧 そこでこのPDFとHTMLをYAMLにしてみました。 諸般の事情により公開を停止しました。代わりに、同様の情報の取得方法に関する記事へのリンクを紹介いたします。 Ruby: http://d.hatena.ne.jp/tokuhirom/20070706/1183707279 Ruby: http://moriq.tdiary.net/20070211.html#p01 Ruby: http://d.hatena.ne.jp/urekat/20070927/1190905959 Perl: ht
ウノウラボ Unoh Labs: daemonsで簡単デーモン
komagataです。 mongrelを入れるときに一緒に入るdaemonsというライブラリが気になったので調べてみました。 daemonsは大まかに、サーバープログラムをstart/stop/restartなどのおなじみのやり方で操作できるようにするラッパーの機能とプログラム中で使って自分のプロセスをデーモンにする機能があるそうです。 引数を出力し続けるプログラムをデーモンにしてみたいと思います。 puts_arg.rb: #!/usr/bin/env ruby loop do puts ARGV.inspect sleep(1) end 実行結果。 $ ruby puts_arg.rb a b c ["a", "b", "c"] ["a", "b", "c"] ["a", "b", "c"] （略） これにdaemonsを使ってラッパーを用意します。 puts_arg_control.
ウノウラボ Unoh Labs: PostfixでSMTP EHLOコマンドで送るドメイン名を変更する方法
こんにちは、naoyaです。 今日は、Postfix 2系で有効なSMTP EHLOコマンドで送るドメイン名を変更する方法を紹介したいと思います。 最近、メールサーバのスパムチェック強化によって、SMTP EHLOコマンドで送るドメイン名が正引きできないとスパムメールと判定して受信を拒否するメールサーバが増えてきました。このようなメールサーバの場合、通常の設定で内部のメールサーバからメールを送信すると受信を拒否されてしまうことがあります。 Postfix 2系では、このEHLOコマンドで送るドメイン名を変更することができるようになっているので、さきほどのようなメールサーバでも対応することができます。 設定方法は、とても簡単でPostfixの設定ファイルmain.cf（Fedora Coreの場合は、/etc/postfix/main.cf）に、次の行を追加するだけです。 smtp_helo
ウノウラボ Unoh Labs: 携帯キャリアで画像を転送させない方法
Keitaです。 携帯画像で待ち受け画像などで、ダウンロードはできるけどメールに添付できないタイプの画像があるとおもいます。 ここらへんどうやるか、気になって調べてみると、 Docomoと、AUは画像のコメント部分に、それぞれ、特定の文字列を入れれればいいようで、 Docomoの場合「copy="NO"」、KDDIの場合「kddi_copyright=on」を追加することでで、携帯でダウンロードできるが、メールなどで転送できない画像が作れました。 具体的に、MagickWand For PHPを使う場合には以下のような感じでヘッダを埋め込みます。 <?php $image = NewMagickWand(); MagickReadImage($image, 'Keita_s.jpg'); MagickCommentImage($image, 'kddi_copyright=on,
ウノウラボ Unoh Labs: Webブラウジングを快適にするAutoPagerize
こんにちわ、山下です。 Software Design 10月号にサーバ監視ツールCactiについての記事を書きました。この号のNagios,Swatch,Wiiの記事もウノウ・エンジニアによるものですので、ぜひ興味のある方はご覧ください。 さて、今日はWebブラウジングを快適にするAutoPagerizeというツールを紹介します。AutoPagerizeはGreasemonkey用の拡張スクリプトで、今、自分のまわりで爆発的に流行っています。先日の出張 Shibuya.js 24でも作者の方が発表されていたのでご存じの方も多いのではないでしょうか。 念のために何をするツールかを説明しておくと、Googleなどの検索結果で次のページを表示するときに「次へ」ボタンを押さなくてもページ下部までスクロールすると、勝手に次のページを読み込んでその下に付け足してくれるものです。なかなか文章では伝わ
ウノウラボ Unoh Labs: 「サーバサイドCSS」という選択
miyakeです。突然ですが、CSSって書くの面倒ですよね。何らかのプログラミング言語を知っている人間から見ると、CSSというのは言語としてはかなり貧弱です。 もちろんCSSはプログラミング言語では無いので、それを貧弱だと言われてもCSSもいい迷惑かも知れません。でも、 div#content { ～ } div#content div.entry { ～ } div#content div.entry p { ～ } div#content div.entry ul { ～ } こういう大したことをしていないのに、コードがどんどん長くなっていくのを見ると、もう少し何とかならないものかと思ってしまいます。 コピペするにしても、 コピー元にカーソルを移動 範囲選択してコピー コピー先にカーソルを移動 ペースト という操作が必要になります。数が増えてくるとコピペのミスも発生しかねませんし、id
ウノウラボ Unoh Labs: 携帯のエラーメールの種類
harukiです。 メールを送信するサイトの場合、メールアドレスのクリーニングは定期的に行うべきです。 そのためにはエラーメールを解析しなければなりません。 そこで、エラーメールの種類をまとめてみました。 SMTPエラー 存在しないメールアドレスや、正しい形式でないメールアドレスの場合は、 DoCoMo,au,SoftBankの3キャリアともSMTPエラーになります。 例として、以下の条件でメールを送信したとします。 From: sender@example.com Return-Path: bounce@example.com To: アドレス＠docomo.ne.jp MTAにより異なりますので、ここではPostfixを例にします。 Postfixではmultipart/reportのメールがbounce@example.comに届きます (※ 必要な情報のみに省略しています
ウノウラボ Unoh Labs: JavaScriptライブラリといえば jQuery（入門編）
こんにちわ。山下です。 最近、私の周りではJavaScriptライブラリといえば、jQuery の名前がまず最初に挙がってくるようになってきました。今回は、jQueryって何が便利なの？っていう人向けに、ポイントを掻い摘んで説明します。 1.名前空間を汚さない 他のJavaScriptライブラリとかだとStringとかArrayを直接拡張してたりしますが、jQueryはグローバルな名前空間を汚しません。eachとかmapのような便利な関数もすべてjQueryオブジェクトの属性として定義されています。 jQuery.each, jQuery.extend, jQuery.grep, jQuery.map, jQuery.merge, jQuery.trim, etc. また、標準では $ にショートカットが割り当てられるのですが、jQuery.noConflict()と書くことで proto
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
