×

[PR]この広告は3ヶ月以上更新がないため表示されています。
ホームページを更新後24時間以内に表示されなくなります。

ホームページの作り方 >> ホームページ作成編 >> ホームページの完成

ホームページ作成編 14.ホームページの完成!

新しいページは比較的楽に出来ることがわかりましたね
ということはホームページ完成まで、あと一息です!
あなたのホームページを完成させましょう!

ホームページを完成させよう!

ここで作ったあなたのホームページをもとにして、あなただけのすばらしいホームページの世界を広げていきましょう。
きっとオリジナリティあふれたすばらしいホームページが出来ますよ!

1.各ページを作ろう

まずは、CSSファイルに書き加える作業をしましょう。
ちなみに今回のホームページ作りでは、CSSファイルはこれで完成となります。

table {
 width: 400px;
 border-collapse: collapse;
 border:2px #005522 solid;
 background: #ffffff;
 padding: 0px 0px;
}

td {
 border-collapse: collapse;
 border:2px #005522 solid;
 text-align:center;
}

表を作る時のHTMLタグ「table」「td」についての設定です。
詳細は、HTMLを見ながら説明していきますね。

次は、HTMLファイルを作っていくわけですが、そのやり方は、前ページでお話したとおりです。
レイアウトに関係のない箇所、すなわち内容(コンテンツ)の部分だけを書き換えていけばいいんですよね。
更に、例えばメインコンテンツに「話題その3」を加えたければ
「<div class="ao_waku"><h2>〜</h2></div>」の部分をコピーして「話題その2」を構成している一番下の<p>〜</p>の下に貼り付けその下に内容(<p>〜</p>)を作っていけばいいんです。
サブコンテンツも同じようにして、広告欄を作ってみてもいいし「一言コーナー」を作ってみてもいいし・・

ホームページが出来たら色々改造してみてください!

ここでは、目標のホームページが決まっているので、時間短縮のため違うやり方でHTMLソースを作ってしまいます。
まず、サンプルの ホームページ を開いていただいて、ソースを表示させて下さい。
画面の任意の場所(画像の上以外)で右クリック→「ソースの表示」でしたよね。

ソース(メモ帳)が出てきたら、左上の「編集(E)」→「すべて選択(A)」をクリックすると反転文字になります。反転文字の任意の場所で右クリック→「コピー」をクリック

ここで、このメモ帳は消してしまってかまいません。
次に、あなたが先ほど作った「page2」のソース(メモ帳)を出してください。

同じように「編集(E)」→「すべて選択(A)」反転文字の任意の場所で右クリック→「貼り付け」をクリック
上書き保存をして「page2.html」は、できました。

但しこの時、ページの一番下に広告が表示されてしまいます。
これは、プロバイダーの広告で自動的に挿入されているものです。
気になる方は、HTMLファイルの</head>直前の
<link rel="stylesheet" type="text/css" href="http://img.shinobi.jp/tadaima/tdftad.css" />の部分と
</body>直前の
<div class="tdftdiv">〜</div>を削除してください。

前ページとこのページを参考にして、「page2.html」と、同じようにあなたの「homepage」フォルダに「link.html」を作ってみて下さい。

かなり楽に作っちゃいましたが、あなたのオリジナルのホームページを作る時は、前ページの方法で作っていきましょう!

最後に「page2.html」に出てきた表(table)の話を少しだけ・・・

2.tableについて

表を表示する時に<table>タグを使用します。
「table」「tr(行)」「td(列)」が主な表に構成タグです。
CSSでは、tableで全体の設定を tdでそれぞれの枠の設定をしています。 「border-collapse: collapse;」は、「それぞれの境界線は重なり合わす」という設定です。
境界線を重ねない場合は、××の部分が「separate」となります。
<table>タグは、その気になれば表を作る以外にもページのレイアウトとしても使用することが出来ます。
しかし、HTMLソースが複雑になるうえにSEO的にもあまり好ましくないそうです。
やはり、レイアウトはCSSに任せておいたほうがいいと思います。

3.ホームページの内容について

これで一応目標のホームページ作りが完成しました。
よかったよかった!感無量ですね!
・・・ってそれほどでもないか

まあともかくこれまで、勉強(?)してきたのは、どちらかというとホームページ作りの技術的な話です。
ホームページの価値のほとんどは、その内容によって決まってきます。
あなたのホームページのテーマは何でしょうか?
本当は、それを考えるのが一番大変なのかもしれませんね!
一生懸命考えてすばらしいホームページを作ってみて下さい!!

マグカップM ■トリさん■  ホワイト/ブラウン

サイズ:約
 口径78o×高さ90o
重 量:約260g
全容量:約300t
材 質:陶器


<送料>
ゆうパック 一律500円
沖縄県1000円

例えばあなたが何かについて調べたくて、ホームページを探す時まずどうするでしょうか?おそらく「google」や「Yahoo」等の大手検索エンジンの検索窓にその調べたいことを入力して表示されたホームページにたどり着くというのが一番多いのではないでしょうか。ホームページを作ったら多くの人に見てもらいたいというのは、万人の共通した願いであることは言うまでもありませんね!検索エンジンに自分の作ったホームページのテーマを入力した時に最初の方に自分のホームページが載っていたらこんなにうれしいことはありませんね。他にもホームページをより多くの人に見てもらう手段としてリンクという手があります。例えばこのホームページでも「リンク」のページを設けてこのホームページを作成するに当って参考にさせていただいたサイトや壁紙や写真を使わせていただいた素材屋さん等の紹介をしています。このホームページを見て「この素材いいなぁ」とか「この壁紙いいな」と思われた方はリンクのページからそのサイトを見に行くことになりますよね。このようにたくさんの他のホームページからリンクをしてもらうとより多くの人にあなたのホームページを見てもらえるってことになりますね!又、お互いにリンクをしあう「相互リンク」や色々な検索エンジンに登録するのもいいかもしれませんね!


 
別窓で開く便利な検索窓です。どうぞご利用下さい!
カスタム検索