「利用者:Fet-Fe」の版間の差分

2021年8月23日 (月) 00:42時点における版

Unicodeのノウハウ

結合文字

Unicodeの中には前の文字とくっ付いてあたかも合わせて一文字のように振る舞う結合文字がある。デーヴァナーガリーの母音字などが良い例である。(क + ा → का)

日本語では濁点や半濁点の結合文字が存在する。通常の濁点と半濁点はそれぞれ゛(U+309B)と゜(U+309C)であるが、結合文字ば(U+3099)と゚(U+309A)である。「が」などの濁音には専用の文字コードが存在するので、通常これらを用いることはない。しかし結合文字を用いることでUnicodeに登録されていない文字を表現することができる。例えば「ン゙」「墓゚」など。結合文字でない「墓゜」よりも見栄えが良い。

漢字構成記述文字

Unicodeに登録されていない漢字を登録されている字の組み合わせで表現するための文字。「⿰馬K」など。システム側で上手く合成するように要求するわけではないので見栄えは悪いが、⿱や⿵、再帰的な記述を用いて複雑な字形も表せる。

異体字セレクタ

UnicodeのCJK Unified Ideographsに載っていない書体の漢字でも、U+E0100〜U+E01EFの異体字セレクタ(IVS; Ideographic Variation Sequence)^[1]を用いて表現することができる。

例えば「唐」という漢字には縦棒が下に突き出ている異体字が存在する。これを表現するには「唐」の後ろにU+E0101を付ければ良い(唐󠄁)。見えない場合はおま環。

異体字セレクタセレクタで実験したり、GlyphWikiから検索したりすることで書体を見つけることができる。

アポストロフィ

キーボードから入力しやすいのは'(APOSTROPHE、U+0027)であるが、アポストロフィとしては他の文字が推奨されている^[2]。

英語やフランス語のアポストロフィとして推奨されるのは’(RIGHT SINGLE QUOTATION MARK、U+2019)である^[3]。これは‘’という引用符の右側のものと同じである。なので‘I’ll kill Takahiro Karasawa.’のように同じ文字で2つの役割となる。

一方でタヒチ語などでの声門閉鎖音の正書法やIPAの放出音、ウクライナ語での軟音化などを表す文字はʼ(MODIFIER LETTER APOSTROPHE、U+02BC)である^[4]。

記号としてのアポストロフィがU+2019、文字としてのアポストロフィがU+02BCであると捉えることもできる。

他にウズベク語やハワイ語で用いられるʻ(MODIFIER LETTER REVERSED COMMA、U+02BD)も存在する。

''や""は引用符として用いることも推奨されておらず、‘’や“”が推奨される。ソフトウェアによっては自動で置換される。

スペースとゼロ幅文字

通常のスペース(U+0020)以外にノーブレークスペース(U+00A0、HTMLでは )が存在する。このスペースが存在する部分では自動改行が行われない。

それとは別にnarrow no-break space(U+202F)も存在する。ノーブレークスペースと似たような特徴があるが、こちらは幅が狭く、モンゴル文字の接尾辞やパスパ文字の単語内スペースに用いられる。

単語結合子(U+2060)はゼロ幅であり見た目には全く影響を及ぼさないが、その部分での改行を防ぐ。逆にゼロ幅スペース(U+200B)は単語の切れ目を示し、改行可能な位置を明示する。

ゼロ幅非接合子(U+200C)は本来結合する文字を分離して表現するために用いられる。ペルシャ語のمی‌کشم(私は殺す)はこれ無しではمیکشمという表示になり、接頭辞میが分離しない。逆にデーヴァナーガリーの場合はヴィラーマでの合字化を防ぐ。संरक्षक(サンラクシャカ)をसंरक्‌षकという表示に変える。

HTMLとCSSのノウハウ

lang属性

言語を定義する^[5]。

例えば中国語で“唐泽贵洋。”と表示すると、Wikiのhtmlのlang設定が全体として"ja"(日本語)になっているため、簡体字だけ変なフォントで表示されることがよくある。そのような時にlang="zh"を設定すれば“唐泽贵洋。”と表示される。

ウルドゥー語のlang="ur"を指定すれば、環境によっては自動でナスタアリーク体のフォントを使用してくれる。

اردو

