ウェブサイトを構築するということはHTMLファイルを制作することである。ここでは基本的なHTMLファイルの制作、管理方法、スタイルシートあるいはテーブルやフレームによるフォーマット制作、スクリプト制作などについて解説する。
ウェブブラウザでの表示の注意点
ウェブサイト構築においては同じHTMLのファイルであっても、異なるウェブブラウザで閲覧すると、全く同一に表示されるとは限らない。
ウェブブラウザの役割は、HTMLファイルによって支持されていることを解釈して、ウェブブラウザの画面い表示することである。ところが、ウェブブラウザの仕様によって、微妙にHTMLの解釈が異なる場合があるので、注意がひつようである。
また、プラグインを利用した表現の場合、ウェブブラウザによっては予定通りの動きが得られないこともある。このため、ウェブページ制作の過程では、制作時の環境とは異なるブラウザでも問題なく表示されるかどうかをテストしておくことが望ましい。また、OSによって表示の違いがあるので、異なるOSでのテストも行っておくべきである。
ウェブサイト構築の手順
ウェブページはテキストエディタや専用のソフトウェアで制作する。
・ウェブサイト構築に必要なもの
素材制作では、素材に性質や形式ごとにそれぞれソフトウェアが必要になるが、ウェブjページそのものはテキストエディタだけでも制作できる。また、HTMLエディタあるいはウェブページ制作ソフトなどと呼ばれる専用ソフトもあり、ラスタ形式やベクタ形式の画像の制作、編集機能などが装備されているものもある。
テキストエディタによるHTMLファイル制作では表示内容や動作内容をいちいちウェブブラウザで確認しなければならなkが、HTMLエディタの多くは、GUIによるウェブページ制作が可能になっている。ただし、HTMLエディタの表示内容とウェブブラウザでの表示内容は微妙に異なっていることも少なくないので、やはりウェブブラウザでの表示内容や動作内容の確認も必要になる。
ウェブサイト構築の流れは、おおよそ次のようになる。必ずしも順番通りには作業が進まないことも少なくないが、常にコンセプトや設計の具体化を目標として、デザインを行っていくことが重要である。
タグの記述とファイルの管理HTMLファイルは原則としてマークアップ言語であるHTMLで文書構造を記述し、スタイルシートによって体裁を支持する。ここではHTMLの記述方法を簡単に解説しておく。HTMLではタグによって様々な指示を記述する。
ファイルの管理
ウェブサイトの制作時には自分のコンピュータのハードディスクの中に各種ファイルを保存しておき、完成後に各種ファイルをウェブサーバーにアップロードする。ウェブサイトを開いた時に最初に表示されるHTMLファイルはウェブサーバーごとに決められていて、たいていはindex.HTMLあるいはindex.HTMとなっている。それ以外のHTMLファイルには任意の名前をつけられる。
画像などの素材ファイルはサブディレクトリに入れて管理しておくと良い。小規模なウェブサイトであれば、素材ファイルもHTMLファイルも同じディレクトリで管理しても構わないが、ある程度以上の規模のウェブサイトでは、素材ファイルはサブディレクトリに入れておく方が管理が容易である。この時、例えばHTMLでの画像表示指定であれば、＜img src=“images/img01.jpg”＞のように素材ファイルのパスを相対パスで指定する。
タグによるHTMLファイルの記述
HTMLではタグを ＜html＞のように半角不等号で囲み、＜html＞が指示の開始を表し、＜/html＞が指示の終了を表す。＜html＞はHTMLファイルであることを表すタグなので、最初に＜html＞が記述され、最後に＜/html＞が記述される。それぞれのタグに対して終了が宣言されている。このようにタグは入れ子構造として記述する。
＜head＞によって以下がヘッダであることを宣言し、ヘッダの内容としてのタイトルが＜title＞によって指示されている。ここで指示されたタイトル内容はウェブブラウザのタイトルバーに表示される。＜body＞によって以下がボディであることを宣言し、ボディ内容を記述していく。＜body＞のように、不等号の中で属性も指示できるタグもある。＜hr＞では水平線を表示し、＜center＞はその後の記述の中央揃えを指示している。なお、画像などの表示には＜img src=“画像のURL”＞リンクの設定には＜a href=“リンク先のURL”＞～＜/a＞を使う。