。XHTML記述でサイト作成、tableタグの使用方法紹介。
tableタグを使う
前のページで作ったものは文字しか書かれていませんでしたね。 その味気のないページに<table>タグというものを使って枠組みを 作っていきましょう。
次はこのように書き換えてみます。
<?xml version="1.0" encoding="shift_JIS"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="content-type" content="text/html; charset-shift_jis" />
<title>
ここにサイトのタイトルを記入
</title>
</head>
<body>
<h1> タイトル </h1>
<br />
<br />
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="content-type" content="text/html; charset-shift_jis" />
<title>
ここにサイトのタイトルを記入
</title>
</head>
<body>
<h1> タイトル </h1>
<br />
<table>
<tr>
<td>
ここにサイトの紹介文を記入<tr>
<td>
<br />
</td>
</tr>
</table>
<br />
</tr>
</table>
<br />
<table>
<tr>
<td>
<table>
<tr>
<td>
メインメニュー<tr>
<td>
<table>
<tr>
<td>
</td>
</tr>
<td>
トップページ</tr>
<td>
</td>
</tr>
<td>
メニュー1<br /></tr>
<td>
</td>
</tr>
<td>
メニュー2<br /></tr>
<td>
</td>
</tr>
<td>
メニュー3<br /></tr>
<td>
</td>
</tr>
<td>
メニュー4<br /></tr>
<td>
</td>
</tr>
<td>
メニュー5<br /></tr>
<td>
</td>
</tr>
<td>
メニュー6<br /></tr>
<td>
</td>
</tr>
<td>
メニュー7<br /></tr>
<td>
</td>
</tr>
<td>
メニュー8<br /></tr>
<td>
</td>
</tr>
<td>
メニュー9<br /></tr>
<td>
</td>
</tr>
<td>
メニュー10<br /></tr>
<td>
</td>
</tr>
</table>
</tr>
</table>
</td>
<td>
<td>
<table>
<tr>
<td>
小見出し1<br /><tr>
<td>
</td>
</tr>
</table>
記事、説明、宣伝など自由に記入<br /></tr>
</table>
</td>
</tr>
</table>
<br />
</tr>
</table>
<br />
<table>
<tr>
<td>
<tr>
<td>
<table>
<tr>
<td>
小見出し2<br /><tr>
<td>
</td>
</tr>
</table>
宣伝、リンク集など<br /></tr>
</table>
</td>
</tr>
</table>
</body></tr>
</table>
</html>
赤い文字のところが変更点です。今度はたくさんありますね。
<table><tr><td>ばかりでややこしいと思いますが 間違えないように打ち込んでください。
<table>というのは「これから表を作りますよ」という
定義です。
<tr>というのは表の行を表すものです。
<td>というのは表の中のセルを表すものです。簡単に言えば、
表の中に文字などを書き込む場合、最初に<td>を書いてください
という意味です。
</table>は「その表はここで終わりですよ」という定義です。
同様に</tr>は行の終わり、</td>はセルの終わりを意味します。
ブラウザで確認するとこのようになっていると思います。
→このページの見本
同じようになっていれば成功です。
「全然表なんか出来てないじゃん」と思っている方も
いると思います。
確かに表なんか出来ていません。その理由は、表の枠線を表示していないからです。
枠線を表示させるとこんな感じになります。
→このページの見本2
少しは表っぽくなりました。ですが今は枠線が無い状態で進めていきます。
次のページでは、この味気ないサンプルページの体裁を 整えていきましょう。
アフィリエイトを知ろう
アフィリエイトとは??
アフィリエイトの手順
ホームページ作成編
ホームページを作ろう
どんなサイトを作ろうか
作業用フォルダと構造
作業の進め方と設定
XHTMLを覚えよう
サイトの骨組みを作る
tableタグを使う
デザイン自由なCSS
CSSの使い方1
CSSの使い方2
CSSの使い方3
CSSの使い方4
CSSの使い方5
CSSの使い方6
リンクの貼り方
CSSの使い方7
CSSの使い方8
サイトを公開する
アフィリエイト編
ASPって何だろう??
おすすめASP一覧
広告選びのコツ
アクセスアップ編
アクセスアップの必要性
検索エンジンに登録
リンクの量と質を上げる
相互リンクとは??
SEO対策とは??
metaタグの使用
キーワードの最適化
hXタグの使用
サイトの更新