- HOME
- ホームページ制作支援
- ホームページについて
ホームページについて
ホームページという言葉は、正しくは、インターネットに接続し、ブラウザで最初に表示されるWebページ、または、ブラウザの「ホーム」ボタンをクリックした時に表示されるWebページのことです。しかし、一般的には、ブラウザで表示される無数のWebページを指すことが慣例となっています。（入り口にあたるWebページについてはトップページ・スタートページなどと区別することもあります。）
当サイトではそれに倣って、Webページ全般のことをホームページ（特に但し書きがない限り）としています。
１）コンテンツ
ホームページの中身をコンテンツと言います。
２）ホームページを構成するための文書(X)HTML
ホームページはリンクによって、別々のページ同士が結び付けられていてます。それをハイパーテキストと言います。HTML（HyperText Markup Language）は、このハイパーテキストを記述する言語の一種です。ホームページは、このHTMLで記述されています。それをHTML文書（あるいは HTMLファイル、HTMLソース）と呼びます。
いっぽう、XHTMLはXMLの応用言語です。
３）要素
要素とは、HTML文書内の様々な構成部品のことを指しています。見出しを表すもの、段落を表すもの、画像を挿入するもの、…これらは全てが要素の一つです。
文書の中にはこれらの要素が複数含まれるので、「どの部分からどの部分まで」が一つの要素なのか、明確に記述する必要があります。このことをマークアップと呼び、タグといいます。
４）開始タグと終了タグ
マークアップに使うタグで、「どの部分からどの部分まで」を表すために、「開始タグ」で書き始めて、「終了タグ」で閉じるのがHTMLの書き方です。開始タグの書き方は「<p>」のように要素名をカッコでくくります。さらに、終了タグは「</p>」のように同じ要素名の前に「/」スラッシュをつけてカッコでくくります。
ただし、タグの中には終了タグが必要でなかったり、省略できる要素もあります。例えば、画像タグの<img>や改行タグ<br>などがそうです。
かたや、XHTMLは開始タグと終了タグは省略しません。また、小文字で記述します。
<img />や<br />というような書き方をします。
５）タグの記述例
<h1>見出し1</h1>、<ul><li>リスト</li></ul>、<strong>強調</strong>
６）ブロックレベル要素とインライン要素
HTML内に記述する様々な要素は大きく分けて「ブロックレベル要素」と「インライン要素」に分かれます。同じ要素でも働きが異なります。
６-1）ブロックレベル要素
ブロックレベル要素は、見出しや段落、表など、文書の骨格となる部品（ブロック）要素のことで、その名の通りブロック（一つのまとまった単位）で表示されます。また、ブロックレベル要素は、<body>内に直接記述することができ、その中には、インライン要素も含めてブロックレベル要素（全てではありませんが）も含めることができます。一般的にその前後は改行されます。
| ブロックレベル要素名 | 働き |
|---|---|
| address | 連絡先 |
| blockquote | 引用 |
| center | 中央揃え |
| div | 複数行グループ（汎用レベル要素） |
| dl | 説明付き定義リスト |
| fieldset | フィールドセット |
| form | 入力フォーム |
| hx（x=1〜6） | 見出し |
| hr | 水平線（区切り線） |
| ol | 番号付きリスト |
| p | 段落 |
| pre | フォーマット済みテキスト |
| table | 表（テーブル） |
| ul | 通常リスト |
６-2）インライン要素
インライン要素はブロックレベル要素の一部に対して、文字の強調やリンクなどの役割や機能を設定するための要素です。インライン要素の中には、ほかのインライン要素を含むことはできますが、ブロックレベル要素を含むことはできません。行も改行されません。
| インライン要素名 | 働き |
|---|---|
| a | リンク |
| abbr | 略語 |
| acronym | 略語（頭文字） |
| applet | Javaアプレット挿入 |
| basefont | 基本フォント |
| b | 太字 |
| big | 大きめの文字 |
| br | 改行 |
| button | ボタン |
| cite | 出典元 |
| code | プログラムコード |
| dfn | 定義 |
| em | 強調 |
| font | フォント |
| i | 斜体 |
| iframe | インラインフレーム |
| img | 画像（イメージ） |
| input | 入力フォーム |
| kbd | キーボード入力 |
| label | フォームラベル |
| object | オブジェクト挿入 |
| q | 引用 |
| s | 取消線 |
| samp | サンプル（例） |
| select | 複数項目選択スイッチ |
| small | 小さめの文字 |
| span | 1行グループ（汎用インライン要素） |
| strike | 取消線 |
| strong | 強い強調 |
| sub | 下付き文字 |
| sup | 上付文字 |
| textarea | 複数行テキストフォーム |
| tt | 等幅フォント |
| u | 下線 |
| var | 変数、引数（ひきすう） |
６-3）置き換え要素と非置き換え要素
インライン要素の中で、さらに置き換え要素と非置き換え要素に分かれます。インライン要素のほとんどは非置き換え要素ですが、表示される時に要素自体が、特定のものに置き換えられるような種類の要素が置き換え要素です。
| 置き換え要素名 | 働き |
|---|---|
| img | 画像（イメージ） |
| input | 入力フォーム |
| object | オブジェクト挿入 |
| select | 複数項目選択スイッチ |
| textarea | 複数行テキストフォーム |
７）属性について
属性は、要素の開始タグの中に指定して、その要素の性質や特性を示すために使用されます。基本的には「属性＝”値”」の形式で表し、スペースで区切って複数指定することもできます。指定順序は特に問いません。大文字・小文字は、今後の流れ（XHTMLでの構築）を考えて小文字に統一したほうが良いでしょう。
８）絶対URLと相対URL
例えば、ある部分をリンクさせる場合、リンク先のHTMLファイルの位置を指定する必要があります。HTMLではその位置をURLで指定しますが、それには２通りの方法があります。
絶対URL＝これはブラウザでページを見ているときに、アドレスバーに表示されている「http://」で始まる指定方法です。
相対URL＝同じサイト内で参照を行う場合、同じディスク上のファイルを参照するときに利用される形式です。この場合、現在のファイルの位置を基準としてディレクトリ（フォルダ）の階層の上下を示すことで位置を示します。
９）ホームページ公開の流れ
レンタルサーバ（ホスティング）へホームページ開設の依頼をします。（事前に、ドメインの取得・管理はご自分でされるか、ホスティングに依頼するか決めておきます。）
ホスティングからWWWサーバの設定内容が通知されます。
FTPソフト（転送機能のあるソフト）の設定を行い、ホスティングのWWWサーバへファイルを転送します。サーバに転送することをアップロード、パソコンに転送することをダウンロードと言います。
ブラウザから公開したホームページを指定したURLで確認します。
