投稿

6月, 2010の投稿を表示しています

iPadを見分けるすべ。

で ipad.jsは


function iPadLoadStyle(){ window.iPad = /iPad/.test(navigator.userAgent); if(iPad){ var args = arguments, d = document, head = d.getElementsByTagName('head'), linktag = function(h,m){ var tag = d.createElement("link"); tag.href = h; tag.media = m; tag.type = "text/css"; tag.rel = "stylesheet"; return tag; }; //common if(args[0]) head.item(0).appendChild(linktag(args[0],"only screen and (max-device-width: 1024px)")); //landscape if(args[1]) head.item(0).appendChild(linktag(args[1],"all and (orientation:landscape)")); //portrait if(args[2]) head.item(0).appendChild(linktag(args[2],"all and (orientation:portrait)")); } };
ありがたいですね。

http://gecko.hp2.jp/2010/05/17/【css】ipadだけにcssを適用する方法/

iPhone4ゲット

イメージ
iPhone 4をゲット。
「iPhone4どうするの?」と聞かれるたびに、「イヤー、並びますよ〜」と公言したので、有言実行あるのみ、並びました。

しかし、動き始めたのが日が変わってからぐらいで、もうSoftbankショップは並べないという情報が飛び交い、どうするかと考え渋谷にむかい、とりあえずApple Storeに並ぶ事に。
すでに何十人と並んでいて、困ったなーと思い、夜が空けるのをまつ。寒い。
明け方にストア恒例のカフェが振る舞われました。ありがたい。

そんなこんなで、8時開店。でも後ろの方は全然進まず、一歩でも進んだのは10時ごろかと。この段階で出社できない事確定で欠勤連絡。

さらにじりじりとは進むものの、このペースでは午後にも出勤できないのではと、焦りまくり、かつPCもiPhoneもバッテリーが切れる。万事休すか?最後の望みをメールに託すと、会社でもGOサインが出たので、まま並ぶ事に。
ありがとうございました!

さて、テクニカルな話としては、Webサイトはどう見えるのか?という事について。
何しろ、左の画像をクリックした大きさの画像が、8cmx5cmのサイズで表示される訳です。どうにかなるのが当然でしょ!と思った次第です。

結論から行くと、従来のiPhoneサイトの手法がそのまま使えます。仮想のビューは幅960pxですので、デフォルトではそのサイズのWebページが表示されます。
ズームも同様で、320pxとかで指定しておけば、そのサイズがviewサイズとなります。

ただ、実際のディスプレイ解像度はもっと高い。そのため、従前のiPhoneに最適の画像は、iPhoen4dでががびがびに見えます。
さらに驚いたことに、従来は普通のWebページの文字はつぶれて見えないものとして、拡大して表示する事が前提でしたが、iPhone4では「読めちゃう」。そのため、通常のページ拡大せず表示しても可読性が担保されます。

これは、デザインする側としては、よくよく考えなくちゃいけないと実感です。テクニックはこれから開発ですが、もしかすると、

画像を使う場合は解像度を高くつくってCSS3で縮小表示してブラウザで解釈してもらうと画像でなければならないところをなるべく減らし、CSSで表現する。さらに、画像についてもSVGやHTML5のCANVAS属性を用いた図形作成する。といった手法が必要…

CentOSのPHPアップデート

CentOSのPHPはバージョンが古いらしい、ということで、どうやってアップデートするのか?ということを調べてみる。

http://memorandum.yamasnet.com/archives/Post-165.html

という方法でyumでアップデートするという事をしる。で、実行したところ、php-mysqlが一緒にアップデートされずにこまる。

でも、普通に

# yum --enablerepo=remi install php-mysql
などと入れると、インストールされたのでOKとする。でも、Wordpressはその後インストールできたけれども、結局phpmyadminが使えてなかったりで、mysqlをターミナル越しに操作するという事に。。。

URL非表示

loggerにデザインエディタができてた。いきなり複雑な事ができるようになりそうだったけれど、取り合えずサンプルに差し替えてみた。

なんだか、水滴がトレンドな昨今のUI系画像。ナチュラルな素材は観ててなんだか飽きないし、落ち着くというのが、作り手からもかんじます。

さて、今日は、やっぱりweb周りのテクでなるほどと思ったことがあったので、ポスト。

iPadでメニューバーを隠す方法を試してたけれど、jsでくるくるっとやるiPhoneの方法が知れていますが、それはこちらのjsをheadにはると。

<script type="text/javascript"> <!-- window.onload = function() { // for hide URL bar setTimeout(scrollTo, 100, 0, 1); } // --> </script>
で、iPadはそもそもくるくるっとできなさそう。で、どうするかというと、webclipとしてリンクすると、起動時にメニューバーが消えるというこういう仕掛けになるそうです。
これら3行をheadに入れたらできるはず。

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=no"> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="apple-mobile-web-app-status-bar-style" content="black" />
イヤーたのしい。

いくつか

いくつかわかった事。

DNSのレコード登録
DNSのホスト名を*のワイルドカードで登録すると、どんなサブドメインでもひっくるめて登録される。が、www.sample.jpのwww無しは登録されない。なので、なしでAレコードに登録する必要がある。


viewport設定
iPadとiPhone共存させて一つのhtmlにするには、metaタグのviewport設定で、device-widthで設定する。でないと、iPhoneのviewportで表示されたり、後に読まれたほうのviewportのサイズで表示されちゃう。

http://phpspot.org/blog/archives/2010/04/ipad.html