Font Size of Ajax Chat on iPhone


Appleの基調講演・プレゼンテーションイベントの日本語通訳生チャットで使用しておりますAjaxなチャットですが、これまでiPhoneで見れるとはいえ、文字の大きさ、特に通訳ウィンドウの文字が小さくて読みにくい問題がありました。

iPhoneサイト構築用の書籍を買って、調べてみると、どうやらiPhone側でテキストの大きさを自動調整していることが理由で、通常のPC用ブラウザを制御するcssコードではなく、iPhone専用のcssコードで対応可能であることがわかりました。
-webkit-text-size-adjust: 180%;
というコード(”180%”の箇所は任意の固定拡大倍率、”none”で倍率変更不可とも定義可能)をcss中でテキストを規定している箇所に挿入することで、文字の大きさを適切に処理することができました。


これで、次回以降の日本語通訳生チャットはiPhoneで見やすくなりました。どうぞご利用ください。
なお、今回の作業では「iPhoneサイト制作ハンドブック」を参考にしました。iPhoneSDKのマニュアルを読んでも同じ結果になったとは思いますが、とりあえず急いで調べるには大変便利でした。