インターネット初心者のページ、ウェブサイト製作、SEOまで
http://nario.oiran.org/
-MENU-
-MainWindow-

基本編

さて、初心者の為のウェブサイト講座も超基本編が終わりましたがHTMLについてはこれで50%は学んだと思って間違いありません。
エー!?と思われるかもしれませんが本当です。では残り30%を仕上げましょう。
50%終わったなら残りは50%じゃないの?と思われるかもしれませんがHTMLについては今の所80%理解していれば問題ないと思われます。
残りの20%はCSS(カスケーディングスタイルシート)編で学んで行きたいと思います。
前回は本文を記述していなかったので今回は本文の記述方法です。
本文の記述方法と言っても難しいことはありません。<head>〜</head>の後ろに
<body>本文</body>
と記述するだけです。
この"<body>タグ"はここからここまでが本文ですよ、と言うタグです。
さてこの様にメモ帳等に記述したものを"ソース"と呼びます。プログラムでも"ソースコード"等と呼びますがHTMLの場合でもソースと呼びますので覚えておいてください。
以上!

もうちょっと基本編

本文をどこに書くのか、と言う事が分かったので次は"改行"についてお話します。
改行とは簡単に言えば"行が変わる事"です。
メモ帳で本文を書いていきキーボードのエンターキーを押し次の行から改めて文章を書き始めるとメモ帳の中では確かに行が変わります。
しかしそれだけではメモ帳内で改行しているに過ぎません。ブラウザで閲覧した時に改行させなければ文章はどんどんと同じ行で繋がっていき閲覧者は右へスクロールしなければ文章を全て読むことが出来なくなってしまいます。
そこでブラウザ上で改行するタグの登場です。改行のタグは
<br>
です。 これには</br>はありません。"ここからここまでが改行ですよー"と範囲をしていするわけではないので<br>一つでその次に記述した要素が次の行に改行されて表示されます。
筆者はなんとなくあまり好きなタグでは無いのですが使わざるを得ないのでしぶしぶ多用してしまってます。
次がリストを表示するためのタグ<ul>と<li>です。まずは下をみてみてください。
  • 一つ目
  • 二つ目
  • 三つ目
例えば料理レシピで材料を紹介する時等にいいと思います。
ではソースを見てみましょう。
<ul>
<li>
一つ目
</li>
<li>
二つ目
</li>
<li>
三つ目
</li>
</ul>
まずは<ul>で「今からリストです」と宣言します。
「今から〜」と言うことは</ul>が最後に来ます。そしてその<ul>〜</ul>の間にリスト化したい物を<li></li>で囲んで書きます。
  • ←これ
は<li></li>で囲んだ要素に対して一個自動的に挿入されます。
何故わざわざリスト化するの?自分でリスト化したい要素の文頭に「・」をつければ良いじゃない
と思われる読者の方が見えるかも知れませんがこれは基本的にそうしたほうが良いと思います。こうすることでSEOに・・・おっとここではまだ内緒です。
とにかく基本は大事ですのでリスト化する時はきちんとタグで書き分けましょう。
次回はHTML編最終回です。
-Other-