但し中国語、韓国語(ko)以外はあまり頼りにせず、自分でフォントを指定した方が良い（ユーザがそのフォントを持っていなければ意味は無いが）。特にGoogleホーモのChromeとかいうゴリブラは極一部の言語しかlangタグが効いているように見えないので、ちゃんと見た目を整えたいならフォント指定は必須。というかFirefoxを使う、それはできるよね。

言語コードについてはISO 639-1かISO 639-3あたりを用いるのが良い。

地域の指定もできる。ISO 3166などを用いる。例えば台湾の中国語を指定したい場合、ISO 3166-1で示されているTWを用いてlang="zh-TW"とする。

“唐澤貴洋。”

更には文字種の指定も可能。ペルシャ語の«تاکاهیرو کاراساوا قرآن را سوخت و به محمد توهین کرد.»をナスタアリーク体で表記したい場合、ISO 15924で定義されたナスタアリーク体の符号Aranを用いてlang="fa-Aran"とする。

تاکاهیرو کاراساوا قرآن را سوخت و به محمد توهین کرد.

シリア文字も環境が整っていればlang属性だけでフォントを切り替えられる。

lang="syc-Syre" → ܐܶܩܛܘ̇ܠ ܠܶܗ ܠܛܰܐܩܰܐܗܺܝܪܘ̇ ܩܰܐܪܰܐܣܰܐܘܰܐ܂

lang="syc-Syrj" → ܐܶܩܛܘ̇ܠ ܠܶܗ ܠܛܰܐܩܰܐܗܺܝܪܘ̇ ܩܰܐܪܰܐܣܰܐܘܰܐ܂

lang="syc-Syrn" → ܐܶܩܛܘ̇ܠ ܠܶܗ ܠܛܰܐܩܰܐܗܺܝܪܘ̇ ܩܰܐܪܰܐܣܰܐܘܰܐ܂

しかしこれもゴリホーモブラウザ対策であまり当てにはせず、自分でフォントを指定した方が安定する。

dir属性

書字方向を示す^[6]。

このwikiは日本語に対応しているので基本的に書字方向はltrとなっている。そのため普通にアラビア文字などrtl属性の文字を書くと、ピリオドがラテン文字のものと共通しているためにそれだけ右側に行ってしまう。

حرق تاكاهيرو كاراساوا القرآن وأهان محمدًا.

dir="rtl"を設定すれば正しい表示がなされる。

حرق تاكاهيرو كاراساوا القرآن وأهان محمدًا.

ルビ

HTMLのrubyタグで振り仮名を振ることができる^[7]。

<ruby>唐澤貴洋<rt>からさわたかひろ</rt></ruby>と記述することで下のような出力がなされる。

唐澤貴洋からさわたかひろ

更にrpタグを用いることで、rubyタグへの対応が無いブラウザでの表示をコントロールできる(でも今時そんなことをする必要はなさそう)。

例えば<ruby lang="ko">唐澤貴洋<rp>(</rp><rt>당택귀양</rt><rp>)</rp></ruby>の結果は下のようになる。

唐澤貴洋(당택귀양)

但しrubyタグに対応していなければ下のようになる。

唐澤貴洋(당택귀양)

縦書き

日本語の縦書きはCSSでwriting-mode: vertical-rl;^[8]を指定すれば良い。英数字を縦にするにはtext-orientation: upright;^[9]を指定する。

2021年に唐澤貴洋knifeで
メッタ刺しにして殺す。 2021年に唐澤貴洋knifeで
メッタ刺しにして殺す。

モンゴル語の場合はwriting-mode: vertical-lr;を指定する。 Safariだと文字の向きが正しくなくなるので、text-orientation: sideways;も指定する。

ᠮᠤᠩᠭᠤᠯ
ᠬᠡᠯᠡ

回鶻語やソグド語の縦書きにはwriting-mode: sideways-lr;を用いる。但しFirefox以外のブラウザには対応していないので、writing-mode: vertical-rl;をtransform: rotateZ(180deg);で180度回転させる方が汎用性が高い。

𐽂𐼰𐼸𐼰𐼳𐼷𐽀𐼷 𐼸𐼰𐽀𐼰𐼼𐼰𐼴𐼷
𐼾𐽂𐼶𐼴𐼰𐼷𐼺𐼸𐼰𐼻𐽘

脚註

