ホームページ作成応援サイト

入門!ホームページNAVI

文の構成

hとpの記述(XHTML共通)

これらのタグはbodyの間から書きます。
hは"見出し"を表しています。h1、h2・・・h6まであり、数字が大きくなるにつれて重要度が下がり文字も小さくなります。 pは"段落"を表しています。

大見出し
 段落
  小見出し
   段落
    小見出し
     段落

ちゃんとした文の構成を意識するようにしましょう。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML4.01 Transitional//EN">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=shift_jis">
<meta http-equiv="description" content="初心者が作るページです。">
<meta http-equiv="keywords" content="wakabagari,若葉狩り">
<title>Wakabagari(若葉狩り)</title>
</head>
<body>
<h1>Wakabagari</h1>
<h2>意味</h2>
<p>
若葉狩りというのは紅葉狩りの若葉バージョンの事です。つまり、若葉を見に行くみたいなのです。ただ、本来の意味は別のところにあります。それは何かというと、みなさんは自動車につける若葉マークを知っていますか?あれって初心者がつけていますよね? ここまでくればわかるでしょう。すべてにおいて初心者なので、HPにくること=若葉狩りにくることみたいになるでしょう?ここがこのサイト名の意味なのです。
</p>
<h2>目的</h2>
<p>
目的はというと、特にありませんが、あえていえば、紅葉マークをつけることでしょうね。自動車だってはじめは若葉マークだけど 1年後にマークははずれ、高齢者になると紅葉マークにななります。それと一緒ですね。
<p>
<address>Copyright(C)2008 Wakabagari all rights reserved.</address>
</body>
</html>

画像の表示

基本的には画像も文字と同じ扱いです。画像を表示させるタグは、img src=""であり、画像の幅や高さを指定したい時は、
<img src="" alt="" width="" height=""> のように記述します。imgタグは空要素であるので、XHTMLを使う場合は、”/”タグで終わらせるようにします。
<img src="" alt="" width="" height="" />なおaltとはカーソルを当てたとき表示される説明文のことです。width、heightは幅と高さになりす。alt,width,heightは書かなくても問題ありません。ただし、海の画像でも山の画像でも、検索ンジンには山であるか海であるかの判別はつきませんので、alt内に「山の写真」や「海」などの文字を入れておくといいでしょう。文字を入れたくない場合でも「alt=""」という感じで空欄にしておくといでしょう。
使える画像形式(拡張子)は、「bmp,gif,jpg,png」があります。jpgは最も軽いですが、写真に向いていますが、絵などには向きませんので、基本的に写真はjpg、それ以外の画像にはgifを用いるといいでしょう。bmpは重過ぎて表示が遅くなるので避けた方がいいでしょう。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML4.01 Transitional//EN">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=shift_jis">
<meta http-equiv="description" content="初心者が作るページです。">
<meta http-equiv="keywords" content="wakabagari,若葉狩り">
<title>Wakabagari(若葉狩り)</title>
</head>
<body>
<img src="sho1.gif" alt="wakabagari" width="280" height="50">
<h1>Wakabagari</h1>
<img src="fuukei1.jpg" alt="風景写真" width="500" height="180">
<h2>意味</h2>
<p>
若葉狩りというのは紅葉狩りの若葉バージョンの事です。つまり、若葉を見に行くみたいなのです。ただ、本来の意味は別のところにあります。それは何かというと、みなさんは自動車につける若葉マークを知っていますか?あれって初心者がつけていますよね? ここまでくればわかるでしょう。すべてにおいて初心者なので、HPにくること=若葉狩りにくることみたいになるでしょう?ここがこのサイト名の意味なのです。
</p>
<h2>目的</h2>
<p>
目的はというと、特にありませんが、あえていえば、紅葉マークをつけることでしょうね。自動車だってはじめは若葉マークだけど 1年後にマークははずれ、高齢者になると紅葉マークにななります。それと一緒ですね。
<p>
<address>Copyright(C)2008 Wakabagari all rights reserved.</address>
</body>
</html>


おすすめWEBサイト 5選

最終更新日:2018/11/12

"
コピーライト