第08回 - 07年度秋学期
XHTMLを利用した情報発信
自分で調べたり、まとめたりした情報をWWWを通じて発信するという機会が多くなってきました。そのためにはウェブページを構築して、情報を書き記す必要があります。ウェブページを作成するには、HTMLというマークアップ言語を利用する必要があります。HTMLにはいくつかの規格があります。
この講義では、比較的最近の規格であるXHTML1.0を用いて、ウェブページを作成することとします。XHTML1.0は文書の構造を示すための規格です。また、見栄えに関する情報を取り扱うカスケーディングスタイルシート(CSS)という仕組みを併用することによって、より見やすく、扱いやすいウェブページの構築を目指します。
雛形の活用
最初からすべてのルールを説明して、「さぁやってみましょう」というのは簡単なのですが、それでは途方に暮れてしまうことでしょう。そこで、授業用に簡単な雛形を作成してみました。この雛形を活用することで、自分の発表するべき内容に集中することができます。
雛形をダウンロードするためには、「雛形」を右クリックで「対象をファイルに保存」として、自分のUSBメモリなどに保存してください。
今ダウンロードしたファイルは、圧縮されていますので、解凍する必要があります。sample.lzhをダブルクリックすると、フォルダの中にsample.htmlというファイルがあります。このファイルが雛形の本体です。自分のUSBメモリなどの課題作業用フォルダに保存しておいてください。
雛形の複製
無事、sample.htmlファイルを利用できるようになりましたか?
この雛形のファイルを、必要となるページ数だけ複製する必要があります。ファイルの上で右クリックし、「コピー」を選びます。続いて、「貼り付け」を繰り返し、必要なだけファイルの複製を行ってください。
ファイル名の変更
複製された雛形は、「コピー〜sample.html」という名前になっていると思います。これではウェブページとして利用できませんので、ファイル名を変更しましょう。名前を変更したいファイルの上で右クリックし、「名前の変更」を選びます。新しいファイル名を入力し、リターンキーを押して確定しましょう。ただし、利用できるファイル名は、半角英数で、拡張子が「.html」となっているものです。たとえば自己紹介であれば、「me.html」であるとか、歴史に関するファイルであれば「history.html」というように、簡潔に内容がよくわかる名前にしてください。
すべてのファイルに適切な名前がつけられましたか?
では最後にもうひとつ雛形からファイルを複製し、index.htmlと改名してください。このファイルが目次兼表紙のような役割になります。
準備はできましたね? それではそれぞれのページを編集していきましょう。まずは、今名前を変えたそれぞれのファイルを、「メモ帳」で開く場合方法を簡単に説明します。
それでは早速編集を開始しましょう。編集を行うには、XHTML1.0というルールを用いて文章を記す必要があります。詳しくは次回以降に説明を行います。今日のところは、index.htmlをネットに公開するところで完了です。
情報の公開のための準備(早稲田大学編)
手元のコンピュータに編集されたファイルがあっても、それだけでは世界中に公開されたことになりません。そこで、FTPというツールを用いて公開用コンピュータ(WWWサーバ)に転送することにしましょう。早稲田大学の学生の場合、まずは、授業ごとに公開用のフォルダを作成する必要があります。
具体的な作業内容は、PC・ネットワーク利用ガイド2007年版の6章を参照してください。
FFFTPの利用について
前述のように、起動後に公開サーバに接続するための手続きを行う必要があります。接続したら、左右に分かれたウィンドウが表示されますが、基本的には右側のカラムを用いて転送します。
編集したファイルをウィンドウやデスクトップからFFFTPの右側のカラムにドラッグ&ドロップすると、転送が行われます。転送し終わったら、ウェブブラウザで更新されたかどうか確認してみてください。
参考文献
- 作者: 神崎正英
- 出版社/メーカー: 毎日コミュニケーションズ
- 発売日: 2000/11
- メディア: 単行本
- 購入: 5人 クリック: 50回
- この商品を含むブログ (46件) を見る
- 作者: 益子貴寛
- 出版社/メーカー: 秀和システム
- 発売日: 2005/07/07
- メディア: 単行本
- 購入: 17人 クリック: 532回
- この商品を含むブログ (102件) を見る
課題
- ウェブサイト構成案を作成し、SNSの日記に掲載すること。必要となるそれぞれのHTMLファイルのブロック要素(見出し、段落、箇条書き、引用部など)についての編集を完了しておくこと(文章は基本的にすべて完成されていることが望ましい)。またファイル名も考えておくこと。(ファイル名は1バイト文字で拡張子は.htmlとすること)
- 見栄えについては一切考慮する必要はない。次々回までにHTMLファイルの編集は完了しておくこと。