「フォントとユニコード」の編集履歴（バックアップ）一覧はこちら
「フォントとユニコード」(2017/01/14 (土) 10:11:42) の最新版変更点
追加された行は緑色になります。
削除された行は赤色になります。
[[トップページ>コメントアートwiki トップページ]]
----
#blockquote(){コメントアートの解説で「00A0」や「2001」など
良くわからない文字の羅列を見たことはありませんか？
コメントを操るということ。
それはすなわち&bold(){文字を操る}ということ。
今後の解説においても文字・フォントに関する知識が少なからず必要となります。
ここでは、そんな文字・フォントに関する基礎的な知識の解説をさせていただきます。}
&bold(){&sizex(6){◎目次}}
#contents_line(sep=/)
----
*&bold(){&sizex(7){①ユニコード}}
コメントアートを製作する際には普段は使わないような記号・文字を使用することが多々あります。
&blankimg(unicode 1.png,width=610,height=457)
色々な文字の中から取捨選択をして使用するわけです。
でも、一つ一つの文字を説明しようとする場合、「花の文字」「星の文字」などといった言葉では
どの文字を指しているのか正確にはわかりません。
&blankimg(unicode 2.png,width=272,height=192)
この二つの星の文字をどう呼び分けますか？。
&bold(){&sizex(5){そこで、「ユニコード」の出番です。}}
コンピュータ上で使われる文字には「文字コード」と呼ばれる特定の符号、いわば番号が割り振られています。
文字コードは様々な規格があるのですが、
その中でも&bold(){&color(red){&sizex(6){「unicode(ユニコード)」}}}と呼ばれる文字コードは
全世界の文字を単一の文字コードで表されており、Microsoft Windows、Mac OS X、LinuxやJavaなど
多くのOS、プログラムで使用されています。
&blankimg(unicode 3.png,width=272,height=192)
ユニコードを使えば、二つの文字を番号で呼び分けることが出来ます。
番号は16進法で表されます。
**&sizex(6){①-①ユニコード番号の調べ方}
ユニコードの文字番号の調べ方は以下の方法があります。
・&bold(){&sizex(4){IMEパッドから調べる方法}}
&blankimg(unicode 4.png,width=733,height=311)
windowsOSの場合、
IMEパッドからユニコード番号を調べることができます。
文字一覧の表から番号がわかりますが、調べたい文字にマウスカーソルを動かせば、ポップアップが表示されます。
&bold(){(後の項目で触れる「[[空白文字]]」や「装飾文字」と呼ばれる普段使う機会がない文字もIMEパッドからなら簡単に入力できます。)}
・&bold(){&sizex(4){変換サイトを利用する方法}}
⇒ http://code.cside.com/3rdpage/jp/unicode/converter.html
(10進、16進文字コードin HTMLユニコード)
&blankimg(unicode 5.png,width=593,height=315)
上記のサイトで任意の文字のユニコード番号を調べることができます。
----
*&bold(){&sizex(7){②コメントの文字フォント}}
フォントとは、コンピュータ上に表示される文字の書体のことです。
その種類も実に多様なわけですが、ニコニコ動画のプレイヤー上に表示されるコメントのフォント(書体)は
いくつか種類が決まっています。
HTML5プレーヤーでは、以下のタイプに分けられます。
**&sizex(6){②-①defont}
&blankimg(font7 defont.jpg,width=512,height=288)
（※画像はWindows10での場合のもの）
&bold(){&sizex(4){フォント指定をしなかった際に表示されるフォント}}です。
その環境において最も自然なフォントをプレイヤー上で表示させるという特徴があり、
Windowsの場合はMSPゴシック、Macの場合はヒラギノ角ゴになります。
ニコニコのコメントにおいて最も基本的なフォントです。
**&sizex(6){②-②mincho}
&bold(){&sizex(5){・&color(green){「游明朝体」}}}
&blankimg(font8mincho.jpg,width=512,height=288)
（※画像はWindows10での場合のもの）
&bold(){&sizex(5){コマンド欄に&color(red){mincho}と入力した際Windows8.1以降では游明朝体に、Windows8以前ではSimsunという游明朝体に似たフォントに切り替わります。}}
**&sizex(6){②-③gothic}
&bold(){&sizex(5){・&color(green){「游ゴシック体」}}}
&blankimg(font⑨ gothic.jpg,width=512,height=288)
（※画像はWindows10での場合のもの）
&bold(){&sizex(5){コマンド欄に&color(red){gothic}と入力した際Windows8.1以降では游ゴシック体に、Windows8以前ではGulimという游ゴシック体に似たフォントに切り替わります。}}
----
*&bold(){&sizex(7){③フォントと文字幅}}
コメントの文字幅は表示されるフォントに依存します。
これはフォントの特徴がそのままコメント表示に反映されるためです。
・&bold(){&sizex(4){defontの場合}}
読みやすさを重視したフォント(プロポーショナル フォント)であるため、個々の文字の幅が異なります。
よって、コメントにおいても&bold(){&sizex(4){&color(red){それぞれの全角文字で幅が変わります。}}}
&blankimg(width1 - MS P ゴシック.png,width=408,height=288)
・&bold(){&sizex(4){その他のフォントの場合}}
MS Pゴシック以外のフォントは等幅フォントであるため、
&bold(){&sizex(4){&color(red){コメント上でも ほぼ全ての全角文字の幅が同じ}}}になります。
この幅を特に&bold(){&sizex(6){&color(orange){「漢字幅、全角幅」}}}と呼びます。
基準のコメント幅として扱われることが多いです。
&blankimg(width8 - mincho.jpg,width=350,height=190)&blankimg(width⑨ - gothic.jpg,width=350,height=190)
これらの文字幅の違いはコメントのリサイズ調整などに関係してきます。
フォントによるコメント表示の変化&bold(){(&sizex(6){&color(orange){「挙動」}}と呼ばれます)}を正確に把握しておくことが必要です。
----
&sizex(6){&bold(){next:}[[知識編Ⅱ【空白文字】>空白文字]]}
&bold(){prev:基礎編Ⅲ【視聴環境と製作環境について】}
[[トップページ>コメントアートwiki トップページ]]
[[トップページ>コメントアートwiki トップページ]]
----
#blockquote(){コメントアートの解説で「00A0」や「2001」など
良くわからない文字の羅列を見たことはありませんか？
コメントを操るということ。
それはすなわち&bold(){文字を操る}ということ。
今後の解説においても文字・フォントに関する知識が少なからず必要となります。
ここでは、そんな文字・フォントに関する基礎的な知識の解説をさせていただきます。}
&bold(){&sizex(6){◎目次}}
#contents_line(sep=/)
----
*&bold(){&sizex(7){①ユニコード}}
コメントアートを製作する際には普段は使わないような記号・文字を使用することが多々あります。
&blankimg(unicode 1.png,width=610,height=457)
色々な文字の中から取捨選択をして使用するわけです。
でも、一つ一つの文字を説明しようとする場合、「花の文字」「星の文字」などといった言葉では
どの文字を指しているのか正確にはわかりません。
&blankimg(unicode 2.png,width=272,height=192)
この二つの星の文字をどう呼び分けますか？。
&bold(){&sizex(5){そこで、「ユニコード」の出番です。}}
コンピュータ上で使われる文字には「文字コード」と呼ばれる特定の符号、いわば番号が割り振られています。
文字コードは様々な規格があるのですが、
その中でも&bold(){&color(red){&sizex(6){「unicode(ユニコード)」}}}と呼ばれる文字コードは
全世界の文字を単一の文字コードで表されており、Microsoft Windows、Mac OS X、LinuxやJavaなど
多くのOS、プログラムで使用されています。
&blankimg(unicode 3.png,width=272,height=192)
ユニコードを使えば、二つの文字を番号で呼び分けることが出来ます。
番号は16進法で表されます。
**&sizex(6){①-①ユニコード番号の調べ方}
ユニコードの文字番号の調べ方は以下の方法があります。
・&bold(){&sizex(4){IMEパッドから調べる方法}}
&blankimg(unicode 4.png,width=733,height=311)
windowsOSの場合、
IMEパッドからユニコード番号を調べることができます。
文字一覧の表から番号がわかりますが、調べたい文字にマウスカーソルを動かせば、ポップアップが表示されます。
&bold(){(後の項目で触れる「[[空白文字]]」や「装飾文字」と呼ばれる普段使う機会がない文字もIMEパッドからなら簡単に入力できます。)}
・&bold(){&sizex(4){変換サイトを利用する方法}}
⇒ http://code.cside.com/3rdpage/jp/unicode/converter.html
(10進、16進文字コードin HTMLユニコード)
&blankimg(unicode 5.png,width=593,height=315)
上記のサイトで任意の文字のユニコード番号を調べることができます。
----
*&bold(){&sizex(7){②コメントの文字フォント}}
フォントとは、コンピュータ上に表示される文字の書体のことです。
その種類も実に多様なわけですが、ニコニコ動画のプレイヤー上に表示されるコメントのフォント(書体)は
いくつか種類が決まっています。
HTML5プレーヤーでは、以下のタイプに分けられます。
**&sizex(6){②-①defont}
&blankimg(font7 defont.jpg,width=512,height=288)
（※画像はWindows10での場合のもの）
&bold(){&sizex(4){フォント指定をしなかった際に表示されるフォント}}です。
その環境において最も自然なフォントをプレイヤー上で表示させるという特徴があり、
Windowsの場合はMSPゴシック、Macの場合はヒラギノ角ゴになります。
ニコニコのコメントにおいて最も基本的なフォントです。
**&sizex(6){②-②mincho}
&bold(){&sizex(5){・&color(green){「游明朝体」}}}
&blankimg(font8mincho.jpg,width=512,height=288)
（※画像はWindows10での場合のもの）
&bold(){&sizex(5){コマンド欄に&color(red){mincho}と入力した際Windows8.1以降では游明朝体に、Windows8以前ではSimsunという游明朝体に似たフォントに切り替わります。}}
**&sizex(6){②-③gothic}
&bold(){&sizex(5){・&color(green){「游ゴシック体」}}}
&blankimg(font⑨ gothic.jpg,width=512,height=288)
（※画像はWindows10での場合のもの）
&bold(){&sizex(5){コマンド欄に&color(red){gothic}と入力した際Windows8.1以降では游ゴシック体に、Windows8以前ではGulimという游ゴシック体に似たフォントに切り替わります。}}
----
*&bold(){&sizex(7){③フォントと文字幅}}
コメントの文字幅は表示されるフォントに依存します。
これはフォントの特徴がそのままコメント表示に反映されるためです。
・&bold(){&sizex(4){defontの場合}}
読みやすさを重視したフォント(プロポーショナル フォント)であるため、個々の文字の幅が異なります。
よって、コメントにおいても&bold(){&sizex(4){&color(red){それぞれの全角文字で幅が変わります。}}}
&blankimg(width1 - MS P ゴシック.png,width=408,height=288)
・&bold(){&sizex(4){その他のフォントの場合}}
MS Pゴシック以外のフォントは等幅フォントであるため、
&bold(){&sizex(4){&color(red){コメント上でも ほぼ全ての全角文字の幅が同じ}}}になります。
この幅を特に&bold(){&sizex(6){&color(orange){「漢字幅、全角幅」}}}と呼びます。
基準のコメント幅として扱われることが多いです。
&blankimg(width8 - mincho.jpg,width=350,height=190)&blankimg(width⑨ - gothic.jpg,width=350,height=190)
これらの文字幅の違いはコメントのリサイズ調整などに関係してきます。
フォントによるコメント表示の変化&bold(){(&sizex(6){&color(orange){「挙動」}}と呼ばれます)}を正確に把握しておくことが必要です。
----
&sizex(6){&bold(){next:}[[知識編Ⅱ【空白文字】>空白文字]]}
&bold(){prev:[[基礎編Ⅳ【視聴環境と製作環境について】>視聴環境と製作環境について]]}
[[トップページ>コメントアートwiki トップページ]]
