Apple の iPhone 3G の国内発売以降、皆さんの Web サイトでも iPhone や iPod touch からのアクセスが増加していませんか？ iPhone や iPod touch は、Safari ブラウザを搭載していますので、PC 向けの Web サイトでもほぼ問題無くブラウズすることができるようになっています。そのため、EZSite で提供されている Web サイトも基本的にはそのままで大丈夫でしょう。
とは言え、iPhone や iPod touch の画面サイズは限られていますので、利用者に少しでも高い利便性を提供することも必要だと思います。本格的に iPhone や iPod touch 向けに対応するためには、スタイルシートの切り替えや JavaScript の追加など、いろいろな方法があります。それらを実施するには専門知識や時間が必要となりますので、本項では最も手軽な方法の一つをご紹介します。
まず、この EZSite オフィシャル・ウェブサイトを iPhone で参照した際の状態（左図、クリックすると、別ウィンドウで拡大表示）をご覧ください。
そのままの状態ですと、画面の右側に何も表示されていない部分があることに気付かれるかと思います。この右側の空白部分は PC のブラウザでも表示されていますが、PC ではモニター・サイズが大きかったり、ウィンドウ・サイズを自在に変更することができたりしますので、問題になりません。また、iPhone や iPod touch でも。ピンチ（2本の指で押し開くまたは閉じる）やダブルタップ（すばやく2回軽く叩く）で任意の場所を拡大・縮小できるので、それほど問題にはならないかもしれません。
しかし、右図（クリックすると、別ウィンドウで拡大表示）のように、画面右側の余白が無い、Web ページが画面にピッタリと収まった状態だと見た目も良いですし、若干文字の視認性も向上して拡大の手間を少し減らすことができます。しかも、この変更は、既存のコンテンツを全く変更する必要がありません。
この対応方法に関する手順を、以下にご案内します。
- サイト管理エリアにアクセスして、［メインメニュー・デザイン情報］の［詳細設定］を開きます。
- ［編集］ボタンをクリックして、ページ・デザイン情報（詳細）を編集モードにします。
- ［追加情報］タブの［メインメニューの文書情報（head）］に以下のような内容を入力します。
<meta name="viewport" content="width=800">
EZSite オフィシャル・ウェブサイトは、800 ピクセルの横幅でデザインされています。このため、このサンプル・コードでは、content="width=800" と width に 800 を指定しています。
このコードを利用される場合は、サイトのデザインに応じてこの部分を適宜アレンジしてください。横幅が固定されていない（画面サイズに応じて全体が自動調整されるような）デザインの場合は、iPhone や iPod touch で表示される際に Safari ブラウザで認識して欲しいサイズを指定すると良いでしょう。
これら以外のコードにつきましては、必要に応じて適宜入力してください。
- プレビューを確認しながら、調整します。
- メインメニュー・デザイン情報（詳細）を保存して閉じて、［公開エリアへ適用］します。
- ［ページ・デザイン情報］の［詳細設定］につきましても、同じ設定を行います。
以上
