今更ながら今週から絵文字について書きます。
モバイルサイトでは必ずと言っていいくらい絵文字が出てきます。
今日は基本中の基本、各キャリアの携帯サイトで絵文字を出力します。
1.DoCoMo
ドコモで絵文字を出す方法は３つあります。
(1)バイナリコードで入力する
(2)10進数のShift_JISコードを入れる
(3)Unicodeで入力する
1-(1)バイナリコードで入力する
バイナリエディタを使って16進数を入力する方法もありますが、一般的によく使 われるのがDoCoMoから出ているi絵文字を使って入力する方法です。
◎i絵文字
選択するだけで絵文字が入力できます。
1-(2)10進数のShift_JISコードを入れる
DoCoMoの絵文字表から10進数のコードを選んで入力します。
◎基本絵文字一覧
例えば太陽の場合は、63647なので、

と入れます。
しかし、この方法はiモードブラウザ2.0では対応していません。
iモードブラウザ2.0の端末でアクセスすると何も表示されません。
拡張絵文字にも対応している10進数のコードもありません。
そのため、DoCoMoではこの方法は推奨していません。
1-(3)Unicodeを入れる
次はUnicodeを使った方法です。
DoCoMoの絵文字表からUnicodeにあたるコードを選んで入力します。
例えば太陽の場合は、UnicodeはE63Eなので
&#E63E;
と入力します。
とても簡単なサンプルを作ってみます。
(emoji_i_sample.html)
<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//i-mode group (ja)//DTD XHTML i-XHTML(Locale/Ver.=ja/2.0) 1.0//EN" "i-xhtml_4ja_10.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=Shift_JIS" />
<meta http-equiv="Cache-Control" content="no-cache" />
</head>
<body>
絵文字テスト<br />
(1):
<br />
(2):驪
<br />
(3):
</body>
実際に携帯電話でアクセスしてみます。
iモードブラウザ2.0を使用している最新の携帯電話の場合、(2)の絵文字が抜け ていることが確認できます。
その他のFOMA対応の携帯電話は絵文字が表示できています。
iモードの絵文字入力は(1)か(3)で対応しましょう。
2.au
auの絵文字を出力する方法は３つあります。
(1)バイナリコードで入力する
(2)絵文字番号を使って入力する
(3)Unicodeで入力する
2-(1)バイナリーコードで入力する
まずは(1)からです。auの端末はiモードと絵文字の互換性があるため、i絵文字 を使って入力した絵文字も表示することができます。しかし、一部の絵文字で対 応していない絵文字があります。
2-(2)絵文字番号を使って入力する
auで推奨している方法です。imgタグに絵文字番号を入れて表示する方法です。
◎auの絵文字
こちらのサイトからEZweb絵文字一覧をダウンロードしておきます。
一覧から絵文字番号を調べます。
太陽は44なので、
<img localsrc="44">
と記述します。
HDMLで記述する場合は
<IMG ICON="44">
と記述します。
2-(3)unicodeで入力する方法
一覧からUnicodeにあたるコードを探します。
太陽はE488なので
&#E488;
と入力します。
では、簡単なサンプルを作ってみます。
(emoji_e_sample.html)
<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//OPENWAVE//DTD XHTML 1.0//EN" "http://www.openwave.com/DTD/xhtml-basic.dtd">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=Shift_JIS" />
<meta http-equiv="Cache-Control" content="no-cache" />
</head>
<body>
絵文字テスト<br />
(1):<h1></h1>
<br />
(2):<h1><img localsrc="44" /></h1><img localsrc="44" />
<br />
(3):<h1></h1>
</body>
auのWIN端末でアクセスしてみます。
(2)の絵文字の大きさが変わらないことがわかります。
絵文字番号を使った方法では、絵文字のサイズが変更できません。
キャリアでは推奨していますが、実際は(3)の方法で記述されることが多いです。
3.Softbank
Softbankで絵文字を表示する方法は２つあります。
(1)ウェブコードで入力する
(2)Unicodeで入力する
3-(1)ウェブコードで入力する
Softbankのサイトにある絵文字一覧から該当のウェブコードを探してコピー＆ ペーストします。
◎WEB＆NETWORK絵文字一覧（Softbank)
http://creation.mb.softbank.jp/web/web_pic_about.html例えば、太陽の場合、Softbankのサイトからウェブコードをコピーしてテキスト エディタに貼り付けると次のようなコードになります。
$Gj
3-(2)Unicodeで入力する
同じ絵文字一覧からUnicodeに当たる部分を探します。
例えば、太陽の場合E04Aなので、

と記述します。
では、簡単なサンプルです。
<!DOCTYPE html PUBLIC "-//J-PHONE//DTD XHTML Basic 1.0 Plus//EN" "xhtml-basic10-plus.dtd">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=Shift_JIS" />
<meta http-equiv="Cache-Control" content="no-cache" />
</head>
<body>
絵文字テスト<br />
(1):$Gj
<br />
(2):
</body>
Softbankの端末でアクセスしてみます。
太陽が表示されています。
今回は単純にそれぞれのキャリアで絵文字だけを表示させてみました。
次回はPHPを使って絵文字を出力させてみます。
今日はこれでおしまいです。
コメントする