![見出し画像](https://assets.st-note.com/production/uploads/images/95319067/rectangle_large_type_2_79d1dea84605c6c860a3d2579589cb35.png?width=1200)
『HTML/CSSスキルアップレッスン』ここだけの話vol.3(全4回)
こんにちは、千貫(せんがん)りこと申します。 拙著『プロのコーディングが身につくHTML/CSSスキルアップレッスン すぐに活かせてずっと役立つ現場のテクニック』(2023年1月17日、翔泳社より発売)を知っていただくために、執筆の裏話や著者の思いを全4回に分けてお届けします。もしこれを読んで『HTML/CSSスキルアップレッスン』に興味を持ってくださったら、こんなに嬉しいことはありません。
「なぜそうするのか」を考える
「なぜ赤くしたの? 青じゃダメなの?」
課題を提出した学生さんにこんな質問を投げかけると、多くの人は「赤の方がかっこいいから」のように答えます。学生ならほほえましいのですが、プロの回答としてはちょっと頼りないですね。
これは創作に関係するどんな仕事にも言えることかもしれませんが、プロならばどんな小さなポイントも「なぜそうしたのか」を説明できるようにしておきたいものです。
もちろんセンスや勘を生かすべき箇所もありますが、個人的な感覚として、それは全体の10%にも満たない気がします。優秀なクリエイターほど、論理的に制作を進める印象です。
「え? それってゼロイチの仕事の話で、コーダーには関係ないでしょ?」と思われる方もいらっしゃるかもしれませんが、そんなことはありません。コーディングだって120%クリエイティブな作業ですから、理由を問われたときにしっかり答えられるよう準備が必要です。
たとえば。
あなたなら以下のコンテンツをどのようにコーディングしますか? HTMLとCSS、それぞれ想像してみてください。
![](https://assets.st-note.com/img/1673248200288-By8JUsjoSC.png?width=1200)
では、どうしてそのコードを書いたのか説明できますか?
なぜ、そのタグでマークアップしたのでしょうか?
「事例詳細を見る」ボタンの矢印を表示する方法はいくつかありますが、なぜそれを選んだのですか?
もし「なんとなく」「いつもやってるから」といった理由しか出てこないなら黄色信号です。
ここだけの話vol.2にも書きましたが、誰しも、慣れれば慣れるほどつい手グセに頼ったコーディングをしてしまいがちです。その都度「本当にこれでいいのかな?」と自問自答するクセをつけると、決まり切ったコーディングから脱却できます。
クリエイティブな作業に、100点も0点もありません。完全な正解が無いだけに「自分のやり方が合っているのか不安」という人も多いのですが、よく考えて導き出したコードなら自信を持てるのではないでしょうか。『HTML/CSSスキルアップレッスン』で紹介しているサンプルコードは、意図や目的を可能なかぎり説明したつもりです。もし「これまで自問自答したことがない」という方がいらしたら、説明文を参考にしてみてください。