HTMLページを作る
ここではHTMLページを作成するための簡単なノウハウをご紹介しています。
1.HTMLを作成するためのエディタを用意する
まずはHTML言語を書くためのソフトを用意しないといけません。 ソフトには現在大きく分けて下記の3パターンの種類があります。 それぞれ使いやすさ、入手のしやすさが違いますので個人でお選びいただければと思います。
1.有料ソフトの購入
ホームページビルダーシリーズに代表されるホームページ作成用ソフト。
無償ソフトもあるのに大ヒットを記録しているのはやはり使い勝手がよく、簡単に作れるからでしょう。
どうしても無償でないと嫌だという方以外はこの方法がもっとも無難だといえます。
<メリット>
・フリー素材、テンプレート、HTMLタグ入力支援等、とにかく簡単、きれいにページを作成可能
・自動修正機能が付いているので失敗も少ない
・ファイル転送機能まで付いている
<デメリット>
・有償である
<代表的なソフト>
・ホームページビルダー
2.無償ソフトのダウンロード
HTML言語を書くために開発されたフリーソフトはたくさんネット上にあります。
タグの色分け、基本的なタグの挿入が出来ることがテキストエディタとの違いです。
<メリット>
・無償である
・タグの色分けがされていて見やすい
・ソフト自体の容量が軽い
・基本的な部分以外を自分で作成するため、HTMLに対する知識が付く
<デメリット>
・基本的なタグ以外が用意されていないため自分で作る要素が多い
・ファイル転送を自分でしなくてはいけない
<代表的なソフト>
・HeTeMuLuCreator
3.テキストエディタの使用
通常パソコンには購入時からWordやメモ帳などのテキストエディタがついています。
そのようなテキストエディタでもHTMLファイルは作成可能です。
<メリット>
・パソコン購入後即作成可能
<デメリット>
・HTMLページ作成用に作られていないため全てを自分でやらなければならない
<代表的なソフト>
・メモ帳
2.HTML言語を書く
テキストエディタを入手したらいよいよHTMLを記入していきます。 こちらでは最初の導入部分から簡単なHTMLのタグをご紹介しております。
1.HTMLページを作る
まずはHTMLページを作らなくてはなりません。 作り方は非常に簡単で拡張子を.htm(トップページのみ)か.htmlにすればよいです。
2.形式的な導入部分
HTMLを書く際には通常のタグを記載する前に必ず記載しなくてはいけない部分があります。
それが下記の部分です。簡単に導入したい場合はしたの完成部分をそのまま流用していただいても問題無しです。
<タグ紹介>
タグ名 | 要素意味 | タグ説明 |
html | 最上位要素 | 全ての要素をこの要素の間に記述してHTMLファイルを構成する。 |
head | 文書情報 | 実際に表示されないがそのHTML文書に関する情報を記述する部分。 |
meta | メタ情報 | メタデータを指定するための要素。 |
link | 関連ファイル指定 | head要素の内でのみ使用されるその文書に関連する別の文書とその関係を示す。 |
title | 文書タイトル | ウインドのタイトルバー等に表示されるタイトル。 |
body | 文書本体 | HTML文書の本体となる要素を記載する部分。 |
3.具体的なHTML表示部分
1.の通り実際に表示される部分は「body」要素内に記述した部分のみとなる。
その中に記載できるタグ要素は100種以上に及ぶ。その全てを知らずともサイトは構築できます。
このサイトでは最小限知っておけばサイトを構築できるタグ要素について紹介いたします。
<タグ紹介>
タグ名 | 要素意味 | タグ説明 |
h1〜h6 | 見出し | h1がもっとも重要な見出しを表し、順次h2,h3…h6と続きます。 |
p | 段落 | 文章を段落としてまとめる要素。 |
br | 改行 | 記述した部分で改行される要素。 |
hr | 横罫線 | 記述した部分に横罫線が表示される要素。 |
img | 画像 | 指定した位置に画像を配置する要素。 |
a | アンカー | 記述部分をリンクのアンカーとする要素。要はリンクです。 |
ul | 番号無しリスト | 番号無しのリストの範囲を示す要素。 |
ol | 番号付きリスト | 各項目の先頭に連番が付くリストの範囲を示す要素。 |
li | リスト項目 | ul、olの各項目を表示する要素。 |
dl | 定義リスト | 定義リストの範囲を示す要素。定義リストとはdtとddからなるリスト。 |
dt | 定義する用語 | 定義リストの定義する用語を示す要素。 |
dd | 用語の定義(説明) | dt要素で示された用語に対する説明を示す要素。 |
table | 表 | 表の範囲を示す要素。 |
caption | 表タイトル | 表に対してタイトルや説明をつける要素。 |
tr | 横方向の1列 | 表の横1列分のセルを含む要素。横1列分に対して影響力を持つ。 |
th | ヘッダセル | セルを表す要素。その中でも見出しを現すセルに使用。 |
td | データセル | セルを現す要素。 |