「スマホサイト制作」の版間の差分
ナビゲーションに移動
検索に移動
編集の要約なし |
編集の要約なし |
||
| 4行目: | 4行目: | ||
<div id="manual"> | <div id="manual"> | ||
==スマートフォンの特徴・仕様== | ==スマートフォンの特徴・仕様== | ||
<p>まずはスマホのことを知っておきましょう。</p> | |||
===■iPhone=== | ===■iPhone=== | ||
<p>解像度：320×480px（4は640×960だがブラウザでは320×480で表示する仕様になっている）<br> | <p>解像度：320×480px（4は640×960だがブラウザでは320×480で表示する仕様になっている）<br> | ||
ブラウザ：Mobile Safari（WebKitベース）</p> | ブラウザ：Mobile Safari（WebKitベース）</p> | ||
<br> | <br> | ||
'''「Mobile Safari」の制限'''< | '''「Mobile Safari」の制限''' | ||
<p> | |||
・プラグインに非対応→「Flash Player」が使えない、等<br> | ・プラグインに非対応→「Flash Player」が使えない、等<br> | ||
・文字コードの変更ができない→meta要素で文字コードを忘れず指定する<br> | ・文字コードの変更ができない→meta要素で文字コードを忘れず指定する<br> | ||
・ウィンドウの制御ができない→常に全画面<br> | ・ウィンドウの制御ができない→常に全画面<br> | ||
・ファイルのアップロード、ダウンロードもできない→アプリで対応 | ・ファイルのアップロード、ダウンロードもできない→アプリで対応<br> | ||
・ファイルサイズなどの制限→「Safari Web Content Guide」参照 | |||
</p> | |||
<br> | |||
===■Android=== | ===■Android=== | ||
<p>解像度：320×480px～640×960px<br> | <p>解像度：320×480px～640×960px<br> | ||
ブラウザ：ブラウザ（WebKitベース）</p> | ブラウザ：ブラウザ（WebKitベース）</p> | ||
<br> | <br> | ||
'''「ブラウザ」の制限'''< | '''「ブラウザ」の制限''' | ||
<p> | |||
・プラグインに非対応→「Flash Player」は標準搭載（Android2.2以降）<br> | ・プラグインに非対応→「Flash Player」は標準搭載（Android2.2以降）<br> | ||
・ファイルのアップロードはできない（ダウンロードは可能） | ・ファイルのアップロードはできない（ダウンロードは可能） | ||
</p> | |||
<br> | |||
==基本的なマークアップ== | |||
</div> | </div> | ||
2011年9月1日 (木) 18:29時点における版
スマートフォンサイト案件が来たときのために、スマホサイト制作についてまとめておきます。
※このページは、たにぐちまこと著「iPhone+Androidスマートフォンサイト制作入門」から抜粋しております。
スマートフォンの特徴・仕様
まずはスマホのことを知っておきましょう。
■iPhone
解像度：320×480px（4は640×960だがブラウザでは320×480で表示する仕様になっている）
ブラウザ：Mobile Safari（WebKitベース）
「Mobile Safari」の制限
・プラグインに非対応→「Flash Player」が使えない、等
・文字コードの変更ができない→meta要素で文字コードを忘れず指定する
・ウィンドウの制御ができない→常に全画面
・ファイルのアップロード、ダウンロードもできない→アプリで対応
・ファイルサイズなどの制限→「Safari Web Content Guide」参照
■Android
解像度：320×480px～640×960px
ブラウザ：ブラウザ（WebKitベース）
「ブラウザ」の制限
・プラグインに非対応→「Flash Player」は標準搭載（Android2.2以降）
・ファイルのアップロードはできない（ダウンロードは可能）