Last Update : 03/13/2003
HTML基礎講座 :: まずは準備するぞ
HTML書く前に準備するもの
テキストエディタを開こう！
まず、テキストエディタの開き方を覚えよう。
- Windows
- 画面左下にある「スタート」から「プログラム」→「アクセサリ」→「メモ帳」をクリックすると、メモ帳が開く。
- Mac
- 「SimpleText」ってテキストエディタがあるから、それを使おう。
もちろん、「秀丸エディタ」や「TeraPad」なんて、他のテキストエディタを使ってる人は、それをつかってオッケー。ただ、「Word」のようなワープロソフトは絶対に使わねぇように！！
Webサイト用のフォルダを作るぞ
次に、作ったWebページを入れるフォルダを用意しよう。
- Windows
- 画面左上の [マイコンピューター] を開いて、[(C:)] から ハードディスク C: ドライブに行こう。
それから、[ファイル(F)] をクリックして [新規作成(N)] を選び、[フォルダ(F)] をクリックすると、新しいフォルダが出来るので、それの名前の所をクリックして、名前を変えよう。 - Mac
- [ファイル]→[新規フォルダ]で新しいフォルダを作れるぜ。
フォルダ名は、半角英数字とハイフン(-) 、アンダーバー(_)だけを使った名前にしとこう。( ) [ ] みたいなカッコとか、半角スペース、日本語とかは使っちゃダメ。
拡張子を見えるように
拡張子というのは、ファイル名の最後についてる .html、.htm、.gif、.jpg とかいったピリオド (.) + ３文字か４文字のアルファベットのことで、ファイルの種類を示してる。
普通にパソコンを使ってる時は気がつかないと思うけど、ホームページを作るときには気をつけなくちゃいけないことだぞ。 拡張子が無いとページや画像が表示できないからね。
- Windows
- ファイルを保存する前に、画面の左下の [スタート] から [設定]→[フォルダ オプション] を選び、[表示] タブをクリックして、[登録されているファイルの拡張子は表示しない] のチェックを外そう。そうすると、ファイルの拡張子が表示される。
で、この拡張子は自分で勝手に書き換えたらダメ。
拡張子は、ファイルの種類を示す記号だから、勝手に変更すると、最悪、そのファイルが使えなくなる。牛肉に“豚肉”なんてラベルつけても、豚肉になるわけねぇじゃん。それと同じこと。でも、.htm と .html はどっちも HTMLファイル を示す記号だから、test.htm ってファイル名を test.html って拡張子を変更するのは構わないぞ。
じゃあ、HTML 書いてみよう
まずはこれを書いて
<html>
<head>
<title> ページのタイトル </title>
</head>
<body>
はじめての Web ページ
</body>
</html>
テキストエディタを開いて、上のを書き終わったら、それを text.html のような、「名前」.html っていうファイル名で保存しよう。ただし、「名前」のところには半角英数字とハイフン(-) 、アンダーバー(_) 、ピリオド(.) だけしか使えないから注意。
で、保存するときに、[ファイル]→[名前を付けて保存]でさっき作ったフォルダに移動した後、ファイル名を 無題 から test.html （か、好きなファイル名）に変更して[保存]ボタンを押せばオッケー。さっき作ったフォルダに入れておかないと、ファイルがどこに行ったかわからなくなるからね。
ブラウザで見てみよう
じゃあ、今作ったページをブラウザで表示してみよう。ブラウザで見る方法は、ブラウザを開いて、そこにファイルをドラッグアンドドロップするか、「ファイル」→「開く」→「参照」でファイルを指定してやればオッケー。
こんな風に表示されてれば、初めてのHTMLページ作成は完成。次からは、HTMLの基礎や改造方法を紹介するぞ。