HTMLファイルを作って、ブラウザで表示してみる
HTMLをブラウザで見るには、ファイルに保存して、それをブラウザで開きます。
例として次のコードをテキストエディタに貼り付けて保存します。
[参考記事] テキストエディタ MKEditor
[参考記事] テキストエディタ UnEditor NoEditor
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis" /> <title>タイトル</title> </head> <body> <p>テストのHTMLです。</p> </body> </html>
このとき文字コードは
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis" />
このようにShift-JISになっているので、テキストファイルの文字コードはShift-JISにします。
[参考記事] 文字コードの指定
Shift-JISはSJISと表示されているテキストエディタもあります。
『 S 』の付いていない『 JIS 』とは違います。
保存するときのファイル名は拡張子を『 .html 』にします。
拡張子を『 .html 』とすることで、一般的なPCではHTMLファイルと認識され、標準のブラウザに関連付けされます。
関連付けされている場合は、ダブルクリックして開くと、その標準のブラウザで開くことができます。
またテキストエディタによっては、拡張子を『 .html 』にしても、テキスト文書として保存され、拡張子『 .txt 』が付く場合もあります。
このときは、ファイルの種類を『全てのファイル』または『HTML文書』を選択して保存します。
ファイル名の拡張子が『 .html 』になっているにもかかわらず、テキスト文書と認識される場合は、拡張子『 .txt 』が表示されていないことが考えられます。
[参考記事] Windowsでファイルの拡張子を表示する方法
保存されたファイルをダブルクリックするか、ブラウザの画面上にドラッグアンドドロップすることで、ブラウザで表示することができます。
次のように表示されていた場合は、ブラウザの表示エンコード設定が『自動選択』になっていないことが考えられます。
Shift-JISがEUC-JPとして表示される。
Shift-JISがUTF-8として表示される。
ブラウザの表示エンコード設定が『自動選択』になっているにもかかわらず、表示がおかしくなるときは、ブラウザで自動認識されたエンコードがShift-JISになっているか確認します。
Shift-JISになっていない場合は、テキストエディタで保存したときのエンコードが間違っています。
関連記事
- HTMLの構造
- 文字コードの指定
- 『開始タグ』と『閉じタグ』
- テキストに意味づけをする マークアップ
- 子要素として許可される要素 内包可能要素
- ブロック要素(ブロックレベル要素)とインライン要素
- 見出し H1 H2 H3 H4 H5 H6
- 文章のまとまり、段落 P ADDRESS BLOCKQUOTE
- 表組みを作成する TABLE TH TD
- リストを作成する UL OL DL
- 横罫線を引く HR
- 改行する BR
- 文章中のテキストに意味を付ける インライン要素のマークアップ
- テキストの装飾をする
- 上付き文字、下付き文字を表示する SUP SUB
- 追加された部分、削除された部分であることを示す INS DEL
- リンクなどのパスの指定
- 別のページへのリンク 同ページ内のリンク A
- 他のページを参考にする ソースを見る
- 画像を設置する IMG
- HTML特殊文字 HTMLエスケープ 実体参照
スポンサーリンク
