サイトの手直し
2019.10.24
 フルcssでサイトの手直しをしたい!と思い立ってはみたものの,htmlの勉強するのタイヘンだーと,かれこれ長い年月が経ってしまいました。
 レイアウトをcssで行なってこなかったツケが溜まりに溜まっています。

 レスポンシブじゃないんです。

 何とかPCでの閲覧には堪えられても,スマホ画面ではサイトの表示が絶望的に小さくって,かけてたメガネを眉のうえに上げては戻してみたり,画面を遠ざけたり近づけてみたり。だんだんスマホを放り投げたくなってまいりました。

 そう,レスポンシブじゃないんですよ!
 良くないですね。

 それでもまあそのうちとサボっていたら,Google先輩から「テキストが小さすぎ!」とか,「ビューポートが設定されてない!」とか,なんだか気になることを言われ始めたんですよね。

つづく

2019.10.25追記

 Google先輩が何やら教えてくれるのかもしれないと調べてみたら,とりあえず「ビューポートを設定」しとけば,デバイスに応じた適切なスケーリングがなされるようなのです。
 これならなんとなくサクッと簡単かも!と思い立ちまして,早速各ページのhead内に,ちょちょっとビューポートの設定を書いてアップロードしてみたら…。

 スマホでもまともに閲覧可能なスケーリングになりました!

 が,そもそも各要素のサイズに絶対指定が多いので,(スマホ縦位置で)横スクロールを要するページが多発。
 相対指定でないと,とてもレスポンシブなんて言えない!

1.各要素のサイズの絶対指定を排除し,相対指定に
2.いや,そもそもレイアウトはCSSでやろう!

 1.の相対指定で乗り切ろうかとも思いましたが,それでは根本的な解決にならんだろうし,後のメンテナンスを考えてもやはり,2.で行くのが賢明なのではと,意を決して2.に取り組むことにしてみましたヨ。
 幸か不幸か時間は有り余っています。

つづく

2019.10.31追記

 ちょっと話が戻りまして。
 「B-T Photography」(仕事!)と「board&trekking」(趣味)の二つのサイトを持っておりまして,まずは優先順位の高いB-T Photographyのサイトから直し始めたのが, 

1.各要素のサイズの絶対指定を排除し,相対指定に

なのです。
 board&trekkingに比べてページ数も少ないですしね(今となってはboard&trekkingに蓄積したアーカイブスの量に,取り組む前から心が折れるのです)。

 この修正が10月中下旬頃までに粗方片付いて(ビューポートを設定しただけの横スクロールのページはなお残る),勢いでboard&trekkingの方も,ぱぱぱっとビューポート設定(不要なMETAタグがあったので一括置換しただけ)。

 と,ここで,「やっぱりレイアウトはHTMLから追い出してCSSでしなきゃ!」と奮起。
 board&trekkingの上層ページは一応刷新することができました!
 こうしてソースを眺めてみると,HTMLってこんなにスッキリするんだね!と感動のシンプルさ。

 ただ,山別のインデックスページや,各山行記録のページ,日記等はまだまだこれから。
 なにしろHTML,CSSの知識も未だ初心者クラスから脱却できていないので,

→サルでも解りそうなサイトで逐一タグ等調べながら,
→チクチクHTML・CSSを直してはupし,
→PCとスマホでレイアウト確認
→なんか全然思ってたのと違う
→原因究明(とても時間がかかる)して修正

の,繰り返しなので,とても時間がかかっています。
 使ってるソフトが古すぎて,近頃のタグ等のプレビューができないのも地味にイタい。
 現状,board&trekking上層ページにケリをつけて,山別のインデックスページに取り掛かってるところです(北海道と青森県は終わった!)。

 で,改めて膨大なアーカイブスを前に,

「あれ,B-T PhotographyのサイトのレイアウトCSS化の方が先じゃね?」

 と考え始めたのが今日です。

つづく(と思うよ)

2019.11.16追記

 というわけで,B-T PhotographyのレイアウトCSS化は,過去の日記を除いてほぼ完了しました(ふぅ)。
 これで,今後はメンテナンスが容易になります。
 フルCSSと言えるのかどうか,素人の独学につき検証不可能ではありますが,ソースを見てツッコミどころがあれば是非お知らせください。たぶん,いっぱいある。
 あ,そう言えば,縦画面でも横画面でも,イイ感じに背景の写真を設定できる方法はないかなと悩み中。
 …しかしあれですね,「サルでもわかる!」的解説サイトをみてもよく分からないという…。

 B-T Photographyの過去日記と,board&trekkingの膨大な山行記録のCSS化はこれからゆっくりと…後者の方が先かな?
 山行記録は,近年新規のものが何も無いという問題もありますけれど。その辺は追々。