Tags : Apple
このTagsの登録数:74件 表示 : 36 - 42 / 74
2007/11/09
2007/10/16
お、Leopard (Mac OS X v.10.5) が 10月26日発売みたい
というニュースを見かけて、記事にしようかと思ったけど、Google ブログ検索で Leopard を検索してみたら、既にすごくたくさんの人が言及していた…。と言いながら書いてますが。
今すぐ Leopard を予約したい人は オンラインの Apple Store で購入できます。
Apple の iPhone/iPod touch 開発ドキュメントの一覧
自分用に Apple の iPhone/iPod touch 開発ドキュメントの一覧をまとめてみます(2007年10月15日現在/2007年12月4日更新)。意外に見つけにくいんですよね。
気が向いたら、この記事をアップデートして、補足コメントを付けてみたいと思ってます。
基本中の基本
iPhone 関連の Reference Library
その他のリソースとしては、ADC の Reference Library の iPhone の項などがあります。
- iPhone Reference Library
- iPhone Guides
- iPhone Release Notes
- iPhone Sample Code
- Safari Technical Notes
iPhone の Reference Library 一覧
以下に iPhone のリファレンスのリンク構造を可視化しました。重複がありますが、そのままにしています。
-
-
iPhone Safari Reference Library
- Why am I getting odd, unexpected results with various viewport tag settings
- Customizing Web Content for Safari on iPhone
- Safari Release Notes for iPhone (1.1.1)
- Safari Web Content Guide for iPhone
- iPhoneButtons
- iPhone Human Interface Guidelines
- iPhoneListPatterns
- Safari CSS Reference
- Preparing Content for Safari 3 and WebKit
- JavaScript Coding Guidelines for Mac OS X
- Safari HTML Reference
- Web Kit DOM Programming Topics
- MakeiPhoneRefMovie
- iSudoku
- Exporting Movies for iPod, Apple TV and iPhone
- Puzzler
- Web Kit DOM Reference
Apple による iPhone Dev Center (追記)
が公開されました。
iPhone Tech Talk のビデオも公開されており、よくまとまっています。
2007/10/11
iPhone/iPod touch の viewport の概念の補足
Safari on iPhone/iPod touch に導入された meta 要素の viewport 属性ですが、使ったことがない人にはなかなか理解しづらいようなので、ちょっと補足しておきます。こんな突っ込みもあったので。
リキッドにしとけばいいだけの話とちゃうの?
いや、違うんですよ。
前回、viewport は仮想的なウインドウということを説明しましたが、この仮想ウインドウは、閲覧しているユーザによって大きさを変更できない、サイズ固定のウインドウなわけです。
そして、Safari on iPhone/iPod touch は、基本的にこの仮想ウインドウの(横幅)全体が、横幅 320px(縦持ち時)のディスプレイに納まるように、縮小(もしくは拡大)して表示しようとします。
viewport のデフォルト設定は 980px。980px を 320px 液晶に納めるために約 1/3 に縮小されて表示されます。よっぽどフォントサイズを大きく設定していない限り、拡大しないと読むのはつらい大きさです。
ウインドウサイズ固定なので、リキッドレイアウトであるかないかは、この点においてはあまり関係ないでしょう。リキッドレイアウトのメリットは、どんなウインドウ幅でも柔軟に表示できることですが、viewport
を設定しない限り、リキッドであろうがなかろうが、Safari on iPhone/iPod touch は 980px 幅のウインドウでブラウズした状態でページを表示します。ということは、結局、約 1/3 に縮小して表示されてしまいます。ウインドウ幅固定なのでリキッドレイアウトの利点が活かせません。
viewport
を自ら設定する際は、リキッドレイアウトの利点が活きてくると思います。一方、固定幅のレイアウトのサイトで、その幅が 900px のようなデフォルトの 980px とあまり変わらない値なら、viewport
を width=900px
に設定したところで、Safari on iPhone/iPod touch での表示はほとんど変わらず小さいまま(320/900 = 約 1/3)です。
リキッドレイアウト等を用いており、サイト幅が柔軟に変更できるなら、例えば viewport
を width=640px
と設定すれば、縮小率を 1/2 程度に抑えられます。このくらいだと拡大せずに十分文字の読める大きさです。 width=320px
にしても破綻を来さないデザインなら、等倍で表示させることもできます。
具体的な viewport の設定方法は前回の記事をご参照ください。
おまけ:viewport を設定した人たちの喜びの声が!
インチキ通販にありそうな見出しですが、リファラより。
2007/10/05
ウェブサイトを iPhone/iPod touch 対応にする最も簡単な方法
viewport を設定して iPhone/iPod touch に対応しよう
ぼちぼち iPod touch が届き始めましたね。
Safari on iPhone/iPod touch のために用意された meta 要素の viewport 属性1を使って、あなたのサイトをなんちゃって iPhone/iPod touch 対応にする方法を説明してみたいと思います。
方法は簡単です。
<meta name="viewport" content="width=1024" />
head 要素に上記のようなタグを入れるだけです。ただ、ここで width に指定する横幅を自分のサイトに合わせて最適化する必要があります。
ちなみに、上記の width=1024
となっている viewport
の設定は Apple のホームページで使っているもの。(xhtml を使ってないためか、正確には最後のスラッシュがない形になってますが。)
なお、実のところ、viewport なんて設定しなくても iPhone/iPod touch からほとんどのウェブページは見ることができます。わずかながらレイアウトが崩れる場合や、重い JavaScript のためにエラーが出てしまうページはあるでしょうが。
なお、viewport 以上のより細かいカスタマイズをするには、iPhone/iPod touch 専用の CSS を用意したり、さらには、User Agent を見て、専用ページに振ってしまう方法もあります。
以下、自分のウェブサイトに合わせて、どのように viewport を設定すべきか考えてみます。
2007/10/03
iPhone/iPod touch 用 RSS/Atom フィードリーダー reader.mac.com
iPhone/iPod touch 専用の簡易フィードリーダー reader.mac.com
reader.mac.com でのフィード表示例
iPod touch/iPhone で RSS/Atom フィードを開くとリダイレクトされる reader.mac.com は、シンプルなフィードリーダーです。
フィードを表示するためだけのリーダー(ビューアの方が近い?)であって、アグリゲータ (aggregate = 集める) のように登録されたフィードを購読したり管理する機能はありません。リンク等からアクセスしたフィードを見やすいように整形して表示するのみの、その場限りのものです。その際の URL は以下のようになります。
- http://reader.mac.com/mobile/v1/(Feed URL)
例えば、当ブログのフィード
にアクセスすると、`
に飛ばされて、フィードの内容が表示されます。(右の画像は表示例)
以下、reader.mac.com の表示設定をもう少し詳しく見てみます。Apple 自身による iPhone/iPod touch 用アプリケーションなので、参考になることがあると思います。
2007/10/02
iPod touch/iPhone の viewport 属性の区切りはセミコロンではなくカンマ
viewport 属性の区切りはセミコロンじゃなくてカンマじゃない?
日本でも iPod touch/iPhone 用のウェブサービス・インターフェイスが続々出てきましたが、実際に使われている meta 属性の viewport プロパティの区切りが2種類存在することに気が付きました。カンマ(コンマ)を使っているところと、セミコロンを使っているところです。
- カンマ区切りの viewport
<meta name="viewport" content="width=320, user-scalable=no /">
- セミコロン区切りの viewport
<meta name="viewport" content="width=320; user-scalable=no; /">
Apple の開発資料12345に示される例は、すべてカンマ区切りとなっているので、カンマ区切りが望ましいと思われます。最初そのことに気がつかずに、セミコロン区切りで書いたものをコピー&ペーストしていました。
すると user-scalable=yes
にしているにも関わらず、拡大縮小ができなくなってしまいました。ちょっと悩んだ末に、区切り文字の違いに気がつき、カンマ区切りに修正したところ、きちんと拡大縮小できるようになりました。ちなみに (訂正:デスクトップの Safari 3 で拡大縮小ができないのは、user-scalable
の設定は Safari on iPhone/iPod touch に対してだけでなく、デスクトップの Safari 3 にも影響があり、user-scalable=no
で文字の拡大縮小ができなくなるようです。-webkit-text-size-adjust: none;
という CSS のためでした。)
user-scalable=yes;
で Safari for iPhone/iPod touch のピンチ動作が使えなくなる(追記)
上記で、カンマ区切りにしたときに、拡大縮小ができなくなったのは、user-scalable
の後にあるセミコロンが原因ということがわかりました。viewport 属性の区切りはセミコロンでも一応動くようなのですが、
<meta name="viewport" content="width=640; user-scalable=yes; /">
と user-scalable
の後にセミコロンを付けると、user-scalable
の値が偽になるのか、拡大縮小ができなくなります。セミコロンを付けずに
<meta name="viewport" content="width=640; user-scalable=yes /">
とする分には、拡大縮小含め、一応正しく機能しているようです。しかし、Apple の開発ドキュメントに習えば、セミコロンではなくカンマを使った方が無難でしょう。
viewport 属性の区切りの例
カンマ区切りの viewport の例:
- Apple の開発ドキュメント
- Apple の iPhone 開発用サンプルコード[^TL-154_iPhoneDev4]
- iPod touch/iPhone 用 NHK ウィジェット6
セミコロン区切りの viewport の例:
実はこれらのサイトはことごとく iPod touch/iPhone 専用インターフェイスで、かつ、user-scalable=no
にしているものが多いので、viewport の設定が壊れていても影響が出ていないのだと思います。
-
Apple Developer Connection - iPhone for Web Developers - Optimizing Web Applications and Content for iPhone(日本語訳) ↩
-
Apple Developer Connection - Documentation - Safari Web Content Guide for iPhone ↩
-
Apple Developer Connection - Technical Note TN2100: Customizing Web Content for Safari on iPhone ↩
-
Apple Developer Connection - Safari Web Content Guide for iPhone: Using the Viewport Meta Tag ↩
-
当ブログ過去記事:Google の iPhone Search の iPhone 用設定を見る ↩
Boot Camp Assistant が /Applications/Utilities に見当たらない場合1に、Boot Camp Assistant をシステムディスクから簡単にインストールするユーティリティを作ってみました。
難しいことはしてません。BootCamp.pkg を探してきて、立ち上げるだけのアプリケーションです。Terminal で打ったり、Finder で不可視ディレクトリを開いたりする手間を省いているだけです。AppleScript で書いてます。
必要条件
田中俊光のblog: Boot Campアシスタントの単体インストール ↩