ローカルでwebフォントが表示されない…

問題

サブセットフォントメーカー＋WOFFコンバーターでフリーフォントをwebフォント化しました。
が、ローカルで適用されません。
（デベロッパツールでは、指定されているものの、Renderedがヒラギノになってしまう）

３週間程前に、同じように↑の組み合わせでwebフォント化したものは今もちゃんと反映されていて、header指定をh1に変えたりしてもその通りに表示されます。

というか、teratailのこの方と全く同じことになっています。

試したこと

何か不具合かなと、ソフトをAppCleaner（完全に削除するツール）で一旦完全削除→インストールし直してみたり、macを再起動したり、違うフォント何種類かでもやってみましたがだめでした。

現状

一応コードを貼ります…

HTML
1<!DOCTYPE html>
2<html lang="ja">
3 <head>
4  <meta charset="UTF-8">
5  <meta http-equiv="X-UA-Compatible" content="IE=edge">
6  <meta name="viewport" content="width=device-width,initial-scale=1">
7  <meta name="description" content="***">
8  <title>sacun</title>
9  <link rel="icon" href="favicon.ico">
10  <link rel="stylesheet" href="css/styles.css">
11 </head>
12 <body>
13   <header>
14     <nav>
15       <ul>
16         <li class="current">
17           <a href="index.html">
18             A
19           </a>
20         </li>
21         <li>
22           <a href="">
23             B
24           </a>
25         </li>
26         <li>
27           <a href="">
28             C
29           </a>
30         </li>
31         <li>
32           <a href="">
33             D
34           </a>
35         </li>
36         <li>
37           <a href="">
38             E
39           </a>
40         </li>
41       </ul>
42     </nav>
43   </header>
44
45 <section>
46
47  <h1>あいう@bcd0123</h1>
48  <p></p>
49 </body>
50
51 <footer>
52   <p>***</p>
53 </footer>
54 </body>
55</html>

CSS
1@font-face {
2  font-family: 'ChicagoBit';
3  src: url(../fonts/Chicago/'ChicagoBit.woff2') format('woff2'),
4       url(../fonts/Chicago/'ChicagoBit.woff') format('woff'),
5       url(../fonts/Chicago/'ChicagoBit.eot') format('eot'),
6       url(../fonts/Chicago/'ChicagoBit.ttf') format('truetype');
7}
8
9header,footer {
10	font-family: 'ChicagoBit';
11}
12
13//↑これはちゃんと反映される（3週間程前にwebフォント化したやつ）
14
15@font-face {
16  font-family: 'Konatsu';
17  src: url(../fonts/小夏等幅/'WebKonatsuTohaba.woff2') format('woff2'),
18       url(../fonts/小夏等幅/'WebKonatsuTohaba.woff') format('woff'),
19       url(../fonts/小夏等幅/'WebKonatsuTohaba.eot') format('eot'),
20       url(../fonts/小夏等幅/'WebKonatsuTohaba.ttf') format('truetype');
21}
22
23h1 {
24	font-family: 'Konatsu';
25}
26
27//↑これだめ（前者の、ちゃんと反映されるフォーマットをコピペしたのに…）

階層↓

考察

どのフォントでやってもwebフォントが反映されなくなってしまったので、『この３週間くらいの間に　① ソフト自体がバグったりしたのか…？』と思いましたが、そんなことってあるんでしょうか？

それか、　② コードとかが間違ってますか…？　本当念の為ですが、ローカル環境でコード触るのって「Chromeにindex.htmlをドラッグ&ドロップするだけ」で合ってますよね？
③ 他の原因…？　他に原因になり得るのも分かれば教えていただきたいです。

「サブセットフォントメーカーやWOFFコンバータが効かない」などの記事も見当たらないし、
原因が全く掴めずとても困っています。助けてください…
どうぞ宜しくお願い致します。

環境

Google Chrome
Atom

追記

試しにOsakaフォントで同じ構成でやってみたら、なんと、きちんと反映されました。

CSS
1@font-face {
2  font-family: 'Osaka';
3  src: url(../fonts/Osaka/'WebOsaka.woff2') format('woff2'),
4       url(../fonts/Osaka/'WebOsaka.woff') format('woff'),
5       url(../fonts/Osaka/'WebOsaka.eot') format('eot'),
6       url(../fonts/Osaka/'WebOsaka.ttf') format('truetype');
7}
8
9h1 {
10	font-family: 'Osaka';
11}

Consolasも大丈夫でした。ますます意味がわかりません。「webフォントにできるのとできないのがある」とかあるんでしょうか…？
ちなみに、３ヶ月前にwebフォント化したChicagoBitは、FontForgeで自作したものです。

yoshinavi

2019/02/05 04:05