[1] ttps://www.unicode.org/charts/PDF/UE0100.pdf

[2] ttp://www.unicode.org/charts/PDF/U0000.pdf

[3] ttps://www.unicode.org/charts/PDF/U2000.pdf

[4] ttps://www.unicode.org/charts/PDF/U02B0.pdf

[5] ttps://developer.mozilla.org/ja/docs/Web/HTML/Global_attributes/lang

[6] ttps://developer.mozilla.org/ja/docs/Web/HTML/Global_attributes/dir

[7] ttps://developer.mozilla.org/ja/docs/Web/HTML/Element/ruby

[8] ttps://developer.mozilla.org/ja/docs/Web/CSS/writing-mode

[9] ttps://developer.mozilla.org/ja/docs/Web/CSS/text-orientation

[1]

[2]

[3]

[4]

[5]

[6]

[7]

[8]

[9]

@@ 6行目: / 6行目: @@
 日本語では濁点や半濁点の結合文字が存在する。通常の濁点と半濁点はそれぞれ゛(U+309B)と゜(U+309C)であるが、結合文字は ゙(U+3099)と ゚(U+309A)である。
-「が」などの濁音には専用の文字が存在するので、通常これらを用いることはない。
+「が」などの濁音には専用の文字コードが存在するので、通常これらを用いることはない。
 しかし結合文字を用いることでUnicodeに登録されていない文字を表現することができる。例えば「ン゙」「[[東光院|墓゚]]」など。結合文字でない「墓゜」よりも見栄えが良い。
 === 漢字構成記述文字 ===
-Unicodeに登録されていない漢字を、登録されている字の組み合わせで表現するための文字。「[[誹謗中傷対策マーク|⿰馬K]]」など。
+Unicodeに登録されていない漢字を登録されている字の組み合わせで表現するための文字。「[[馬K|⿰馬K]]」など。
 システム側で上手く合成するように要求するわけではないので見栄えは悪いが、⿱や⿵、再帰的な記述を用いて複雑な字形も表せる。
@@ 16行目: / 16行目: @@
 UnicodeのCJK Unified Ideographsに載っていない書体の漢字でも、U+E0100〜U+E01EFの異体字セレクタ(IVS; Ideographic Variation Sequence)<ref>https://www.unicode.org/charts/PDF/UE0100.pdf</ref>を用いて表現することができる。
