ブラウザで表示する際にAAがずれる
ブラウザでAA(アスキーアート)を表示しようとすると、なぜかズレてぐちゃぐちゃになってしまったということはないでしょうか。
空白も含めて元のAAを全てコピーしたはずなのにずれる現象はよくあることであり、原因を理解しておかないと元に戻す事すら困難です。
その原因というのが「フォントの違い」です。
フォントによって文字幅や文字の形が異なっているため、その影響でAAがずれてしまうのです。
例えば２ちゃんねるで使われているAAは「MS Pゴシック」というフォントが使われており、「MS Pゴシック」を使って表示する設定になっていたら、元のAAが正しく表示されます。
ですが、別のフォントで表示すると大きくズレてしまい、フォントによっては見る影もありません。
こちらはブラウザで使われることが多い「メイリオ」で表示したものです。
このような現象はフォントが原因で起こるため、Windows10などのパソコンやAndroidスマホなどどちらでも発生します。
ブラウザで表示する際にAAをずれないようにする方法
ブラウザで表示するAAが崩れる問題を防ぐには、ブラウザのデフォルトのフォント設定を変更することで解決できることがあります。
ここではChromeとFirefoxでフォント設定を変更して解決する方法を見ていきましょう。
Google Chrome
Google Chromeの場合は以下の手順で変更します。
まず、ブラウザ右上のメニューアイコンをクリックし、[設定]を選択します。
一番上の検索ボックスに「フォント」と入力し、表示された[フォントをカスタマイズ]をクリック
フォントサイズが「16」になっているかチェック。なっていなかったら変更する。
「標準フォント」を[MS PGothic]に変更
似た名前の[MS Gothic]と間違えないように注意してください。
変更したらブラウザで開けるページのフォントが切り替わるはずです。
切り替わらない場合はサイト側がフォントを指定しているため、フォント設定では解決することができません。
Firefox
Firefoxの場合は以下の手順でフォントを変更します。
まず、ブラウザ右上のメニューアイコンをクリックし、[オプション]を選択。
オプション画面上部の検索ボックスに「フォント」と入力
表示された「既定のフォント」を[MS Pゴシック]に変更
フォントサイズを16にする
これで、AAの表示が崩れないフォント設定になります。
Google Chromeと同じように、サイト側がフォントを指定していた場合は、ブラウザ側のフォント設定を変更しても解決しません。
ほかのブラウザ
Google ChromeやFirefox以外にもフォント設定を変更できるブラウザはたくさんありますが、どのブラウザも基本的に以下のフォント設定にすれば、AAの見た目を崩さずに閲覧できるはずです。
- フォント名：MS Pゴシック
- フォントサイズ：16px(12pt)
- 行間：2px
AAがずれる問題を解決できない事例
ウェブサイト側が表示するフォントをしているにもかかわらずAAが崩れてしまう場合は諦めるしかありません。
ブラウザのフォント設定は「サイト側がフォントを指定していないとき」に使われる設定で、サイト側がフォントの種類やサイズなどを指定していた場合は意味がありません。
また、スマホアプリ版ブラウザはフォント設定ができないものが大半(Google ChromeやSafariなど)ですので、スマホを使っている方も残念ながら諦めるしかありません。
AAが崩れているサイトは、はじめからそういうものと思って閲覧するといいでしょう。