さてコンテンツの設計が終わったら実際にホームページの基礎となるhtmlファイルを作ってみましょう。
使用するソフトは「メモ帳」です(Windowsに最初からついてきます)。
サイトドラフトを最初からhtml文書ファイルで作成しておくと後の「コーディング講座」の作業が楽になります。
またhtml文書で作ると企画段階から「SEOツール講座」にある様々なSEOツールを使用する事もできます。
とはいうもののサイトドラフトは企画書ですからコンテンツの設計が固まっていないのであればワードやパワーポイントなどの文書ファイルでのコンテンツ設計作業とサイトドラフトの作業を繰り返すと良いかもしれません。
メモ帳
メモ帳はほんのちょっとのメモからhtmlやcss等の作成まで幅広く使えるソフトです。
htmlソース
ホームページはWordなどで作成した文章をそのままコピーして作成できるものではありません。
htmlファイルというのは冒頭部分に「これはhtmlで記述された文書です!」とファイルの特性を宣言しどのようなルールに基づいて記述されているのかについても書かなければならないものです。
またホームページに掲載する文書を「タグ」と呼ばれる特別な文字列で囲って見出しやリンク段落表などの文書構造を定義付け(マークアップ)しなければなりません。
html(Hyper Text Markup Language)DOCTYPEの解説やheadbodyタグの詳細解説はとりあえず省きます。
今のところは「htmlファイルを制作するためには『書き方』がある」ということを覚えていただければOKです。
日本語のページを制作するのであれば下記のコードをこのままコピーして使えば問題ありません。
コピーはソースエリアにマウスを乗せると表示される「copy to clipboard」のアイコンをクリックするだけです。コピーしたらメモ帳にペーストします。
<html> <head> <meta charset="utf-8" /> </head> <body> </body> </html>
ファイルの保存
作成したファイルを保存します。
ここで気を付けて欲しいのはファイル名と文字コード(キャラクターコード)です。
ファイル名はindex.htmlとして文字コードはUTF-8を選択します。
- ホームページのルール
ホームページのトップページのファイル名は必ずindex.html(index.htm,index.php,index.jspなどの場合もあります。)です。これはインターネット上の決まりです。
文字コードをUTF-8にしないと作成したhtmlをブラウザで見た場合に文字化けすることがあります。
「ファイルの編集」に進む
「ページ構成とファイル名」に戻る