-例えば「唐」という漢字には、縦棒が下に突き出ている異体字が存在する。これを表現するには、「唐」の後ろにU+E0101を付ければ良い(唐󠄁)。見えない場合はおま環。
+例えば「唐」という漢字には縦棒が下に突き出ている異体字が存在する。これを表現するには「唐」の後ろにU+E0101を付ければ良い(唐󠄁)。見えない場合はおま環。
 [https://747.github.io/vsselector/ 異体字セレクタセレクタ]で実験したり、[https://glyphwiki.org/wiki/u5510-ue0101 GlyphWiki]から検索したりすることで書体を見つけることができる。
@@ 53行目: / 53行目: @@
 例えば中国語で“唐泽贵洋。”と表示すると、Wikiのhtmlのlang設定が全体として"ja"(日本語)になっているため、簡体字だけ変なフォントで表示されることがよくある。
-そのような時にlang="zh"を設定すれば、<span lang="zh">“唐泽贵洋。”</span>と表示される。
+そのような時にlang="zh"を設定すれば<span lang="zh">“唐泽贵洋。”</span>と表示される。
 ウルドゥー語のlang="ur"を指定すれば、環境によっては自動でナスタアリーク体のフォントを使用してくれる。
@@ 62行目: / 62行目: @@
 特にGoogleホーモのChromeとかいうゴリブラは極一部の言語しかlangタグが効いているように見えないので、ちゃんと見た目を整えたいならフォント指定は必須。
 というかFirefoxを使う、それはできるよね。
 言語コードについてはISO 639-1かISO 639-3あたりを用いるのが良い。
@@ 68行目: / 67行目: @@
 地域の指定もできる。ISO 3166などを用いる。
-例えば台湾の中国語を指定したい場合、ISO 3166-1で示されているTWを用いて、lang="zh-TW"とする。
+例えば台湾の中国語を指定したい場合、ISO 3166-1で示されているTWを用いてlang="zh-TW"とする。
 : <span lang="zh-TW">“唐澤貴洋。”</span>
@@ 74行目: / 73行目: @@
 更には文字種の指定も可能。
-ペルシャ語の<span lang="fa" dir="rtl">«تاکاهیرو کاراساوا قرآن را سوخت و به محمد توهین کرد.»</span>をナスタアリーク体で表記したい場合、ISO 15924で定義されたナスタアリーク体の符号Aranを用いて、lang="fa-Aran"とする。
+ペルシャ語の<span lang="fa" dir="rtl">«تاکاهیرو کاراساوا قرآن را سوخت و به محمد توهین کرد.»</span>をナスタアリーク体で表記したい場合、ISO 15924で定義されたナスタアリーク体の符号Aranを用いてlang="fa-Aran"とする。
 : <span lang="fa-Aran" dir="rtl">تاکاهیرو کاراساوا قرآن را سوخت و به محمد توهین کرد.</span>
@@ 94行目: / 93行目: @@
 : <span lang="ar">حرق تاكاهيرو كاراساوا القرآن وأهان محمدًا.</span>
-dir="rtl"を設定すれば、正しい表示がなされる。
+dir="rtl"を設定すれば正しい表示がなされる。
 : <span lang="ar" dir=rtl>حرق تاكاهيرو كاراساوا القرآن وأهان محمدًا.</span>
+=== ルビ ===
+HTMLのrubyタグで振り仮名を振ることができる<ref>https://developer.mozilla.org/ja/docs/Web/HTML/Element/ruby</ref>。
+&lt;ruby&gt;唐澤貴洋&lt;rt&gt;からさわたかひろ&lt;/rt&gt;&lt;/ruby&gt;と記述することで下のような出力がなされる。
+<ruby>唐澤貴洋<rt>からさわたかひろ</rt></ruby>
+更にrpタグを用いることで、rubyタグへの対応が無いブラウザでの表示をコントロールできる(でも今時そんなことをする必要はなさそう)。
+例えば&lt;ruby lang="ko"&gt;唐澤貴洋&lt;rp&gt;(&lt;/rp&gt;&lt;rt&gt;당택귀양&lt;/rt&gt;&lt;rp&gt;)&lt;/rp&gt;&lt;/ruby&gt;の結果は下のようになる。
+<ruby lang="ko">唐澤貴洋<rp>(</rp><rt>당택귀양</rt><rp>)</rp></ruby>
+但しrubyタグに対応していなければ下のようになる。
+<span lang="ko">唐澤貴洋(당택귀양)</span>
+=== 縦書き ===
+日本語の縦書きはCSSでwriting-mode: vertical-rl;<ref>https://developer.mozilla.org/ja/docs/Web/CSS/writing-mode</ref>を指定すれば良い。
+英数字を縦にするにはtext-orientation: upright;<ref>https://developer.mozilla.org/ja/docs/Web/CSS/text-orientation</ref>を指定する。
+<span style="writing-mode: vertical-rl;">2021年に唐澤貴洋knifeで<br>メッタ刺しにして殺す。</span>
+<span style="writing-mode: vertical-rl; text-orientation: upright;">2021年に唐澤貴洋knifeで<br>メッタ刺しにして殺す。</span>
+モンゴル語の場合はwriting-mode: vertical-lr;を指定する。
+Safariだと文字の向きが正しくなくなるので、text-orientation: sideways;も指定する。
+<span lang="mn" style="writing-mode: vertical-lr; text-orientation: sideways;">ᠮᠤᠩᠭᠤᠯ<br>ᠬᠡᠯᠡ</span>
+回鶻語やソグド語の縦書きにはwriting-mode: sideways-lr;を用いる。
+但しFirefox以外のブラウザには対応していないので、writing-mode: vertical-rl;をtransform: rotateZ(180deg);で180度回転させる方が汎用性が高い。
+<span lang="sog" dir="rtl "style="writing-mode: vertical-rl; text-orientation: sideways; transform: rotateZ(180deg);">𐽂𐼰𐼸𐼰𐼳𐼷𐽀𐼷 𐼸𐼰𐽀𐼰𐼼𐼰𐼴𐼷<br>𐼾𐽂𐼶𐼴𐼰𐼷𐼺𐼸𐼰𐼻𐽘</span>
 == 脚註 ==
 <references />