htmlの基本

htmlとはブラウザが読み込むための言語でhtmlファイルの中にタグを記述する事で何について記述しているのか分かるようになっています。本ページではブラウザがhtmlを読み込む動作やhtmlの書き方の基本について説明します。

ホームページはメモ帳で作成出来ます

 ホームページはメモ帳で作成出来ます。

【簡単なhtml例】
「キャンプ入門サイト」

1.キャンプで用意するもの
 テント
 寝袋

2.着いてすぐに行う事
 テント設営
 バーベキューの用意

3.後片付け
 バーベキューの片づけ
 テント収容

 上記を保存する時に「ファイルの種類」で全てのファイルを選択し、ファイル名をindex.htmlと入力します。

 index.thmlをダブルクリックするとブラウザが起動して以下のように表示されます。

htmlの基本1

 これはブラウザがテキストを読み込み、そのまま表示しているためです。html形式で保存する事でブラウザはhtmlと認識して表示してくれます。

 レンタルサーバーを借りてファイルをアップロードした場合でも、サーバーからパソコンにhttp通信でhtmlファイルを送り、ブラウザはその内容を表示します。

 尚、簡単なホームページでもメモ帳だけで作成するのは難しいと思います。「ホームページビルダー」等の有料ソフトウェアを最初から使ってもいいと思いますが、最初は「HTML Project2」等のフリーソフトを使ってみて、より本格的に運用するようになってから有料ソフトウェアを検討するのでもいいと思います。

タグ

 上記のブラウザで表示した際に改行されていない事に気づくと思います。ブラウザで表示する時に改行する場合は以下のように記述します。

【改行例】
「キャンプ入門サイト」<br>
</br>
1.キャンプで用意するもの<br>
 テント<br>
 寝袋<br>
<br>
2.着いてすぐに行う事<br>
 テント設営<br>
 バーベキューの用意<br>
<br>
3.後片付け<br>
 バーベキューの片づけ<br>
 テント収容<br>

 行の最後に全て<br>が付いていますが、これをタグと言って<br>はブラウザでは改行と解釈します。このため以下のように表示されます。

htmlの基本2

 このようにブラウザで解釈出来るタグを利用する事で文字を表示するだけでなく、表示方法も変える事が出来ます。尚、ブラウザは半角スペースを連続で記述しても1つ分しか表示しないため、全角で入力しないと上記でテント、寝袋の前の空白が半角1文字分で表示されます。

 最初はどのようなタグがあるか分からずにホームページ作成を始めると思いますが、「HTML Project2」では主要なタグを選択するだけで使えるためお奨めです。

 又、本サイトでも「ホームページ作成」で順を追って説明していきます。

サイト関連1

ホームページ作成「CSS/スタイルシートの基本
  • このエントリーをはてなブックマークに追加