2018年12月03日(月) ビューポイント

変身前の自分に乗るジャンボーグ9。



何年遅れてんだという話だが、先月あいほんをゲットしたので当HPのレイアウトをスマホでどう表示されるかチェック。
一応アイパッドでは見てたんだが、やっぱ大きさが違うと文字小せぇな。
コンテンツのリンク名なんか全然見えない。
日記の文字だけデカくなっている。

そして、サファリでは画面に収まるのだがスマホ版クロームだと拡大表示されている。

スマホのブラウウザ画面レイアウト用には、HTMLヘッダ記述のviewportというのがある。
コレでパラメータ指定するのだがどうやってもクロームではまっとうに表示されない。
アンドロイドではどう見えるのか寒気がするわ。
キンドルファイアでは一応見えたのだがな。

この辺を見て参考にしたのだが、クロームのガキは言うこと聞きませぬ。

【HTML】これでスッキリ viewport の設定
アンドロイドのchromeで表示が崩れる。viewportの設定ミスが原因
【覚書】viewport指定について

まぁ、ソレ以前にスマホじゃFlashが鑑賞できないのが申し訳ないんじゃが。
ついでに10年変えてないヘッダを見直したら、どうやら今はtext表示にShift_JISなんて指定しちゃいけないようだな。
utf-8を指定するらしい。

コレが何度も文字化けおこしてなんとか表示できるようになった。
ソレについてはこの辺の方々を参考にしましたわ。

HTML5のhead内の記述
HTMLのタイトルが文字化けするとき
今すぐ対策できる！HTMLで文字化けを直す方法【初心者向け】

テキスト表示にutf-8を指定してるのに、テキスト自体をutf-8で保存すると表示が化ける
Shift_JISで保存すると化けない。
なんなんねん。

うちは無駄にhtmlのページが多いのでまだ全部は変えてない。
映ってるからいいかーと思ってたが、以前通ってた古いHPなどは文字化けで何も見えないトコもあり、いつの日かそうなるかもしれんのでぼちぼち対策しますわ。