HugoでもやはりHTML&CSSの知識は必要

HTML&CSSを勉強するにはこの本が良かった

HTMLは昔に勉強したことあったのだが、CSSにあまり詳しくなかった自分。 いままでどちらかというとCやC++を使うようなクライアントエンジニア業務の経歴が多かったということもあり、 Web系の勉強はそれまでそれほど真面目にやっていなかった。

しかし、最近は時折Railsで作られたアプリのサポートに関わることなども出てきて、真面目にWebの作り自体も わかっていないとまずいなと思い、いつも必要な時に適当に断片的に調べた知識のみで、整っていない自分の知識を少し整理すべく、 一度は真面目にHTML&CSS本を読まないといけないとは思っていた。

そんな中、SBクリエイティブから出ている

「1冊ですべて身につくHTML＆CSSとWebデザイン入門講座」 Kindle版

を買って読んでみた。

結果的にはこの本を読んで学んだ、というか、かなり大部分をそのままサンプルの作りを使わせてもらっているのだが、 本ブログでは既存テーマを使わずに上記HTML&CSS本で学んだ作りをそのまま利用して、HugoのLayout設定にカスタマイズ編集して使っている。

• 既存テーマを使わないメリッット
  • 自分でコーディングしつつ作っているので、作り、構成がわかっている
  • 既存で入っている設定に邪魔されたり、悩まされることなく、自分のカスタマイズができる
  • テーマを使っていないので利用するテーマのライセンス条項を気にする必要がない
• 既存テーマを使わないデメリット
  • とにかく何をするにも時間がかかる、特に最初のレイアウト一式を揃えるのが大変
  • 日本語の情報が少ないので英語サイトも参考にする必要がある

ただ、既存テーマを利用しても、結局、自分でいじりたい箇所が出てきてカスタマイズしたくなった時にはHTML&CSSの知識は必要になってくる。 そういう意味でも既存テーマでさくっとブログサイトを立ち上げたい人でも、HTML&CSSにそれほど詳しくない人は一度は何かしらのHTML&CSS本を読んでおいた方がいいのだろう。

Hugoでのファイル構成を理解するには

既存テーマを使わず、自分でレイアウトを作っていきたい人は、Hugoでのファイル構成やそれぞれのファイルの役割がある程度わかっていないといけない。

そこで、Hugoでレイアウトのために、どのファイルをいじるのかとか、SingleページとListページは？とか、そういったことを学ぶにとても役立ったのが以下のサイトだ。

https://zwbetz.com/make-a-hugo-blog-from-scratch/ - Make a Hugo blog from scratch

英語のサイトだが、一通りこのサイトに書かれていたことをチュートリアル的にやってみると、わかりやすく良く理解できたので、とてもオススメである。

ここで書かれているチュートリアルでは既存テーマを利用しないので、いきなりthemesディレクトリを削除するところから始まっている。

既存テーマを使っている人でも、一度、ここのチュートリアルをやってみると役に立つことはあるんじゃないかと思う。