携帯サイトの作成支援サイト。携帯サイトの作り方が分からなくても、手順に沿っていくことで自然に覚える。覚えたら携帯サイト作りが楽しくなる。
» トップ > 画像について

画像について

画像を表示:<img>

画像を表示させるためのタグは下記のように記述し、

<img src="http://www.*****.com/img.gif">

src属性で指定したパスの画像ファイルを表示します。

画像ファイルは、GIF形式(*.gif)・JPEG形式(.jpg)・PNG形式(*.png)が一般的によく使用されます。

<img src="http://www.*****.com/img.gif"> --- 指定のURLの「img.gif」を表示
<img src="img.gif"> --- 同フォルダの「img.gif」を表示
<img src="abc/img.gif"> --- 「abc」というフォルダの中の「img.gif」を表示
<img src="../img.gif"> --- ひとつ上のフォルダの中の「img.gif」を表示
<img src="../abc/xyz/img.gif"> --- ひとつ上のフォルダの中の「abc」フォルダの中の「xyz」フォルダの中の「img.gif」を表示

基本タグのリンク:<a>と同じく絶対パス、または相対パスの記述をします。

携帯サイトの画像の対応

携帯サイトでの画像表示には、いくつか注意事項があります。

まずは、キャリアや機種によって、表示できる画像の形式が異なります。下記の表は一般的な対応表になりますが、古い機種や一部機種によって、画像が表示できたりできなかったりする場合があるので注意してください。

キャリア 対応画像形式
DoCoMo JPEG/GIF
au JPEG/GIF/PNG
vodafone JPEG/PNG

基本的に画像を使用しなければ、特に気にする必要はありませんが、タイトル画像などで使用したいという場合には、GIF画像をおすすめします。

JPEG画像ですと、最新機種であれば、ほぼ3キャリア全てに対応していますが、イラストや文字などの画像はJPEGに向いていないという欠点があります(ふちがにじんでしまう)。イラストや文字などの画像は、GIF形式かPNG形式の方がキレイに表示できます。

逆に風景写真などの実写であればJPEG形式の保存は適しています。

iモードを主流として考える場合であれば、GIF形式をベースにしても構わないと思います。対応していない機種では、画像が表示されなくなるだけなので、その部分を予めテキスト文字などで画像が消えてしまっても支障がないよう工夫することができると思います。

全てのキャリア・機種に完全に対応させようと思った場合は、プログラムによる画像形式の記述振り分けが必要になります。


このサイトをお気に入りに登録する