Composer で Web ページ

はじめに

ここでは SeaMonkey(旧 Mozilla和ジラ)または Netscape に含まれる Composer を使って Web ページを作る方法を説明します。

起動

Mozilla の類から,左下にある小さなアイコンの一つ(Composer という吹き出しが出ます),または

ファイル→新規作成→ページを作成 (File→New→Compose Page)

で Composer が起動します。

すでに自分のページを作っている人は,Mozilla の類でそのページを開いて

ファイル→ページを編集 (File→Edit Page)

で Composer を呼び出してください。

この画面にワープロと同じ感覚で書いていきます。

文字を大きくするには,ツールバー左の「本文テキスト」(Body Text)となっているところを「見出し1」(Heading 1)にします。

そのすぐ右側に文字色と背景色を変えるボタンがあります。

保存

Windows はときどき不安定になるので,止まってしまう前に保存しておきましょう。

保存はツールバーの[保存](Save)ボタンまたは

ファイル→保存 (File→Save As...)

で行います。

ファイル名は必ず直接入力で入力します。

最初のページ(ホームページ,トップページ)は必ず index.html というファイル名にします。

最初のページ以外には index.html 以外の名前を付けます。 拡張子は .html にします。 使える文字は1バイトの英数字と _ や - で,英字はなるべく小文字にします。 全角文字のファイル名は付けられません。

良いファイル名の例

悪いファイル名の例

アップロード

サーバに送ることをアップロード(upload)といいます。

アップロードするには,ツールバーの[出版](Publish)ボタンまたは

ファイル→出版 (File→Publish)

をクリックします。

最初にアップロードするときは[設定](Settings)を埋めなければなりません。

以下で「ホスト名」とは,三重大の私のサーバは oku.edu.mie-u.ac.jp,三重中京大は www.matsusaka-u.ac.jp です。 「ユーザ名」とは,三重大教育学部では e で始まる学籍番号です。 ただし,三重大学ではファイアウォールのためうまくいかない公算が大きいので,FTPやWinSCPを使う方法をお勧めします。

サイト名 (Site Name)
(何でもいい)
出版するアドレス (Publishing address)
ftp://ホスト名/public_html/
ホームページにするHTTPアドレス (HTTP address of our homepage)
http://ホスト名/~ユーザ名/
(空欄のままでもかまいません。 ホームページとは日本語でいう「トップページ」のことで,サブディレクトリ名やファイル名を含みません)
ユーザ名 (User name)
(自分のユーザ名)
パスワード (Password)
(自分のパスワード)

打ちにくい文字の打ち方をまとめておきます:

記号読み方打ち方
~ チルダ「Shift」+「へ」(ゼロの右の右)
_ アンダーバー「Shift」+「ろ」(右 Shift の左)

次に[出版](Publish)というところを埋めます。

サイト名 (Site Name)
(さきほど設定したサイト名が選ばれていることを確認します)
ページタイトル (Page Title)
(何でもいい。たとえば「○○のホームページ」)
ファイル名 (Filename)
index.html(最初のページの場合)

残りは元のままでかまいません。

下の[出版](Publish)ボタンを押します。 「出版は完了しました」というメッセージが出れば,アップロード成功です。

2回目からはツールバーの出版ボタンを押すだけです。 Enter password for ...(パスワードを入れてください)というプロンプトが出れば,パスワードだけ入れます。

アップロードには,これ以外に ffftp などのファイル転送ツールを使う方法もあります。

自分の作ったページの見方

Composer のツールバーの[ブラウズ](Browse)ボタン(または「ファイル」→「ページをブラウズ」(File→Browse Page))を押せば,サーバに送ったページの最終確認ができます。

Composer を使わないで自分のページを見るには,ブラウザの上部のアドレス欄に次のように入れます(頭の http:// は略しても自動で入ります)。

http://ホスト名/~ユーザ名/

授業のページなどからリンクが張ってある場合は,そのリンクをたどって見ることもできます。

リンクの張り方

たとえば Google にリンクを張るには,

Google

と書いて範囲指定し,ツールバーの[リンク]ボタンを押して,リンク先の欄に

http://www.google.co.jp/

のように完全なアドレスを書き込みます。

自分の index.html から,たとえば自己紹介ページ intro.html にリンクを張るには,index.html に

自己紹介

と書いて範囲指定し,[リンク](Link)ボタンを押して,リンク先の欄に

intro.html

と書き込みます。

逆に,intro.html から最初のページ index.html にリンクを張るには,intro.html に「戻る」などと書いて範囲指定し,[リンク]ボタンを押して,リンク先の欄に

./

と書き込みます。 このように,デフォルトのページ(最初に現れるページ)のファイル名 index.html は隠します。

ページを変更したらアップロードするのを忘れないようにしましょう。

画像の入れ方

画像を挿入する前に,ページを保存しておきましょう。

挿入できる画像は JPEG (.jpg),PNG (.png),GIF (.gif) です。 Windows BMP (.bmp) は使ってはいけません。

挿入したい画像は,ページを保存したフォルダと同じところに置いておきます。

ツールバーの[画像](Image)ボタンまたは

挿入 → 画像 (Insert→Image)

をクリックします。 [ファイルを選択](Choose File...)ボタンで画像を選びます。 ファイル名が入り,その下のチェックボックス(URL is relative to page location)にチェックが付いていることを確認しましょう。

その下の「代替テキスト」(Alternate text)欄には画像を説明することばを入れます。 特に説明がなければ「代替テキストを使用しない」(Don't use alternate text)を選びます。

著作権フリーの画像集などから画像をドラッグ&ドロップしてくることもできます。


奥村晴彦

Last modified: 2006-07-31 15:23:45