記事一覧

中の人日記・フォント問題解決!編

 ちょっと前に日記に書いた、「ファイルの文字コードがUTF-8だと、一部の文字表示が勝手に英数字フォントになる問題」が解決した!

 これ↓

「Internet Explorerの英数字の書体の変え方 」
https://keitan0202.exblog.jp/238425156/

 これは気付かないよ普通!

 という訳で、心置きなくサイトのファイルをUTF-8のHTML5で作れることになった。
 ので、まずはトッキュウページから作り直してみました。
(いやまあ小説が書けないモードの逃避でね‥‥)

 でもってここからは、解っちゃいるけど色々あるんだよ!な仕様について。
 
 
1.偽フレーム

 HTML5では、フレームは廃止されている。
 あれはコンテンツの多いサイトではすごく便利なので、何で廃止にしやがるんだ!と大変迷惑である。
 うちも3ジャンル全部でフレーム構造にしてるし。
 しかしHTMLの偉い人がそう決めてしまったので仕方がない。
 世の中には○○警察みたいな人が結構いて、そういうのに突っ込まれるのも大変鬱陶しいし。

 しかし現実的にフレームは便利だ。
 獣の里みたいな、辞書的な項目をずらーっと並べてる構造に、パン屑リストは向いてない。
 勿論、フレーム構造の見た目を再現したいだけなら、

 a.幅の違うボックスを二つ並べてフレームっぽく見せる。
 b.SSIでメニュー用フレームをヘッダとして固定&自動表示させる

 という方法はある。
 しかしそれだと色々邪魔というか、はっきり言うと「本文ページだけ開きたい時」があっても、否応なしにメニューの塊がついてくるのが嫌なんだよね‥‥
 そこで検索して見つかったのが、「FLAMESET(HTML5では廃止)の代わりに、iflame(存続決定)をフレームセットみたく使う方法」だった。
 そんな訳で、トッキュウページの一見フレームに見える構造は、実はiflameです。

 例・普通のiflame(タグリファレンスのページ)
http://www.htmq.com/html5/iframe.shtml

 これを色々いじって、旧来のフレームっぽく見せてる訳なのでありました。
 
 
2.テーブルレイアウト問題

 見た目だけのためにテーブルでレイアウトを作るのはよろしくない、ということは、まあHTML4の頃から言われてはいた。
 でもじゃあ更新履歴みたいなのをアレに入れる以外にどうするんだよ!
 ベタテキストが改行も不揃いな状態でずらーっと並んでたら読みにくいじゃんよ!
 検索エンジンが解釈しにくい? こっちは検索にかかりたくない同人サイトだ検索ロボの都合なんぞ知らんがな。
 ってことで、割とあれはまかり通っていた(同人サイトじゃなくても)。

 しかしこれもやっぱりHTML警察が(略)
 という訳で、検索しまくってdivコンテナで偽テーブルを作る方法を発見したのでやってみた。
 なのでトッキュウページでテーブルっぽく見えるのは、実はテーブルではありません。
 内実がどうあれ、あの見た目だけは譲れない。
 
 
3.<br>で行空きを作るな問題

 これは近年、CSSで設定して空きを作りましょうということになっている。
 しかしそれって何つーか、小説における空改行の必要性と、それをいちいちCSS指定やる手間を全く理解してない奴の論理なんだよな‥‥
 そういう定義にした人達というのは、ネットにおける文章は全部「単なる情報のための文章」としか捉えてないんじゃ?と思ったりする。
 駄目な改行があるのは確かだ。
 作ってる人と見てる人のモニタサイズが違うのに、作り手側の環境に合わせて改行位置を変えちゃうようなアレ。
(いにしえのガラケー小説サイトの行開けすぎ問題みたいなものその一環)
 でも小説は、開けなきゃならない間みたいなものがある。
 それは<p>で括る段落とはまた別のもので、それを設定で調整と言われても正直無理。
 という訳で、「明らかに段落」な、◇で場面転換してるところはともかく、見た目の間合いとしての連続<br>はそのまま残してます。
(タグチェックにかけると減点されるけど知るか)
 
 
4.ルビの仕様がやっぱりIEだけおかしい問題

 HTML5になったら、ルビ用のタグがちょっと簡単になってた。
 今どきルビ非対応のブラウザとかねーだろ!っていうことらしく、「非対応ブラウザで見た場合、こう表示されます」なタグが省かれるようになっていた。
 それでそっちの新仕様で書き直してみた。
 ‥‥のだが、するとIEで見た場合だけ、ルビと親文字がべったりくっついちゃって読みにくいのなんの。
 Firefoxとスレイプニルだと、新仕様でも旧仕様でも全然見た目変わらず。なのにどういうこったIE11。
 それでしょうがなく、タグチェックで「HTML5では定義されていないタグです」と言われながらも、そこはしょうがなく旧仕様に戻した。
 ほんとどうにかしてくれよIE問題‥‥
 
 
 まあそんな感じで、しばらく様子見て大丈夫そうなら、同じ形式でデビと里も作り直そうかなと思ってます。
 IE11、Firefox、スレイプニル(Chromeエンジン仕様)で動作確認して問題なしだけど、スマホから見たらどうなんだろうなあ。
 トッキュウページをご覧のスマホユーザーの方は、何か表示がおかしいとこがあったら是非お知らせ下さいませ。
 
 
※追記‥‥シリーズが増えてきて時系列が解りにくくなってきたので、どっかにシリーズ一覧表みたいのを増やしたいなあと構想中。
(しかしさすがにそろそろ小説を書かねばならんので、実現がいつになるかは不明‥‥)