さて、本日はHTMLの記述方法をご紹介させていただきたいと思います。
まず、HTMLを記述するのに必要なものはテキストで記述できるプログラム。たとえば、windowsであれば、メモ帳などです。office系のソフトはHTMLを記述するのには適しません。Adobe社のドリームウェーバーやIBM社のホームページビルダーなどコーディングをするための専門のプログラムもあります。ミスを軽減するためや、テンプレート化して一気に作成することができますが、簡単なものやタグ(後ほど説明)を覚えてしまえば、これらのソフトはなくても問題ないです。
HTMLの全体構造
HTMLの文章の全体構造は
- HTMLのバージョン情報など
- ヘッダ部分
- ボディ部分
上記3つの部分から構成されています。
1. HTMLのバージョン情報
HTMLのバージョン情報とはこのHTML文章はこのバージョンを基準に制作されていますとブラウザや、変更を行う人に教えるものです。
例)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2. ヘッダ部分
制作者、制作日、タイトル、概要など文章に関する情報が記述されているところです。
例)
<title>奈良/大阪/全国のHP(ホームページ)制作・運営・管理ならHP Factoryへ</title>など
3. ボディ部分
文章のコンテンツ、本文が記述されたところです。
例)
<h2>HP作成について</h2>
<div>
<p><strong> HP FACTORY</strong>は奈良・大阪を拠点に <strong>ホームページのデザイン・制作・管理・運営 ・WEBシステムの制作・ビジネスブログ構築・CMS構築</strong> などを行っています。</p>
<p> <strong>ホームページ</strong>を<strong>XHTML + CSS</strong> のW3Cに準拠した制作を行うことによって、SEO対策を考慮した<strong> WEBデザイン</strong>をご提案いたします。</p>
<p> また、私どもではテンプレートを使っての安売りは一切いたしません。</p>
<p> お客様個々の事情に合わせた<strong>デザイン設計・制作</strong> を行っております。</p>
</div>
タグについて
タグとはHTMLをマークアップするためのプログラムみたいな記述のことです。
HTML文章はまず、XMLというデータを扱うために作られた言語を基にしています。そのため、タグというものを使います。
タグは開始タグと終了タグがあり、開始タグと終了タグではさまれた内容をマークアップします。<>ではさまれた半角英数字が開始タグとなり、</ >ではさまれた半角英数字が終了タグとなります。
例1) <p>初めてのHTML</p>
例1を使いますと、<p></p>が文の段落を意味するタグで「初めてのHTML」をマークアップしていることになります。
さらにこの<p>の中に属性や属性値が追加されることもあります。それは次回以降で説明したいと思います。
ただし、例で上げた形が基本になるのですが、イメージやプログラムを配置するタグなど、はさむべき内容が伴わない場合があり、その際は例2のように記述します。
例2) <img src="img.jpg" alt=”代替テキスト” />
このようにHTMLは記述していくことになります。
コメントする