久しぶりにHTMLコーディング。

かなり久しぶりにHTMLコーディングをしました。

Adobe XDでWebデザインをして

普段はAdobeイラストレーターを使ってロゴを制作しています。

かなり使い慣れてきました。

しかし、「あ、久しぶりにHTMLコーディング」をしたいと思いまして。

いきなりするよりは、せっかくAdobe XDを持っているし、Webデザインをしようと。

簡単な2カラム構成にして、適当にコンテンツを置きました。

軽く1時間程度で出来ましたね。

サクサクと進むことが出来ました。

いざHTMLコーディング

いざ、HTMLコーディング!

とは言え、テンプレートを持っていますので、それを元にHTMLコーディングをしていきます。

ヘッダーとフッターは完成している状態にしているので、コンテンツ部分をHTMLコーディングしていきます。

SCSSが効かない!

ぼくは、BEM+SCSSでHTMLコーディングをするのですが、

「おっと。。。SCSSが効かない・・・」

あれれ?

どうなってるんだ???

答えはCSSファイルにSCSSを書いていました。

「そりゃダメだわ」

って思いましたね。

速攻で修正し、そして、サクサクとHTMLコーディングをすることが出来ました。

HTMLコーディングは楽しい

HTMLコーディングは楽しいですね。

コードは嘘をつかない。

書いたとおりに表示される。

潔い。

芸術的分野は正解がないのですが、HTMLコーディングは正解があります。

よって、HTMLコーディングは一見複雑そうに見えますが、実は単純なのです。

とは言え、初心者の方は苦労されるかと思います。

勉強方法はたくさんありますが、個人的にはAdobe XDなりでWebデザインを制作し、そしてその通りにHTMLコーディングするにはどうしたら良いかと調べると良いと思っています。

ぼくの場合、HTMLとCSSの違いが分かりませんでした。

HTMLは土台、CSSは装飾です。

たとえば家の場合、壁はHTML部分、壁紙はCSSという感じです。

文字に置き換えると、テキストはpタグですが、赤色にする場合は「color:red」とします。

ざっくり説明するとこのような感じです。

ガンガンHTMLコーディングをしていこう

ここ最近、ロゴばかり作っていたのですが、ロゴ制作は今後も続けます。

が、HTMLコーディングに少しだけかたむけて取り組みたいと思っています。

せっかく持っている知識ですから、使わないと損ですよね。

今のところはそんな感じで思っています。

さいごに

HTMLコーディングは楽しいですが、まぁ、楽しいと思えるレベルに達して良かったと思っています。

HTMLコーディングができるとブログのカスタマイズも出来ますから便利ですね。

そういうわけで、今日からHTMLコーディングを頑張ります。