HTML(エイチティーエムエル)とは【Hyper Text Markup Language：ハイパー・テキスト・マークアップ・ランゲージ】の略称で、Webページを作成する為の代表的なマークアップ言語です。マークアップ言語（markup language）とは、文書構造（見出しや段落など）やデザイン（レイアウトやフォントサイズ）に関する指示を文書の中に埋め込んで記述するコンピューター言語の一種です。文書はテキストファイルに記述することが出来ます。公開されているWebページの大半は、このHTMLが使用されています。
HTMLは、文章の中に < と > で挟まれたタグと呼ばれる、特別な文字列を組み込む事で、様々な効果を設定する事が可能です。例えば、テキスト、画像、動画などのリンクを組み込む・テキストを太文字で表示する・音声を組み込む事などが出来ます。HTMLの特徴はハイパーテキストという点です。ハイパーテキストとは、他のドキュメント・文書へのハイパーリンクを設定する事が出来るものです。
1 2 3 4 5 6 7 8 9 10 | <html> <head> <title>タイトルを指定する</title> </head> <body> ここに内容を記述します </body> </html> |
ハイパーリンク
1 | <a href="https://wepicks.net/">wepicks</a> |
また、HTMLを書く為には、特殊なファイルフォーマットは必要なく、テキスト形式ファイルに記述することで表現が可能という点も大きなメリットといえるでしょう。このテキスト形式ファイルを作成する為に必要なのは、テキストエディタです。テキストエディタとは、コンピューターで文字情報のみのファイルを作成、編集、保存すつためのソフトウェアです。代表的なエディタは、Microsoft Windows のメモ帳や、Mac OS X のテキストエディット、UNIXの vi、Emacs などです。
CSS(シーエスエス)とは、【Cascading Style Sheets：カスケーディングスタイルシート】の略称で、Webページのレイアウトや色などのデザインに関する体裁を効率的に定義するためのプログラム言語です。
テキストエディタ（編集用ソフトウェア）などで作成された文書なども含めて、文書の体裁を整える技術全般のことをスタイルシートいい、CSSはスタイルシートという技術の中で使用する言語の1つです。CSS=スタイルシートと考えて頂いて大丈夫です。
Webページにおいて、HTMLは文書の意味や構造を定義します。例えば、見出しや段落などです。一方、CSSではデザインを定義します。レイアウトやフォントの大きさ色などです。HTMLでもデザインに関するタグが用意されていますが、CSSでは装飾能力がさらに強化されています。CSSはHTMLファイル内に直接記述することが出来る他、外部化して別ファイルにCSSを記述することも可能です。CSSが定義されたファイルを外部化してHTMLファイルからCSSファイルを呼び出し、HTMLとCSSで構造と体裁を分離させることが出来ます。
HTMLファイルからCSSファイルを読み込むには「@import」「addimport」「link」などのインポート用HTMLタグを利用するなど、複数の手法が用意されています。インポート機能を利用して読み込まれるファイルは、HTMLファイルが設置されているファイルのドメイン以外に設置されていてもインポートが可能です。また、メディアに合わせてCSSを切り替えることが出来ます。
CSSを利用することで、デザインを一元管理しメディアに合わせてデザイン性に優れたWebページを作成することが出来ます。
2017年12月現在の最新CSSバージョンは、CSS4(Cascading Style Sheets. Level4)ですが、ブラウザの対応が遅れています。css3では、角丸、透過の設定やアニメーションなどLevel2までにない新しい機能が追加されています。CSS4では、matches()擬似クラスなどで冗長的な記述を短く表現することが可能です。
