Internet Explorer 9 の最新版でも改善されない致命的なHelveticaバグ


投稿日:2012年11月14日
  • 39
  • 0



IE9でページが表示されないという致命的なバグ

ごく一般的な条件で発生して、簡単に対応できるので、Webデザイナーやコーダーの方に伝えてあげてください。

私はとある環境のテスト中に発生したので、設定ミスだと思い数時間無駄にしました…。


バグの症状

具体的には
1.「Type1のHelvetica」をインストールしているPC。
2.「css」で「body」にたいして「font-family」で「Helvetica」を先頭に指定。

こんなありふれた環境で画面が真っ白(灰色?)になります。

以下の画像のように「example.com の表示中に問題が発生したため、Internet Explorer は互換表示を使用して Web ページを更新しました。」というメッセージと共に真っ白な画面が表示されます。

以下のWebサイトでバグを体験できます。IE9でアクセスしてみてください。
バグ発生条件を再現してくれているサイト


バグ発生条件

以下のようにhelveticaを先頭に指定すると発生します。

body {
	font-family:helvetica,arial,sans-serif;
}

 

また、WordPressのデフォルトテーマ「twentyeleven」でも発生します。「style.css」334行目あたりにある「Helvetica Neue」でも同じように発生するようです。

body, input, textarea {
	color: #373737;
	font: 15px "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 300;
	line-height: 1.625;
}

バグの対応策

helvetica」や「Helvetica Neue」より先に、別のフォントを指定する。

body {
	font-family:arial,helvetica,sans-serif;
}

IEの表示に関するバグの多さは有名ですが、全く表示されないとなると困りものです。しかもフォントファミリーにHelveticaを指定するのは、ごく一般的な指定なので困る人も多いと思います。少しでも早く対応してもらいたいものです。


現在のページを共有する



現在のページに関連する記事

Internet Explorer 9 の最新版でも改善されない致命的なHelveticaバグ Web Fontの使い方とGoogle Fontsのオススメフォント 10選
Internet Explorer 8で10pxのフォントが崩れる Internet Explorer 8で10pxのフォントが崩れる
Internet Explorer 9 の最新版でも改善されない致命的なHelveticaバグ Google Fontsの日本語フォント「Noto Fonts」の使い方
Internet Explorer 9 の最新版でも改善されない致命的なHelveticaバグ SyntaxHighlighterでConsolasを使うと日本語が文字化けする際の対処法
Internet Explorer 9 の最新版でも改善されない致命的なHelveticaバグ 人気の画像掲示板「JoyfulNote」でスパム対策を追加
Internet Explorer 9 の最新版でも改善されない致命的なHelveticaバグ 「人気ブログの作り方」もう色で悩まない!人気ブログから学ぶ色彩のテクニック
Internet Explorer 9 の最新版でも改善されない致命的なHelveticaバグ Mac OS X 10.5、10.6、10.7、10.8に標準でインストールされているフォント一覧

おすすめの記事

SNSのカウントをキャッシュするWordPressのプラグインを作成しました

SNSのカウントをキャッシュするWordPressのプラグインを作成し…

初心者でも安全なLAMP環境を構築する方法を解説

初心者でも安全なLAMP環境を構築する方法を解説

標準のアンインストーラーで消えないソフトを徹底的に削除する方法

標準のアンインストーラーで消えないソフトを徹底的に削除する…

サーバの処理を自動実行するcronの仕組みと応用法

サーバの処理を自動実行するcronの仕組みと応用法

WordPressの新・旧ループからカスタムクエリ・アーカイブまで徹底解説

WordPressの新・旧ループからカスタムクエリ・アーカイブまで徹…

Mac OS 9時代のIDE接続のHDDをMacDrive 10を利用してWindows 10で読み込む方法

Mac OS 9時代のIDE接続のHDDをMacDrive 10を利用してWindows 10…

Apacheのmod_deflateでコンテンツを圧縮してサイトを高速化する方法

Apacheのmod_deflateでコンテンツを圧縮してサイトを高速化する…

公式ドキュメントよりも詳しいTinyMCEの使い方(基本編)

公式ドキュメントよりも詳しいTinyMCEの使い方(基本編)


いただいたコメントなど

  1. bluem のコメント:

    IEで表示しようと思ったら突然表示されなくなっていて原因も検討がつかず焦っていたところ、検索でこちらを見つけました。助かりました。ありがとうございます。

    • Oxy のコメント:

      IEのバグの多さはどうにかして欲しいですね。
      個人的にはバグリストとセットでリリースしてほしいくらいですw

  2. 2kakkei のコメント:

    本当に参っていたところ、助かりました!!
    まさかの仕様ですね。
    ありがとうございました!!m(_ _)m

  3. ピンバック: フォントHelveticaで作成されたサイトはInternet Explorerで表示されない!? | helog

bluem へ返信する コメントをキャンセル

コメントは認証制のため、すぐには反映されません。

プログラミングに関する質問は「日本語でプログラミングの悩みを解決するQ&Aサイト sukegra」をご利用ください。