PAGE TOP ▲

大副業時代を生き残るためのブログ。切り売り労働からの脱却、少しでも収入をアップしたい方へ。

TOP タグ打ちとコーディングの違いについて。

タグ打ちとコーディングの違いについて。

タグとは何か。。。

まずは『タグ』とは何だろう?という所から説明したいと思います。タグとはHTMLで使用するもので、例えば「こんにちは!」という文字をそのページのタイトルにしたい時は・・・

<title>こんにちは!</title>

といった感じで<title>と</title>で囲う事で、このページのタイトルは「こんにちは」なんだな〜とブラウザが理解します。

<title>と</title>がタグと言います。ここで使用されている「<title>」を開始タグ、「</title>」を終了タグといいこれをまとめてタグと呼びます。

タグ打ちとは自分でタグを打つ事

上記で説明したタグを自分で打つ事がタグ打ち

読んだままの事ですが、タグを自分で打たなくても自動で生成する事も出来ます。有名な所で言うと「ホームページビルダー」や「ドリームウィーバー」などのホームページ制作ソフトがその役割をしてくれます。

自動で生成してくれるのであれば、わざわざ自分でタグ打ちをしなくてもホームページ制作ソフトを買ってしまったほうが効率が良いのではと考えられる方もいると思います。これには一長一短があり、ホームページ制作ソフトを使えばタグ打ちの知識がなくても気軽にホームページを制作することが出来ます。但しこれは趣味レベルのお話。

実際の現場レベルでは、クライアントから持ち込まれたHTMLを調整する場合に直接打たなくてはいけない場合が数多くあります。上手く表示できていない場合は、どこが原因かをタグを見ながら探す場合もあります。

圧倒的に作業が早いのはタグ打ちです。

ホームページ制作ソフトを使えば、タグ打ちしなくても簡単にホームページが作れるのですが、作業効率を考えるとタグ打ちが出来たほうが圧倒的に早いです。

例えるならば、外国人と話す時に通訳を付けるか自分で直接話すかの違いです。日本語で話したことを英語に訳して話してもらうという順序と同じです。何度も何度も行うことですので直接、翻訳してもらっていたらきりがありません。

タグ打ちするということも同じです。直接タグ打ちする事でかなりの時間を軽減でき、余計なタグを発生するリスクも軽減できます。

コーディングとはタグ打ちで組み立てること

コーディングとはデザインした画像やテキストをHTMLのタグで囲みながら組み立てる事を言います。「タグ打ち」はパーツになりその集まりが「コーディング」といった事になるので全くの別の存在になります。

私はコーディングを「Brackets」というAdobeのフリーソフトを使用しています。人気があるものでは「Sublime Text」がありますが、Adobeから出しているソフトなので長い目で見た時に使い続けられるのではという考えで使用しています。

タグ打ちというのも実際に一文字ずつ打っていくと大変です。そこで1文字入れるだけで予測変換してくれる機能があったり、「emmet」というオプションを追加することで劇的に早くすることが可能です。

まとめ

「タグ打ち」と「コーディング」の違いがわかりましたでしょうか?

大きな会社になると分業制を採用している所が多いのでWebデザイナーと言えばPhotoshopでの制作までを行いコーディングはコーダーが行う場合もあります。ですがWebデザイナーとして独立するには「タグ打ちでコーディングするのは最低条件」になります。

スキルを身につけるための時間はかかりますが、一度理解してしまえばずっと使う技術です。残念なが「一生」使える技術ではないと思いますが、独学で覚えることで分からないものを習得するための技術も身につけることが出来ます。

今までのHTMLから、いまではHTML5というものが登場していますが、HTMLを身に着けていれば途中から学ぶことが出来ます。これまでの知識があるので新しくなった所だけ学べば済みます。その他にCSSも理解しなくてはいけませんし、Wordpressで使われてるPHPなども理解する必要があります。

今ではドットインストールという無料で技術を学べるサイトがあるので、まずはドットインストールで勉強し、分からない部分を詳しい人に聞いたり本などで解決していく方法もあります。

辞書代わりに一冊あると困ったときに役に立つ本です。

考え方の関連記事一覧