Web ページのサンプルとテンプレートの使いかた

“Sample Files &a0; Templates”フォルダに収められた Web ページのサンプルとテンプレートは、｢Mac OS Web 共有｣ソフトウェアを使った Web サーバで、公開する内容を作成する場合に利用できます。また、Web ページのサンプルとテンプレートは、ブラウザで HTML（Hyper Text Markup Language）がどのように解釈され、テキストが整形（フォーマット）されるのか学習するうえでも役立つでしょう。

用意されているファイル

｢Mac OS Web 共有｣には以下のようなサンプルとテンプレートのファイルが付属しています。

Web ページのサンプル

Personal.html―個人用ホームページ。
Calendar.html―HTML のテーブル機能を使った週間予定表。
List.html―インターネットに実在する Web サイトへのリンク集。リンク先はお好きなものに変更できます。
Linksample.html―Web ページの作成中に仮のリンク先として使用するページ。

Web ページのテンプレート

template(personal).html―個人用ホームページのテンプレート（ひな型ファイル）
template(calendar).html―週間予定表のテンプレート（ひな型ファイル）
template(list).html―リンク集のテンプレート（ひな型ファイル）

画像

サンプルの Web ページで使用する写真入りの画像
Webページのタイトルの例
項目リストに利用できるボタン
Mac OS のロゴ

サンプルファイルを使って作業するときは、元のフォルダに入れたままで作業するようにしましょう。そうすれば、あらかじめ設定されているリンクを壊さずに済みます。

Web ページの中身を作成するときのヒント

２種類の表示を同時に使用する：Web ページを作成するときは同じページを２種類の方法で見られるようにするとよいでしょう。つまり、ブラウザである Web ページを開いたら、同じ Web ページを SimpleText やその他のワープロ、テキスト編集用プログラムで開くのです。こうしておくと、HTML の変更に伴うブラウザでの表示の変化が、Web ページの再読み込みによって確認できます。

上に挙げた図はそれぞれ、個人用ホームページのテンプレート“template(personal).html”をブラウザで見た場合（上）と HTML テキストのまま見た場合（下）を示しています。このように比較しながら作業を進めることで、記述した HTML コードがブラウザでどのように表示されるかを理解することができるでしょう。

コピー＆ペーストで能率的に作業する：必要な機能を実行する HTML タグや、気に入ったページレイアウトが見つかったら、その内容を独自のテキストや画像に入れ替えてしまいましょう。当然、入れ替えた内容（画像の大きさやテキストの量）によって見栄えは若干変わってしまいますが、後は調整だけで済みます。

借り物だったらラクラク：ネットサーフィンをしていて好みのページが見つかったら、ブラウザの機能を使って、そのソース書類をコピーすることもできます。例えば、「Netscape Navigator」であれば表示メニューから“文書のソース”を選ぶと、表示中の Web ページの内容を HTML タグ入りのテキストファイルとして保存できます。

ページレイアウトにテーブル機能を使う：段組ページを作成する簡単な方法として、HTML のテーブル（表）機能を使うことが考えられます（ホームページ Pro を始めとする多くのホームページ作成ソフトウェアが基本的な表作成機能を備えているので、これを利用するといいでしょう）。表中のコラムの幅や高さは、そこに入れるテキストの量や画像のサイズに応じて自動的に変化します。

隠しテキスト：HTML の表では、テキストを含むセルと含まないセルとが異なった外見で表示されることがしばしばあります。これを回避し、すべてのセルが同じように表示されるようにするためには、空白のセルに隠し文字を入れます。隠し文字は、空白に（見えるように）したいセルに適当な語句を入力し、その文字色を背景色と同じ色に設定したものです。

ファイル名の付けかた：ファイル名は、それを見て内容や関連する他のファイルがわかるような付けかたをしましょう。例えば画像ファイルであれば、それを使っている Web ページの省略名とそのページ内にある画像の順番を示す番号を組み合わせるといったぐあいです。

ファイルの区別のしかた：Web ページのファイルの中で主要な内容を持つものには、Finderのラベル機能を使ってアイコンに色を付けておくと区別しやすいでしょう。また、ファイル名の一部にファイルの種別が分かるような語句を用いることも考えられます。一般的な例では、HTML で記述されたテキストファイルの末尾には“html”という語句を付けるなどがあります。

Web ページの見えぐあいのチェック：Web ページの内容を作成する上で重要な点の１つには、常にブラウザでチェックしてみるということが挙げられます。さらに万全を期すのであれば、複数のブラウザでチェックしてみるのがいいでしょう。どのブラウザにも独特のクセがあるため、Web ページの中身を作るときには、そのクセによるおかしな挙動が起こらないよう、ページや画像を調整していく配慮が必要です。

Web ページを作成するときのヒントや資料がさらに必要であれば、Using Personal WebSharing.html（Mac OS Web 共有の使いかた）に記述されている“Web 共有についてもっと詳しく知るための情報源”で挙げている Web サイトを訪ねてみてください。