Web制作

1 HTML, CSS, JavaScript

情報を公開するにはHTMLでデータを記述し、見栄えのよいコンテンツとするにはデータをCSSで装飾する。 さらにイベント処理など動的なコンテンツとするにはクライアントサイド技術であるJavaScript言語の習得が必要となる。

2 HTMLとは

文書中のデータが文書の構成要素として何であるかを示すための言語がHTML(HyperText Markup Language)である。 また、文書中のデータにリンクを張って関連項目をすばやく表示させることが出来る。

3 CSSとは

文書中の構成要素を実際どのように表示するかを指定するのがCSS(Cascading Style Sheet)である。 具体的には構成要素のそれぞれに対して文字フォント、サイズ、色、枠、表示位置などのプロパティを指定する。

4 HTMLとCSSの分離

従来はHTMLの要素名の中にスタイルを記述していたが、コンテンツが大きくなるとスタイルの一括変更が大変な作業となる。 また、文書中での構成要素としての働きはその表示結果とは無関係であることから、HTMLとCSSは本来独立に作成されるべきものである。 したがって、最近では装飾をCSSとしてHTMLから分離して記述するようになってきた。

5 JavaScriptとは

クライアントサイドであるブラウザ上でインタープリタ言語として実行される。 制御構造はC言語やJavaと同じであるが変数の型については融通性がある。 フォームから入力された値をボタンやマウスのイベントによって処理することができる。 DOMDocument Object Model)をJavaScript言語によって操作するプログラミングが中心となる。

6 必須構成要素

コンテンツのページは以下の構成要素からなり、これらが必須の構成要素となる。 DOCTYPEはHTMLの文法規則を明示するためで何種類かあるがStrictを選ぶ。
<html>~</html>がHTML文書とみなされる。
<head>~</head>にはこの文書に含まれる文書形式と文字コードを明記する。
HTMLの他にCSSを含むときは次を追加記述する。

  <meta http-equiv="Content-Style-Type" content="text/css">

さらにJavaScriptを含むときは次を追加記述する。

  <meta http-equiv="Content-Script-Type" content="text/javascript">

<title>~</title>にはページのタイトルを記述する。
<body>~</body>がページの本体であり、ここに文書を記載する。

  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
  <html lang="ja">
  <head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <title>Webコンテンツの制作</title>
  </head>
  <body>
  ......
  </body>
  </html>

7 代表的な構成要素

8 代表的なプロパティ