ホーム >> 左脳Script >> Movable Type >> 小技 >> アスキーアート

アスキーアート


某巨大掲示板で一般的に扱われている、AA(アスキーアート)をブログ記事中できれいに表示する方法を模索。

Movable Type では、AAをそのまま綺麗に表示する事は出来ません。
これは、AAで前提とされているフォントが、「MS Pゴシック 12ポイント」を前提にされているからだそうです。→参考リンク


ならば「HTML なり css なりで、フォントを指定すれば良い」という訳で以下テスト。
  • 指定なし。
    ┌┴┐┌┴┐┌┴┐ -┼-  ̄Tフ ̄Tフ __ / /
      _ノ   _ノ   _ノ ヽ/|    ノ    ノ       。。
           /\___/ヽ
        /ノヽ       ヽ、
        / ⌒''ヽ,,,)ii(,,,r'''''' :::ヘ
        | ン(○),ン <、(○)<::|  |`ヽ、
        |  `⌒,,ノ(、_, )ヽ⌒´ ::l  |::::ヽl
    .   ヽ ヽ il´トェェェイ`li r ;/  .|:::::i |
       /ヽ  !l |,r-r-| l!   /ヽ  |:::::l |
      /  |^|ヽ、 `ニニ´一/|^|`,r-|:

  • font-family:'MS Pゴシック';font-size:12px; 指定。
    ┌┴┐┌┴┐┌┴┐ -┼-  ̄Tフ ̄Tフ __ / /
      _ノ   _ノ   _ノ ヽ/|    ノ    ノ       。。
           /\___/ヽ
        /ノヽ       ヽ、
        / ⌒''ヽ,,,)ii(,,,r'''''' :::ヘ
        | ン(○),ン <、(○)<::|  |`ヽ、
        |  `⌒,,ノ(、_, )ヽ⌒´ ::l  |::::ヽl
    .   ヽ ヽ il´トェェェイ`li r ;/  .|:::::i |
       /ヽ  !l |,r-r-| l!   /ヽ  |:::::l |
      /  |^|ヽ、 `ニニ´一/|^|`,r-|:


これで、一般的な解決を見た事になる訳ですが、フォントの指定だけではどんな環境でも綺麗に表示できるとは限らないようです。

指定しているフォントがフォント名からわかる様に「MS ~」とか言うフォントで、これは Microsoft Windows 専用なのです。当然、Windows 以外の OS で普通に使用できる保障はありません。

最近のブラウザは、より正確なブラウジングをする為に、独自にフォントを持っているものがあります。それでも、MS~ というフォントそのものを持っている訳ではなく、見た目が近いフォントをブラウザが自動的に判別することになります。


フォントの問題は、多くの人が悩んでいるようですね。W3C などで HTML の標準化がどうのと言っているようですが、フォントの問題こそ優先度が高いと思うんですよねぇ・・・


まぁ、愚痴はさておき、
Movable Type で汎用的に AA を仕様できる様にする為に、以下のような簡単なスタイルをテンプレートにチョっと追加。

.AA{
font-family:'MS Pゴシック';
font-size:12px;
}
さらに、ブログ記事(不自然にならないように、記事概要にも?)の本文を含むタグに、クラス指定をすれば、AA 対応ブログが出来る様になります。
コメント部分に指定すれば、ページがうっとおしく華やかになる事でしょう。



追記:この AA 用クラス、文字が多いと大変見づらいと判り、手放しでお勧めできません。



トラックバック(0)

トラックバックURL: http://n-yagi.0r2.net/sanoupulurun/mt-tb.cgi/54

コメントする

ホーム >> 左脳Script >> Movable Type >> 小技 >> アスキーアート

アーカイブ

このブログ記事について

このページは、n-yagiが2009年5月12日 17:37に書いたブログ記事です。

ひとつ前のブログ記事は「逃げるリンク」です。

次のブログ記事は「404対策 その後」です。

最近のコンテンツはインデックスページで見られます。過去に書かれたものはアーカイブのページで見られます。

Creative Commons License
このブログはクリエイティブ・コモンズでライセンスされています。