日本語もイタリック体に出来るようにして欲しい #267
Replies: 7 comments 23 replies
-
|
HTML5 で |
Beta Was this translation helpful? Give feedback.
-
|
@lamrongol @shiracamus |
Beta Was this translation helpful? Give feedback.
-
|
@lamrongol lamrongolさんの環境では、Qiitaサイトがメイリオで表示されているようですが、 emは打ち消されていないのですが、上記の理由によりイタリック表示になりません。 ご不便とご迷惑をおかけして申し訳ありません。 |
Beta Was this translation helpful? Give feedback.
-
|
stackoverflowで日本語のみイタリック体にできないか（正確には日本語しか定義されてないフォントはないか）質問したところ以下のように二つ回答と一つのページが寄せられたのですが、これで対応できるでしょうか？ |
Beta Was this translation helpful? Give feedback.
-
|
@lamrongol |
Beta Was this translation helpful? Give feedback.
-
|
lamrongolさんと同様、Qiitaで日本語が斜体表示されず不便しています。 メイリオには斜体が無いというより、斜体の領域に正体（せいたい）の字形がわざわざ登録されていると聞き及びます。 WindowsユーザーかつChromeユーザーとしては、斜体の利用を想定したサイトでメイリオなんて使わないでくれ～！！！ 本当に～！！！！！ と叫びたいのですが…。 ただ、少しググりかじった限りですがこういう解決法もあるようです。→ https://qiita.com/IrakaT/items/7e5623357ba2b8b560de @font-face {
font-family: "Meiryo Italic";
src: local('Meiryo'), local('メイリオ');
}
.it-MdContent em {
font: italic 100% "Meiryo Italic", sans-serif;
}※ 元記事のままフォントファミリー名を 参考になれば幸いです！ |
Beta Was this translation helpful? Give feedback.
-
|
その後、首尾はどうですか？ Markdown記法チートシートがどう修正されているのかと思えば、斜体になるべき部分を "italic type" と英字に置き換えているだけで、メイリオに対しての注意喚起は皆無…。 厳しい事を言えば、斜体のあるサイトでメイリオを強制しているQiita側の落ち度でしかないこの問題に未だ何の解決も見せず、Markdown記法のヘルプにあたる記事までもがこのように誤魔化すだけで既知の問題があることすら明示せず、対応策といえばメイリオの斜体問題というピンポイントなリテラシーをユーザー個々人にどこかから自力で仕入れて貰うぐらいしか無い事にただ任せて何年も放置しているというこの状況は、ユーザーとして快く受け入れられる物ではありません。 とりあえず、私の叫びを再掲します。 |
Beta Was this translation helpful? Give feedback.
-
|
個人的にはメイリオ強制はやめて 最近はこのような改善もありましたし。 https://developer.chrome.com/blog/better-text-rendering-in-chromium-based-browsers-on-windows?hl=ja
em {
font-style: normal;
text-emphasis: circle; /* またはdot */
} |
Beta Was this translation helpful? Give feedback.
-
|
@Phroneris @tats-u 以前お知らせいただいたフォントの問題についてですが、メイリオを含め指定を見直す対応を進めていきたいと思います。 圏点に関するご提案もありがとうございます！ ご不便、ご迷惑をおかけして大変申し訳ありませんが、対応まで今しばらくお待ちいただけますと幸いです 🙏 |
Beta Was this translation helpful? Give feedback.
-
|
ご検討ありがとうございます。emを圏点に変えるだけの他にも、emで普通の太字、strongで色文字（典型的には赤、下品なら他の色）や蛍光マーカー風やただの色線を太字に加えて付与、両方指定してstrong単体と変わらないなら圏点やマーカー追加で付与 という案もあります。いくつか選択できるようにできるのが理想ではあります。 |
Beta Was this translation helpful? Give feedback.
-
|
前向きにご対応頂けそうでありがとうございます。宜しくお願い致します。 少なくともMarkdownチートシートの斜体記法の箇所には明示すべきではないでしょうか？ |
Beta Was this translation helpful? Give feedback.
-
|
@Phroneris いただいたご提案に基づき、まずは「Markdown記法 チートシート」に注意書きを追記いたしました。 根本的なフォント指定の見直しにつきましても、引き続き対応を進めてまいります。 |
Beta Was this translation helpful? Give feedback.
-
|
ちなみに 前後に半角スペースまたは改行を入れてください→前後に半角スペースまたは改行を入れない場合、反応しない場合があります or 反応しない場合は、前後に半角スペースまたは改行を入れてください |
Beta Was this translation helpful? Give feedback.
-
今すぐ圏点を表現したい人へ
おそらく圏点ってこんな感じですか？ おそらく<ruby>圏点<rt>●●</rt></ruby>ってこんな感じですか？今すぐ日本語で斜体表現したい人へMathJax を使えば可能です。残念ながら github では対応していない様子。 日本語で$\textit{斜体}$ってこんな感じですか？インラインではなくブロックで良いのなら PlantUML を使えば可能です。詳しくは下記の記事を参照下さい。 https://qiita.com/TETSURO1999/items/bd6252bab2f24bb38d0e 日本語がイタリック体にならない理由を整理するまず，Qiita は記事の主要フォントとしてメイリオを指定しています。 Windows ではメイリオにイタリック体とボールド体のスタイルを用意していますが，標準スタイルと全く同じ字形なのが諸悪の根源です。もしも，これらのスタイルが存在しなければ Windows が標準スタイルをベースにして斜体や太字を作ってくれるからです。 Mozilla Firefox は既定フォントとしてメイリオを指定しているせいか，アプリケーションレベルでの工夫によりメイリオでの斜体を実現しています。しかし，最大派閥の Chrome 系は既定フォントを自社の Noto 系に切り替えているせいか，このような工夫は特に行っていません。このためメイリオのイタリック体を指定しても標準スタイルと字形が変わりません。 Qiita 運営への提言（遅きに失した感はありますが）Qiita の記事内で使われているフォントですが，CSS 設定を見てみると
このうち Windows では Segoe UI と Meiryo が使われることになりますが，いずれも幻の Windows Vista で採用されたフォントです。Windows 11 時代の現在においては Noto Sans JP 等のより優れたフォントが開発されており，それらを直接指定しても良いと思いますが，コードブロックのほうは単に monospace とのみ指定されており，具体的なフォント選択はブラウザ任せとなっていることから，本文のフォントも同様に sans-serif として具体的なフォント選択はブラウザに委ねても良いように思います。 ちなみに編集画面の行番号では Consolas を指定しており，0とOの区別がし易く個人的には好みなのですが，日本語とのマッチングが難しいのでコードブロックに使わなかったのではないかと推察しています。 以下，Windows における主要ブラウザの既定フォントを示します。
既定フォントにすれば Chrome 系は問題なく日本語でも斜体を使えるようになり，もともと Firefox はメイリオでも斜体を実現できていたので問題ありません。 |
Beta Was this translation helpful? Give feedback.
-
|
rubyでやるのは読み方を●●で上書きしているようなものです。日本語でイタリック使って強調はナンセンスだからもっと適切な方法で置き換えましょうよ、というだけです。 https://developer.mozilla.org/ja/docs/Web/HTML/Reference/Elements/em |
Beta Was this translation helpful? Give feedback.
-
|
個人的には斜体での強調がそんなにナンセンスだとは思いませんね…。 圏点での強調については、等幅ベースの日本語文字だけなら等間隔で配置されるので確かに馴染みやすいですが、それでもフォントによっては「っ」1とか半角カタカナとか必ずしも等幅じゃない文字もありますし、ましてや英数字なんかプロポーショナル大前提なのでさすがに不適じゃないでしょうか。 それよりはマーカー下線の方が文字種を選ばず直感的にできそうですね。 Footnotes
|
Beta Was this translation helpful? Give feedback.
-
|
@lamrongol @shiracamus @Phroneris @tats-u @TETSURO1999
Meiryoの指定は、Noto Sans JP,BIZ UDGothic が当たらなかった場合も考慮して残しております 🙏 今後とも Qiita をよろしくお願いいたします 🙏 |
Beta Was this translation helpful? Give feedback.
-
|
@katouriko で、早速なんですが私からも1つ意見を…。 まず現状を確認すると、現在のフォント指定は でも、Notoフォントの存在意義ってあくまで多言語想定の文書におけるスタイルの統一と「豆腐」の回避のためのフォールバックじゃないでしょうか？ そういう訳で、日本企業がほぼ日本語話者のためだけに運営しているQiitaにおいては、日本語文字のフォントの優先順位はBIZ UDゴシックをNoto Sans JPより優先するように変更する方が、前のメイリオの見やすさからより自然に受け入れられる変更になると思います。 まぁ、もっと言うと「っ」とかがプロポーショナルになるBIZ UDPゴシックが指定されればというのが個人的に最大の欲を出した意見ですが、前のメイリオは「っ」とかも等幅だったので、日本語文字は基本的に等幅で行くというのがQiitaの流儀なんだなという事で私はそこは普通に受け入れられます。 |
Beta Was this translation helpful? Give feedback.
-
|
外国語版Windowsだと游ゴシック系しか入っていませんが、扱いが難しいので無理に入れなくても構いません。 |
Beta Was this translation helpful? Give feedback.
-
|
@Phroneris @tats-u 「Noto Sans JP」と「BIZ UDGothic」のどちらを優先するかについては、デザインの好みや視認性の感じ方など、個々人で意見が分かれる部分かと思います 🙏 そのため、一旦現状のまま様子を見させていただき、もし今後「Noto Sans が見づらい（視認性に課題がある）」といったご意見が多く寄せられるようでしたら、その時点で改めて検討いたします。 |
Beta Was this translation helpful? Give feedback.
-
|
BIZ UD（やメイリオ）の弱点として、Firefox以外で見たときに「（）」・「【】」などの並びの無駄な空白を削る処理が働かない点があります。（YakuHanJPsの需要を下げられます） |
Beta Was this translation helpful? Give feedback.
-
|
#1035 の投稿から誘導されたので来ました。 Linuxユーザー視点でいうと、BIZ UDフォントよりNoto CJKフォントのほうが読みやすいです。 と、自分の意見を述べましたが、争いは避けたいので折衷案を考えてみました。この並びでどうでしょうか? Noto CJKフォントはフォント形式によって微妙に名前が違います。これを利用してDebian/Ubuntuその他Linuxで使われている Windowsでは、フォールバックするので （個人的には、OpenTypeオプションできれいな文字組みができるNoto CJKフォントを優先するといいとは思いますが、好みの問題になると思います。BIZ UDフォントは形式こそOpenTypeフォントでも実質TrueTypeフォントですからオプションが使えないんですよね…） |
Beta Was this translation helpful? Give feedback.
-
|
便乗ですみません。 Noto Sans JP の優先度が上がった後の 2025/11/16 現在のところ、ダークモード時に限り本文の 個人的に細すぎて不自然に感じます。何か意図があってのことかもしれませんが、検討のほどお願い致します 🙇
あまり参考にならないと思いますが、スクショを載せておきます。
|
Beta Was this translation helpful? Give feedback.
-
|
@honey32
ただ、今回いただいたように「細すぎて不自然」と感じるのとても理解できます。 もし良いアイデアがあれば、ご意見いただけますと幸いです。 |
Beta Was this translation helpful? Give feedback.
-
|
基本的には、優先順位の問題なので、
一つの解決方法の案として、不透明度を変えて強弱をつける（ついでに、見出しも strong と同じ「強い」色にする）、という方法はありかもしれません。
参考までに、僕の個人サイトでは、思い切って strong と見出しの文字を強調色（ダークモードなら金色、ライトモードなら緑色）に設定しています。 UGC であり、かつリンク文字色がブランドカラーで上書きされている Qiita には適用できないと思うので、不透明度で差をつけるくらいでちょうど良い塩梅なのではないでしょうか？ https://www.bearwapps.com/posts/keigo-goissho-shimasu
|
Beta Was this translation helpful? Give feedback.
-
|
そもそも、Noto自体が太字と通常のメリハリがついている方です。 |
Beta Was this translation helpful? Give feedback.
-
|
通常の文字に対して まぁ色んな手段を考慮すればそもそも二者択一ではないのが当然ですけど、しかしあまりクセのある強調をするとMarkdownの素直な変換を期待する人間の感情面に差し障るのが本当に難しいですね…。 |
Beta Was this translation helpful? Give feedback.
-
普段の文字色は真っ白（#fff）・真っ黒（#000）ではないので
まさしくその通りです。どうしてもというのなら見出しと太字以外のフォントとしてNotoより細い游ゴシック Mediumが候補に上がります |
Beta Was this translation helpful? Give feedback.
Uh oh!
There was an error while loading. Please reload this page.
-
Markdown記法 チートシート - Qiitaには「_ か * で囲むとHTMLのemタグになります。Qiitaでは イタリック体 になります」とありますが、半角英数はイタリック体になりますが日本語はイタリック体になりません（例：オブジェクト指向とは結局何なのか あるいはプログラミングで気をつけるべきたった一つのこと - Qiitaの「（即物的に言えば）」の部分）。
なおFirefoxではイタリック体になるのですが、Chromeではイタリック体になりません。
Beta Was this translation helpful? Give feedback.
All reactions