時々の記録

コンピュータとアニメ感想etc.のブログです。 ☆ゆるゆるっと更新中です☆

Top Page › 読書 › コンピュータ › HTML/CSSデザイン講義/森本恭平 平谷奈緒子 中西生乃
2017-04-20 (Thu) 22:21

HTML/CSSデザイン講義/森本恭平 平谷奈緒子 中西生乃

現場のプロが本気で教える HTML/CSSデザイン講義 (Design & IDEA)「現場のプロが本気で教える HTML/CSSデザイン講義」を実習してみました。

お仕事がらみでHTML&CSSに触れることがあるのですが、古いサイトの改修をしようとCSSファイルをのぞいたら、修正に合わせて場当たり的に対処してきたらしく、CSSが複雑怪奇な迷路のようになっていて頭を抱えました。(^^;

なんとかもう少し把握しやすくできないかと思っていた時、偶然この本と出会いました。そのおかげで、CSS設計について自分なりに整理することができました。

この本では、実際に手を動かしてHTMLやCSSを作成しながら、サイト設計の基本を学んでいきます。その過程で大きな役割を果たすのが、SassとGulpです。Sassは前に少しだけ触ったことがありましたが、Gulpは名前だけは知っていたものの、これまで触れる機会がありませんでした。

Gulpを起動しておけば、ファイルを修正すると同時に必要なファイルが作成されて、ブラウザがリロードされて修正内容が確認できるのは便利ですね!(^^)

Node.jsは、前にjavascriptのコード補完をemacsでしたくて、ternというツールを導入した時にインストールしていました。その後、javascriptを触る機会も減り、そのまま使わなくなっていました。(^^;

本の対象は、全くの初心者向けではなく、ある程度HTMLやCSSを理解している人です。実習では、従来のfloatを使ったレイアウトではなく、CSS3から導入されたFlex boxを使ってレイアウトを組み上げていきます。ブラウザの対応状況は大丈夫なのかと心配になりましたが、最近のPCやスマホに搭載されているブラウザなら、ほぼ問題なく利用することができるようですね。古いブラウザのサポートが不要なら、積極的に使ってみるのもいいかもしれませんね。

それほど難しい内容ではなかったので、1週間ほどで実習を完了しました。実習を終えての感想は、伝えようとしている内容はとてもいいのに、実習内容の記述に誤りが多いのが残念でした。
テキスト通りにサイトが表示されなかった時、自分の誤入力が原因でうまくいかないのか、本の記述が間違っているのか、それを確認するのに一番時間を取られました。

この部分で大きく損をしていますが、それでもこの本を読んだおかげで、作業を効率化する方法を以前よりも検討するようになりました。この本のメインはCSS設計の効率化でしたが、HTML作成の効率化のために、テンプレートエンジンのslimというツールを試してみたのは、思わぬ収穫でした。(^^)

最終更新日 : 2022-10-30

Comment