Ｈ Ｔ Ｍ Ｌ の 基 礎 知 識 |
★ このサイトの Ｌ ｉ ｎ ｋです。。。ぜ〜んぶ見たい方はＨＯＭＥへ、ＨＴＭＬだけｏｒスタイルシートだけの方は各リンクをクリックしてね♪
☆ ＨＴＭＬの本を参考にしています
お 知 ら せ ・・・ 07/11/13 ページの一番下から、この表の一番上の行にジャンプするようにしました♪
|
内 容 |
ポイント |
|
|
★ ＨＴＭＬの意味 |
Ｗｅｂページを作るための記述言語 ≪ Hyper Text Markup Language ≫の頭文字 |
|
|
★ ＨＴＭＬの特徴 |
最大の特徴は、「 ハイパーリンク 」 別のページや指定箇所を表示させる（ジャンプ）機能 |
|
|
★ 決めているのは誰？ |
多くの企業や大学などが参加しているＷ３Ｃ（ World Wide Web Consortium ）という機関で仕様が決められていて、「仕様書」というのが公開されているそうです ブラウザの対応するタグを決めているのは、開発元のMicrosoft社やネットスケープ社などで、ブラウザの種類やバージョンによって対応しているタグが違い、仕様書で決められているタグに全部対応しているわけではないそうです |
|
|
★ 記述をするツール |
必要なものは、「テキストエディタ」のみ Ｗｉｎｄｏｗｓならば「メモ帳」などで、フリーウェアで十分 メモ帳に記述し、保存する時にファイル名の後ろに「 ．ｈｔｍｌ」という拡張子を付けると、Ｗｅｂページとして保存されます |
|
|
★ タグの基本 この基本を覚えて、参考書を読んでいても、少しは理解できるようになりました |
● ＜ と ＞ ではさんで記述した英数字 ● 基本的に、半角（１バイト）の英数字と記号で記述 ● 開始タグと終了タグが対（つい）になっている ● 終了タグは、適用範囲の指定が必要ない場合は、省かれます ● 内容は、英単語、または単語の頭文字 ● タグの中身 ＜ 要素 属性 ＝ ”属性値 ”＞ ※ 要素と（ 属性＋属性値 ）の間に、半角スペースを入れる その後に続ける（ 属性＋属性値 ）ごとに、半角スペース |
※ 終了タグは、開始タグの前に「／」スラッシュを付けたもの |
|
★ 要素・属性・属性値 |
◎ 要 素 ・・・ 主なテーマとなるもの ◎ 属 性 ・・・ オプション的なもの ◎ 属 性 値 ・・・ オプションの具体的な数値
例えば、水平線を引く場合 要 素 ・・・ 水平線を挿入するという、主なテーマ ＜ ＨＲ ＞ 属 性 ・・・ 線の幅（長さ）＜ ＷＩＤＴＨ ＞ 属 性 値 ・・・その線の長さをどのくらいにするかという具体的な数値 画面に対しての比率を「 ７０％ 」など ＜ ＨＲ ＷＩＤＴＨ ＝ ”７０ ”＞ ※ その他にも、属性として、位置、線の太さ、線の色などをオプションで付け加え、それぞれの属性値として、位置は真ん中、線の太さは３ピクセル、色は赤などと、具体的に決めて記述していきます |
|
|
★ 名前の付け方 （ ファイルとフォルダ ） |
Ｗｅｂページで表示されるファイルは、ファイル名とそのファイルの アドレス（ ＵＲＬ・ファイルのある場所 ）で管理されています 名前や保存しておくフォルダは、極力あとから変更しないようにしましょう！ ※ ファイルの名前や保存しているフォルダを変更すると、 それに関連するページのその部分を全部修正しなければなりません |
|
|
◎ 付け方の基本 |
・ 英数字の小文字 （ Ａ ⇒ ａ ） ・ 半角 （１バイト）の、英数字と記号 ※ 全角（２バイト）、半角カナはダメ！ ・ スペースは、入れない ・ タグの記述に使う記号は、使えない ・ 必ず、拡張子を付ける （例えば、．ｈｔｍｌ、．ｇｉｆ など） |
拡張子とは？
ファイル名の最後に付けるファイル形式
．（ピリオド）＋３〜４文字の半角英数字
|
|
★ 階 層 |
「 階 層 」って、私も何のことか分からなかったんだけど、 例えば、Ｗｉｎｄｏｗｓの「エクスプローラ」を開くと、１つのフォルダの下にちょっと右側に引っ込んで表示されるフォルダがあるよね さらにその下に・・・という、この仕組みのことなんだって
これは、Ｗｅｂページの管理でも、ファイルの置いておく場所を決める時に必要な仕組みです
ＴＯＰページ（ｉｎｄｅｘ．ｈｔｍｌ）を頂点にして、ピラミッド型の構造になっていて ＴＯＰの下に、主となるコンテンツが何個かあって、その下にそれぞれの関連するページを置く、という形になります
|
|
|
★ パ ス |
ファイルのある場所（ＵＲＬ）を指定する場合の、使用される場所の表し方 ※ パ ス （Ｐａｔｈ） ・・・ 「 通 路 」という意味で、階層構造になっているファイルの場所を示す方法です |
|
|
|
Ｗｉｎｄｏｗｓでは、階層の区切りに「 ￥ 」を使いますが、インターネット上では、「 ／ 」（スラッシュ）を使って階層を区切っています
◎ 例えば、私のホームページのアドレスでいうと 「 テキスト編・実践ページ 」というページのアドレスは http://www.geocities.jp/cocoa_py/html-study1/jissen-text.html です
「 http://www.geocities.jp/cocoa_py 」がＴＯＰページのある場所で 「 /html-study1/jissen-text 」というのは、１段階下の階層です ＴＯＰページの１段階下の「ｈｔｍｌ−ｓｔｕｄｙ」というフォルダに このページ（ jissen-text ）があることになります |
|
|
★ ホームページ作成 |
１．テーマは何でも良いのですが、こういうホームページにしたいという 「目標」を決めましょう ※ 自分の趣味を皆に見てもらいたいとか、商品を売るためとか これが決まってないと、どんなコンテンツを用意するかなど ホームページ全体の構成も考えることができません |
|
|
|
２．ページの構成や、いろいろなルールを充分に考えておきます ファイルやフォルダの名前のつけ方 更新のたびに増えていくページをどこに保存するかなど
ＴＯＰページを頂点としたピラミッド型の構成を考えて 紙などに書いてみるといいですね
◎ ＴＯＰページ アクセスした時に最初に目に飛び込んでくるページなので、 その印象で、他のページも見てもらえるか、 すぐ「閉じる」ボタンを押されてしまうかが決まるのではないかと・・・ |
これを書いている私のホームページはどうなんだ・・・と言われると、自信がありません ごめんなさい (+_+) |
|
|
３．ホームページ全体の構成とそれぞれのページの内容を決めたら ここからＨＴＭＬの作業に入ります
ホームページ作成ソフトを使うも良し、タグを記述して作るも良し 要は、作る過程ではなく、どれだけ自分の伝えたい事をホームページ上で 表現できるか・・・ですよね ※ 私も最初は、タグを覚えてテキストエディタで記述してホームページを作ろうと思ったのですが、そんなことしてたら、いつまで経っても公開できそうにないので、ジオクリエーターとアドバンストＨＴＭＬエディタを利用させていただきました |
|
|
|
|
|
|
|
