<html> <head> <title>このページのタイトル</title> </head> <body> <h1>私の ウェブページ</h1> <p>はじめてのウェブページです。</p> </body> </html>
エディタを立ち上げて、上記の灰色地の部分を入力してください。このようになります。青色の部分は別の文でもかまいません。黒字の部分は必ず半角文字(直接入力)で入れます。
index.html という名前で public_html に保存します。(保存のやり方を熟知している人は保存後に進んでください)
次のように保存します。保存ボタンを押すか、メニューから保存を選びます。
準備してある public_html というフォルダに保存します。下図のままだとユーザーホームに保存されてしまいますので、public_html を指定しましょう。
他のフォルダの三角をクリックします。
ダブルクリックで public_html に移動します。
public_html に移動したら、名前を入れます。
下図のように名前に index.html を入力し一番下の保存ボタンを押します。
保存すると編集中のファイルの名前が index.html になります。タイトルバーで確認できます。
色がつく<html> や </html> のようなものは、はさまれた部分の言葉や文章がどんな役割をしているか、どのような性格があるかを示す(Markupする)ものです。「タグ」とよばれます。geditにはこのタグを色を変えて表示する機能が備わっています。保存することで、拡張子が .html や .htm になると自動的にやってくれます。
配色は使用ソフトやバージョンで変わるかも知れません。ある程度は自分で好みにできます。
htmlファイルはウェブブラウザで閲覧します。多くのシステムで.htmlの拡張子をもつファイルをダブルクリックすればウェブブラウザで開くようになっています。
でもダブルクリックしないでindex.htmlの上で右クリックをしてみてください。
2つのウェブブラウザから選ぶことができます。
次のように見えるはずです。
ひょっとしたら次のように「文字化け」があるかもしれません。
これは日本語の文字をファイルに保存する方法がいくつかあって,このindex.htmlはUTF-8で保存しているのですが,ブラウザが別の規格たとえばEUC-JPとかShift_JISとかで表示しているからです。
ブラウザのメニューから「文字エンコーディング」を探して文書にあったものを設定します。今回はUTF-8にします。firefox(iceweasel)ならばつぎのようにします。
このようなことをなくすためにどの「文字エンコーディング」をして保存したのかをファイルに書いておく方法があります。index.htmlにはまだそれがないので,ブラウザ側で指定のない時の設定(デフォルトまたは既定といいます)で表示しています。
このデフォルトを変更することもできます。しかし、別のファイルを見た時にまた文字化けするかもしれません。ブラウザで自分が作ったファイルだけを見るのではありません,インターネット上のファイルがどうなっているかなのです。
やり方はブラウザの種類やバージョンによって異なり深いところにあって複雑です。LINUX用のFirefoxならばメニューの[編集]-[設定]-[コンテンツ]-[フォントと配色]の[詳細設定]の[既定の文字エンコーディング]を変えます。(Windows版ならばメニューの[ツール]から始まります)
htmlファイルはエディタで開いたままブラウザで表示しても問題ありません。ページの作成中はエディタで開いたままにして、エディタで保存→ブラウザで再読み込み を繰り替えして完成させます。
編集したら保存します。名前がついているので上書きです。
再読み込みのボタンを押すと変更が反映されます。
ファイルを閉じてしまった場合、または後日編集の続きをする場合は、次の様に編集するファイルのアイコンを右クリックして[geditで開く]を選びます。ダブルクリックでは編集できません。
ウェブページ(Apr.2008)