「小夏等幅」のフォルダ名は日本語なのでしょうか？英小文字に直してみてはどうですか？

EXIT

2019/02/05 04:16

フォルダ名日本語です。フォルダ名をKonatsuと変えてやってみましたが、適用されませんでしたTT これもまたデベロッパツールのfont-familyにはちゃんとKonatsuとなっているんですが、Renderdはヒラギノです…

yoshinavi

2019/02/05 04:30

実際に保存しているfontフォルダ、アップしているfontフォルダ全て、名称変更されてますか？

yoshinavi

2019/02/05 04:45

「小夏等幅」フォントの収録文字の種類や数は確認されていますか？単純に「対応外」の可能性もあるかと･･･

EXIT

2019/02/05 05:18

はい。Konatsuにしたら、Atomの方でも自動的にKonatsuになってました。対応外…？webフォント化してもならないやつとか本当にあるんですか？収録文字の種類や数、確認してみましたが、違いが見当たらなかったです…

yoshinavi

2019/02/05 06:51

対応外と言うのは、文字そのものが収録されておらず、「あい」の漢字で、「愛」は収録されていても「哀」は収録されていない、等です。

yoshinavi

2019/02/05 07:43

ブラウザにもよりますが、HTMLでGoogleのNotoフォント等を読み込むと問題無く表示されますが、他のwebフォントでCSSの「@font-face」設定の場合、サーバーにアップするとキチンとwebフォントが適応されているが、ローカル環境だと反映されないことがあります。私の環境だとFirefoxがそうで、ブラウザの環境設定も試しましたが改善されず、Chrome、Edge、ie11だと問題無くローカル環境でも反映されたりするので、PCとブラウザの相性と決めつけて、PCを変えるまで今のところ「放置状態」ではあります。 (^^;)

EXIT

2019/02/05 16:55 編集

そういうことですね！文字列は「あいう@bcd0123」なので、収録されてないってことはまずなさそうです… そんなこともあるんですね！実はsafariでも同じように効かないし、ブラウザに左右されないCodePenでやってもだめだし、どうしようもなくなってますTT こういう難しい問題って、どこに相談すれば解決できるんでしょうか…　周りにエンジニアいないし… yoshinaviさんはそういう時どうなさってますか？

x_x

2019/02/06 00:54

Macは最初から'Osaka'という名前でシステムフォントが入っていると思うので、別の名前でテストしてもらえますか？

EXIT

2019/02/06 02:32

'takoyaki'で同様にやってみました。なんと、反映されませんでした！

EXIT

2019/02/06 02:53

解決しました！皆さん本当にありがとうございます。

行動規範の内容に同意します

回答2件

ベストアンサー

小夏フォントをダウンロードし、質問に提示のツールを使いサブセット化+WOFF変換してみました。
念のためフォルダ名を「小夏等幅」→「konatsu」に変更

test.html
[css]-styles.css
[fonts]-[konatsu]-フォントファイル群

というフォルダ構成です。

HTMLはほぼ質問に提示のものです。

html
1<!DOCTYPE html>
2<html lang="ja">
3 <head>
4  <meta charset="UTF-8">
5  <meta http-equiv="X-UA-Compatible" content="IE=edge">
6  <meta name="viewport" content="width=device-width,initial-scale=1">
7  <meta name="description" content="***">
8  <title>sacun</title>
9  <link rel="icon" href="favicon.ico">
10  <link rel="stylesheet" href="css/styles.css">
11 </head>
12 <body>
13   <header>
14     <nav>
15       <ul>
16         <li class="current">
17           <a href="index.html">
18             A
19           </a>
20         </li>
21         <li>
22           <a href="">
23             B
24           </a>
25         </li>
26         <li>
27           <a href="">
28             C
29           </a>
30         </li>
31         <li>
32           <a href="">
33             D
34           </a>
35         </li>
36         <li>
37           <a href="">
38             E
39           </a>
40         </li>
41       </ul>
42     </nav>
43   </header>
44
45 <section>
46
47  <h1>テストでサブセット化した文字列</h1>
48  <p></p>
49 </section><!-- bodyになってたけどsectionですよね -->
50
51 <footer>
52   <p>***</p>
53 </footer>
54 </body>
55</html>

CSSはurl(～)内の'を消してあります。

css
1@font-face {
2  font-family: 'Konatsu';
3  src: url(../fonts/konatsu/WebKonatsuTohaba.woff2) format('woff2'),
4       url(../fonts/konatsu/WebKonatsuTohaba.woff) format('woff'),
5       url(../fonts/konatsu/WebKonatsuTohaba.eot) format('eot'),
6       url(../fonts/konatsu/WebKonatsuTohaba.ttf) format('truetype');
7}
8
9h1 {
10    font-family: 'Konatsu';
11}