来歴補助簿content｜astern｜ahead
| 2020年04月13日(月) | HTML / CSS / PHP その2 |
昨晩偉そうな、来歴補助簿を書きましたが、寝る前にいろいろ考えていたら、改良したindex.htmや他ページにHTML5 の宣言文 " ＜!DOCTYPE html＞ "を書き忘れていたことが、判明。
そもそも、宣言していないので、HTML4互換モードでブラウザが認識するので、HTML5では推奨されていない、"＜aligin＞"等を使っても、表示されていました。
ドキドキしながら、HTML5の宣言文を入れてみると、案の定表示はバラバラに・・・・ほぼ振り出しに戻り、レイアウトと装飾を決めるため、CSS / HTMLと再度向き合い、戦いました(大袈裟かな?)
いろいろ試行錯誤した結果、表紙のメニューとコンテンツを右左入れ替えたりと、大幅な改定(?)も実施し、何とか形になりました。
釈迦に説法になる人も多数いると思いますが、HTML5で構成すると、一つのHTMLでPC / スマホの両方で閲覧できます。昔はよく携帯用(スマホ)のページはindex-i.htmlとか、別のHTMLになっていましたね。
筆者の貧弱なページもPCと携帯で見比べると、以下の違いになります。
上がPC下がスマホになります。
スマホは、Firefox / Chrome / Safariで動作確認しているので、大体のスマホで閲覧可能かな？
スマホ閲覧用に、以下にQRコード載せておきます。
あっ、同じことを2008年6月22日にしていますね。
今度こそ改良完了かな!?
