植物図鑑サイトを自作してみた
このnoteはIT素人が植物図鑑サイトをHTMLとCSSで自作するブログです。
とは言いつつ実は去年の夏から以下の教本を使って自作HPの作成に取り掛かっていた。
この１年３ヶ月うちHPの内容作成に掛けた時間は正味３ヶ月ほどだ。その他の期間はサボりつつ子育てに熱中したり英検などの勉強に当てた。いい名前が思いつかなかったのも作業が停滞した理由の一つだ。しかし１ヶ月ほど前、本屋の文房具コーナーでふと見た児童向けノートシリーズのネーミングのリズムが、植物＝ボタニカルの語感と完全にシンクロし、その晩の脳内会議にて全会一致で可決された。
「ボタニカ学習帳」
そしてまずはこのnoteを開設し、中途半端な状態でにパソコンに保存したままだったhtmlとCSSを仕上げる決意をした。それから１ヶ月、ただでさえネーミングに１年かかったのだから、素人が細かい仕様にこだわると１０年くらい時間が過ぎてしまう気がしたので、突貫工事で書き上げた。特に最後の最後、スマホ対応のレスポンシブデザイン？については、どうしてもバックグランドの画像が巨大に表示されるため、画像自体を諦めた。肝心の樹木図鑑コーナーにはまだエゴノキしか陳列していない。イキって儲けた鳥図鑑はページ準備中で、チョウ図鑑はトップ画像すらない。そもそも植物ですらないからまあいっかな。
よく吟味しないまま安さ重視でロリポップでレンタルサーバーを申し込み、ドメインも訳もわからず無難で安い.netに決めた。いざサーバーにアップロードしてブラウザにURLを打ち込んだら全部文字化けしていた。心が折れそうでもう一年延期しそうになったが、htmlの冒頭「UTF-8」が「UTM-8」になっているのに奇跡的に気づいて解決。SSLも無料のを申請して自分のスマホでうつらない問題も解決した。
コンテンツの少なさ以外にもまだまだ問題が山積みで、一番の懸念事項が、これからページが増えてった時に共通部分（ヘッダーなど）を変更するには全てのページを手動で変更する必要があるのか、他の方法（PHP？）があるのかである。あとはエクセルの一覧から個票を作成するみたいにhtmlを書き出せる方法とかあれば記事の管理が楽だなと考えていたり、まさに素人で何ができるのか出来ないのかすらわからない状態だ。あとはファイルの命名方法や効率的なフォルダ構成も考えなければいけないし、何より著作権とかセキュリティも勉強しておきたい。
ということで、何かいい書籍や動画をご存知の方がいらっしゃいましたら、コメントお待ちしております。