Webサイトを作るときに、重要なプログラミング言語がいくつかあります。その中でもHTMLCSSは必須のプログラミング言語です。また、Webページの表現力や機能を高めるために利用されるJavaScriptも押さえておくと、Webデザインの幅が広がります。今回はコーディング初心者の方のために、HTMLやCSS、JavaScriptの役割や特徴について取り上げます。

 

HTMLの役割

HTML(HyperText Markup Language)は、Web上の文章を記述するためのマークアップ言語です。HTMLに適切な記述を行うことにより、テキストはもちろん、画像や音声、動画をWebページに表示させることができます。HTMLタグで画像や音声や動画のファイルが格納されている場所を示すことで、その場所を参照してWebサイトに表示することができるのです。

HTMLタグは、「<開始タグ>」と「</終了タグ>」で内容を囲んで記述します。例えば、「<a href=”リンク先URL”></a>」と記述すれば、リンクをクリックしたユーザーをリンク先にジャンプさせることができます。

また、HTMLと関連性のある言語にXHTML(Extensible HyperText Markup Language)があります。HTMLは記載方法が比較的自由であるメリットを持つ一方、同じ内容に対して複数の記述方法が許されるため、解釈にあいまいさが生まれるデメリットがありました。

XHTMLは文法が厳密なXML(Extensible Markup Language)をベースにしているため、より正確なコーディングが行えます。

 

CSSの役割

CSSの役割
HTMLがWebページに表示される実際のテキストや画像を記述するのに対し、CSS(Cascading Style Sheet)はテキストや画像の見栄えを良くするために、文字の大きさを変えたり、表示位置を調整したり、色を設定したりする役割を持っています。

HTMLにもレイアウト用のタグが存在し、以前はそのようなタグを使ってレイアウトを記述しているHTMLファイルも多くありました。しかし、Webコンテンツの多様化により、すべてのレイアウト情報をHTMLに記述するとソースコードが複雑になり、コーディングに手間がかかります。現在ではレイアウトに関する情報はCSSにまとめて記述するケースが増え、「Webページの文書構造はHTML、デザインはCSSで指定する」ことが一般的です。

また、CSSは複数デバイスに対応させるコンテンツの作成に便利です。PCとモバイルの両方に適したレイアウトが必要な場合、各端末用のCSSを用意すれば、単一のHTMLファイルでデバイスに合わせて表示を切り替えることが可能です。

 

JavaScriptの役割

JavaScriptの役割
JavaScriptを使うと、HTMLやCSSでは表現できない機能をWebコンテンツに与えられます

例えば、項目を入力してボタンを押すことで、簡単な計算結果を画面に表示できます。会員登録フォームに情報を入力して「登録」ボタンを押したときに、未記入の欄がありエラーメッセージが出た経験はありませんか。その機能を実現しているのがJavaScriptです。

 

まとめ

Webコンテンツの多様化によって、Webページに求められる機能は幅広くなっています。HTMLやCSS、JavaScriptのコーディング技術が今後一層重視されるため、HTMLやCSS、JavaScriptの役割を理解し、実際に利用できるように習熟しておくことをおすすめします。

さらに学ぶためには?
デジハリ・オンラインスクールのオススメ講座