「ケータイHTML」の版間の差分
ナビゲーションに移動
検索に移動
編集の要約なし |
編集の要約なし |
||
| 1行目: | 1行目: | ||
携帯電話向けサイトのHTMLコーディングについて | 携帯電話向けサイトのHTMLコーディングについて | ||
<div id="manual"> | <div id="manual"> | ||
<div class="section"> | |||
===HTML=== | |||
それぞれの携帯端末向けに使用する言語は以下の通り | |||
<table class="rendering-mode" border="0" cellpadding="0" cellspacing="0"> | |||
<tr> | |||
<th>キャリア</th> | |||
<th>言語</th> | |||
</tr> | |||
<tr> | |||
<td>iモード</td> | |||
<td>iモード対応HTML、iモード対応XHTML</td> | |||
</tr> | |||
<tr> | |||
<td>EZweb</td> | |||
<td>XHTML Basic、HDML、WML</td> | |||
</tr> | |||
<tr> | |||
<td>ボーダフォンライブ！</td> | |||
<td>ボーダフォンライブ！向けHTML、MML、ボーダフォンライブ！向けXHTML</td> | |||
</tr> | |||
</table> | |||
共通している言語はXHMLだが、iモードとボーダフォンライブ！は対応している機種が | |||
少ないので、汎用サイトを作成するには向いていない。<br> | |||
iモード対応HTMLとボーダフォンライブ！向けHTMLは、タグの記述方法が似ているので | |||
汎用サイトを作成するには向いている。<br> | |||
また、EZwebは、HTMLで記述されたコンテンツをEZサーバでHDMLに変換することで表示できる。したがって、独自の属性を取った、プレーンなHTMLで記述すれば、汎用サイトが作成できる。 | |||
</div> | |||
<div class="section"> | <div class="section"> | ||
===画像形式=== | ===画像形式=== | ||
1つの形式の画像で全てのキャリアのすべての世代の端末に対応させるのは不可能<br> | |||
したがって、画像を使用したければ各キャリア別に画像を作成する必要がある。 | |||
<dl> | <dl> | ||
<dt>iモード</dt> | <dt>iモード</dt> | ||
| 89行目: | 118行目: | ||
<dd>JPEGを使ったアニメーション画像は、C3、C4、P、W型で使用できる。</dd> | <dd>JPEGを使ったアニメーション画像は、C3、C4、P、W型で使用できる。</dd> | ||
<dd>P、W型などではPNG形式を拡張したMNG(Multiple-image Network Graphics）形式でアニメーションが表示できる。</dd> | <dd>P、W型などではPNG形式を拡張したMNG(Multiple-image Network Graphics）形式でアニメーションが表示できる。</dd> | ||
<dd>クーポンなどの画像を再配布禁止にする場合には、jpeg→jpz、png→pnzにする。 | |||
</dl> | </dl> | ||
<table class="rendering-mode" border="0" cellpadding="0" cellspacing="0"> | <table class="rendering-mode" border="0" cellpadding="0" cellspacing="0"> | ||
<tr> | <tr> | ||
<th rowspan="2"></th> | <th rowspan="2" colspan="2"></th> | ||
<th colspan="3">C</th> | <th colspan="3">C</th> | ||
<th colspan="2">P</th> | <th colspan="2">P</th> | ||
| 172行目: | 202行目: | ||
<dd>[https://addons.mozilla.org/firefox/59/ User Agent Switcher]</dd> | <dd>[https://addons.mozilla.org/firefox/59/ User Agent Switcher]</dd> | ||
<dd>UserAgentを自由に変えて携帯電話向けサイトにアクセス（IPで制限かけている場合は意味なし）</dd> | <dd>UserAgentを自由に変えて携帯電話向けサイトにアクセス（IPで制限かけている場合は意味なし）</dd> | ||
</dl> | |||
====携帯端末向けサイト作成支援サービス==== | |||
<dl> | |||
<dt>実機テスト</dt> | |||
<dd>[http://mysta.jp/ 実機テスト|ケータイ・マイスタ]</dd> | |||
<dt>携帯端末情報提供</dt> | |||
<dd>[http://www.mobyrent.jp/ MOBYRENT（モビレント）] | |||
</dl> | </dl> | ||
</div> | </div> | ||
</div> | </div> | ||
2007年2月28日 (水) 12:17時点における版
携帯電話向けサイトのHTMLコーディングについて
HTML
それぞれの携帯端末向けに使用する言語は以下の通り
| キャリア | 言語 |
|---|---|
| iモード | iモード対応HTML、iモード対応XHTML |
| EZweb | XHTML Basic、HDML、WML |
| ボーダフォンライブ！ | ボーダフォンライブ！向けHTML、MML、ボーダフォンライブ！向けXHTML |
共通している言語はXHMLだが、iモードとボーダフォンライブ！は対応している機種が
少ないので、汎用サイトを作成するには向いていない。
iモード対応HTMLとボーダフォンライブ！向けHTMLは、タグの記述方法が似ているので
汎用サイトを作成するには向いている。
また、EZwebは、HTMLで記述されたコンテンツをEZサーバでHDMLに変換することで表示できる。したがって、独自の属性を取った、プレーンなHTMLで記述すれば、汎用サイトが作成できる。
画像形式
1つの形式の画像で全てのキャリアのすべての世代の端末に対応させるのは不可能
したがって、画像を使用したければ各キャリア別に画像を作成する必要がある。
- iモード
- すべての世代のiモード端末に対応しているのはノンインターレースGIFのみ
- 画像データのファイルサイズはまちまちで、501iシリーズは最大5KB、902iシリーズは最大100KB
|
iモード対応HTMLバージョン |
||||||
|---|---|---|---|---|---|---|
| 1.0 | 2.0 | 3.0 | 4.0 | 5.0 | 6.0 | |
| ノンインターレースGIF | ○ | ○ | ○ | ○ | ○ | ○ |
| インターレースGIF | △※1 | ○ | ○ | ○ | ○ | ○ |
| 透過GIF | △※1 | △※2 | ○ | ○ | ○ | ○ |
| アニメーションGIF | △※1 | ○ | ○ | ○ | ○ | ○ |
| JPEG | × | × | △※3 | ○ | ○ | ○ |
○…対応
×…非対応
※1…ノンインターレースGIFとして表示
※2…カラー対応の機種のみ対応
※3…JPEG対応機のみ（N503i、N503iS、P503iS、N211i、R211i、SO211i、SH251i、SH251iS、R692i、FOMA2001、FOMA2002、FOMA2101V）
- EZweb
- ほとんどの機種で表示可能なのはPNG形式。近年の機種であればGIF、JPEG形式にも対応
- GIF形式はインターレース、ノンインターレース、透過、アニメーションGIFに対応
- JPEGは256色に対応していて257色以上の画像データは自動的に256色に減色
- モノクロ2階調のビットマップ形式も利用可。カラーのビットマップはEZサーバ上でPNG形式に変換される
- 画像データの容量は最大9KB
- SoftBank
- PNG形式が使用可。JPEG形式はC2型は非対応。それ以外は表示可。
- GIF形式はボーダフォンライブ！向けXHTMLに対応している3GC型で表示できる。
- アニメーション画像は、PNG形式のファイルをimgタグのmotion属性を使って表現できる。対応している機種は3GC型を除くすべての機種。
- JPEGを使ったアニメーション画像は、C3、C4、P、W型で使用できる。
- P、W型などではPNG形式を拡張したMNG(Multiple-image Network Graphics）形式でアニメーションが表示できる。
- クーポンなどの画像を再配布禁止にする場合には、jpeg→jpz、png→pnzにする。
| C | P | W | 3GC | |||||
|---|---|---|---|---|---|---|---|---|
| C2 | C3 | C4 | P4、P6 | P6、P8 | ||||
| 画像 | PNG | ○ | ○ | ○ | ○ | ○ | ○ | ○ |
| JPEG | × | ○ | ○ | ○ | ○ | ○ | ○ | |
| MNG | × | × | × | ○ | ○ | ○ | × | |
| GIF | × | × | × | × | × | × | △ | |
各種資料
携帯キャリア 公式ガイド
- NTT DoCoMo
- 作ろうiモードコンテンツ
- au
- EZ Factory
- SoftBank
- SoftBank Developers Support Site
各端末向けエミュレータ
- NTT DoCoMo
- iモードHTMLシミュレータI(900i以前向け）
- iモードHTMLシミュレータII(901i以降向け)
- EZ web
- Openwave® SDK 6.2K
- SoftBank
- ウェブコンテンツヴューア
- Firefox向け拡張機能
- User Agent Switcher
- UserAgentを自由に変えて携帯電話向けサイトにアクセス（IPで制限かけている場合は意味なし）
携帯端末向けサイト作成支援サービス
- 実機テスト
- 実機テスト|ケータイ・マイスタ
- 携帯端末情報提供
- MOBYRENT（モビレント）