Web業界の動向・情報
投稿日:

HTMLコーディングとは

HTMLコーディング

HTMLコーディングについてWeb業界で働いている方であれば、概ねの人は分かると思いますが、生活していく上では中々馴染みのないものですね。

私は最初の頃全く意味が分からず目が点になっていました。
ソースコードを見てもよくわからないですからね。

HTMLコーディングはサイトを作る上で重要な要素です。
コーディングができれば、あーなっているのねってわかりますからね。
そうなる為にまず私が行なったことについて少しご紹介します。

1.タグの意味や使い方を理解する
サイトを構成する上でタグがいくつもあります。
タグをしっかりと理解しなければ適切に組むことができません。
<article><seciton><div><h1><a>など、それぞれに対して使い方があります。
意味を理解し使うことができれば、表面側についてはしっかりコーディングができます。

CSSでよくつまづくことが多いですね。
サイトの構成を理解し、CSSタグの理解を行なうことができれば作れるんですが難しいですよね。
私もわかなくて色々模索しながらCSSの修正を行いサイト構築をしていました。
タグの意味や使い方はまた別の会で紹介をいたします。

2.サイトの構造を理解する
私は主にブロック要素ごとに分けて考えております。
基本的なところでは、「ヘッダー」「メイン」「フッター」
「メイン」の中でいくつにわけるのか?
後は「サイド」など、構成が分かれていきます。
全体の構成と1つずつの構成を考えて行うと大体のイメージがわかりますね。

3.コメントアウトを利用する
最初はこのコメントアウトがダサいと思っていて全く使わずにコーディングをしていました。
自分自身がそのコーディングをしているときはじぶんがわかっているからいいが、違う人が実際にコーディングする際は大変だなと思いますね。
コメントアウトの大事さはすぐに痛感しましたが、しっかりとどのブロックなのかどのページで使うのか?明記することで後で発生する運用が非常にわかりやすいので是非使いましょう。

4.ソースコードの書き方及びファイル保存名についてルールを設ける
これも大事ですね。
適当にファイル保存名やid、classの書き方をしてしまうとコーディングにかける時間が1.5倍くらい多く感じます。
後であのidなんだったけ?ってなりますからね。
ファイルの保存についても
・nav_link01
・btn_icon01
など分かりやすい名前でつけるといいと思います。

しばらくは文章を書くことになれるため、詳細ではなく全体の概要みたいにふれることもあります。
詳細が聞きたい方はお問い合わせまたは詳細のBLOGを書くまでお待ちください。

FASTCODING(ファストコーディング)をよろしくお願いします。