HTML による WWW ページの作成、アクセス制御

					2013年05月14日
情報科学類 コンピュータリテラシ

                                       筑波大学 システム情報系 情報工学域
                                       新城 靖
                                       <yas@cs.tsukuba.ac.jp>

このページは、次の URL にあります。
http://www.coins.tsukuba.ac.jp/~yas/coins/literacy-2013/2013-05-14
あるいは、次のページから手繰っていくこともできます。
http://www.coins.tsukuba.ac.jp/~yas/
http://www.cs.tsukuba.ac.jp/~yas/

■連絡事項

■クライアントとサーバ

資料配付済み。

■ハイパーテキスト・ハイパーメディアと World Wide Web

ハイパーテキスト(hypertext)とは、内部に他のテキストへの「参照 (reference)」が埋め込まれているテキスト(文書、文字だけから構成される データ)である。ハイパーテキストという仕組みを使えば、テキストのある部 分から、関連している情報を含んでいるテキストのある部分を引き出すことが 簡単になる。

ハイパーテキストを拡張し、テキスト・データだけでなく、音声や画像などの データを扱えるようにしたものを、ハイパーメディア(hypermedia)という。 World Wide Web は、ハイパーメディアに基づいて 作られている情報提示のための仕組みである。

インターネットの雲、資源、リンク、ブラウザ

インターネット上の資源とハイパーメディア

ハイパーメディアやハイパーテキストのデータを作成するためには、次の2つ の事が必要になる。

  1. 差されるデータに印(mark,label)を付ける。
  2. 差すデータに、参照を埋め込む。
文書(テキスト)に、「ここは表題」、「ここは箇条書」といった、文書の構 造を示す目印(マーク)を付けることをを付けることを、マークアップすると いう。 ハイパーメディアを記述するためには、上の2つのことを支援した、人工の言 語を使う。このような言語を、マークアップ言語(markup language)という。

WWW では、マークアップ言語として HTML (HyperText Markup Language)と呼 ばれている言語が使われている。

◆URL

HTML では、他のデータへの参照を実現するためにURL (Uniform Resource Locator) という形式を使う。次に、URL の例を示す。

http://www.tsukuba.ac.jp/education/college.html

http
HyperText Transfer Protocol。WWWのデータを保持しているプログラム と、WWWを表示するプログラムの間でデータをやり取りするときの形式を定め た約束。
www.tsukuba.ac.jp
そのデータを持っているコンピュータの名前。
/education/college.html
そのコンピュータの中での資源の名前(ファイルの名前)。最後の .html は、その資源がHTML で書かれている事を表わしている。

◆HTMLでの表示

WWW ブラウザは、整形された HTML ではなく、整形前の元の HTML (source) を表示する機能がある。

◆絶対形式と相対形式

URL には、絶対形式と相対形式がある。 絶対形式(absolute form) とは、にhttp:,host,dir/filename がそろっているものである。 相対形式(relative form) とは、このうち http:host が省略されたものである。 絶対形式と相対形式は、それぞれ、完全形と短縮形と呼ばれることもある。

ある HTML で記述されたデータの URL:

http://host1:port1/dir1/file1.html
データの中の相対形式の URL:
file2.html
絶対形式での意味:
http://host1:port1/dir1/file2.html

◆ホーム・ページ

WWWで ホーム・ページ(home page) とは、本来は、ある一連の情報にアクセスするために、最初にアクセスされる ことが想定されて作られているページを意味する。

「本来は」、ホーム・ページではない WWW ページも存在する。現実には、「ホー ム・ページ==WWWページ」という使い方をする人が多い。 情報科学類 生は、 この2つを区 別したい。この講義のページでは、区別している。

「ホームページ」さまざまな用例集 ver. 2005.9.2 by Kuno。 ネットワーク・ニュース fj.net.words に時々投稿される。

■HTML

HTML(the HyperText Markup Language) は、WWW で ハイパーメディア データを定義するための マークアップ言語。 HTML は、「本来は」、文書の構造を記述する。

HTML で記述できる文書の構造:

HTML では、文書の構造を記述することができるが、「表示の方法」 を記述することは、本来はでない。

表示の方法:

ワードプロセッサ(Word processor, ワープロ)は、紙に印刷した時の、このよ うな表示の方法を設定するためのプログラムである。これに対し て、HTML では、もともとの思想では、少数の 物理スタイルタグ という例外を除いて、表示の方法は、それを表示す るプログラム(ブラウザ)が決める。

しかし、現実には、もともと例外だった物理スタイルタグを、ブラウザ・メー カが勝手に拡張・追加するという状況に陥った。この状況を打破するために、 HTML (HTML 4.0) では、「スタイルシート」という考え方の導入した。

スタイルシートとは、 表示の方法(スタイル)に名前を付けて、ドキュメント単位やパラグラフ単位で どのスタイルを使うかを指定できるようにしたもの。 新しいタグを追加することなく、表示の方法を記述することができる。 HTML 4.0 では、物理スタイルタグが、「もう古い(deprecated)」、あるいは、 「使わないことを勧める(discouraged)」とされた。

WWWページを作る目的は、多くの人にメッセージを伝えることである。そうい う意味では、特定のブラウザでしか使えないような機能は、使わないようにす るべきである。表示の方法よりも内容が大事。

◆HTMLの文法とタグ

HTML による文書は、「<>」で括られたキーワード ( タグ(tag) ) が埋め込まれたテキスト・ファイルである。テキスト・ファイルとは、文字デー タだけが並んでいるファイルで、 Emacs 等の テキスト・エディタ で修正できるものである。

HTMLのタグの形式:

<TAGNAME>タグの対象テキスト</TAGNAME>

タグには 開始タグ (/がついていない)と 終了タグ (/がついている)がある。

開始タグと終了タグの間にタグ付けの対象となるテキストが書かれる。

基本的に開始タグは、見出し、箇条書などの機能を「オン」にし、終了タグは 機能を「オフ」にする働きがある。ただし、<IMG> の ように組になっていないタグもある。

TAGNAMEには、アルファベット(大文字でも小文字でも よい)と数字が使われる。

タグには、オプションを設定できるものがある。

<TAGNAME ATTR1=VALUE1 ATTR2=VALUE2>タグの対象テキスト</TAGNAME>

オプションは、開始タグの括弧「<>」の中に、 「属性名=属性値」の形式で記述される。

◆HTML文書の構造

HTMLの文書の大まかな構造

<HTML>
<HEAD>
<TITLE>
タイトル
</TITLE>
</HEAD>

<BODY>
本体
</BODY>
</HTML>

<HTML>で始まり </HTML>で終る。 おおきく2つの部分、 <HEAD>,</HEAD> で囲まれた ヘッダ(header) と、<BODY>,</BODY> で囲ま れた 本体(body) から構成される。 ヘッダの <TITLE>,</TITLE>で囲まれた部 分は、 タイトル で、タイトルバーなどに表示される。 ヘッダでは、見出し、文字飾り、ハイパーリンクを使うことができない。

◆見出し(heading)

HTMLで記述された文書の本体の構造

<H1>第1章</H1>
        1章の冒頭
        <H2>第1節</H2>
        1章1節の冒頭
                <H3>第1項</H3>
                1章1節1項のパラグラフの並び
                <H3>第2項</H3>
                1章1節2項のパラグラフの並び
        <H2>第2節</H2>
        1章2節の冒頭
                <H3>第1項</H3>
                1章2節1項のパラグラフの並び
        <H2>第3節</H2>
        1章3節の冒頭
                <H3>第1項</H3>
                1章3節1項のパラグラフの並び
<H1>第2章</H1>

HTML の文書は、 見出し(heading)パラグラフ(paragraph) ( 段落 ) の並びから構成されている。 HTML では、見出しとして <H1> から <H6> までが 定義されいる。見出しを使うことで、章の構成を表現することができる。

段付け(indentation) ( 字下げ ) は、説明のために付けたものである。HTMLでは、空白やタブは、単語の区切り として扱われるため、空白やタブによる段付けは無視される。つまり、書き手 が自由に読みやすいように段付けをしてよい。

<H1> から <H3> までの見出しは、 Firefox などのブラウザでは、標準で普通の文字よ り大きな文字で表示さる。しかし、大きな文字で表示させたるために、見 出しの機能を使うのは、本来は、誤りである。 見出しがどのように表示されるかは、ブラウザの種類や設定に依存している。 見出しは、あくまでも章の構成を表わす目的で使う。

◆パラグラフ

見出しと見出しの間には、いくつかのパラグラフを記述する。パラグラフは、 <P>で始まり、</P>で終わる。 ただし、終りの </P>は、HTML ではオプション(付け ても付けなくてもよい)なので、書かない人も多い。

◆リスト(箇条書)

HTML で リスト(list,並び) とは、 箇条書(item) を作るための機能である。

HTML で扱える箇条書の種類:

例:

HTML記述:

<UL>
<LI>日本料理
<LI>中華料理
<LI>韓国料理
<LI>フランス料理
<LI>イタリア料理
</UL>

表示例:

HTML記述:

<OL>
<LI>メールリーダを実行する
<LI>新着メールを取り込む
<LI>新しいメールを書く
<LI>新しいメールを送る
<LI>メールリーダを終了する
</OL>
表示例:

  1. メールリーダを実行する
  2. 新着メールを取り込む
  3. 新しいメールを書く
  4. 新しいメールを送る
  5. メールリーダを終了する

リストは、 入れ子構造(nest) にすることがでる。リストの中でまたリストを使うことができる。

HTML記述:

料理
<UL>
<LI>日本料理
<UL>
    <LI> すし
    <LI> さしみ
    <LI> そば
    <LI> 天ぷら
    </UL>
<LI>韓国料理
    <UL>
    <LI> 海鮮ナベ
    <LI> 焼肉
    <LI> ジャプチェ
    </UL>
</UL>

表示例:

料理

◆ハイパーリンク(アンカ)

HTML で、<A></A> で囲まれ ている部分を、 アンカ(anchor) とう。

船の錨(いかり)の矢印を連想

アンカは、ハイパーリンクの始点と終点を表現している。ハイパーリンクの始 点は、リンクの頭(head)、終点は、リンクの尾(tail)ともいうこともある。 HTMLの解説書の中には、始点をリンク、終点をアンカと呼んでいるものもある。

例: HTML記述:

<A HREF="http://www.tsukuba.ac.jp/index.html">Univ. of Tsukuba </A>
表示例:
Univ. of Tsukuba
Univ. of Tsukuba」というテキストが、ハイパー リンクの始点で、 http://www.tsukuba.ac.jp/index.htmlで表わされた資源(ファイル) が終点。 終点、<A>タグ中のHREF (Hyper REFerence) という属性によって指定される。

リンクの URL は、 相対形式でもよい。

<A HREF="english.html">[English]</A>

[English]」というテキストが、ハイパーリ ンクの始点。この記述が URL http://www.tsukuba.ac.jp/dir/index.htmlの中で使わ れたとすると、"english.html" という相対形 式の URL は、絶対形式では http://www.tsukuba.ac.jp/dir/english.htmlとなる。

ハイパーリンクの終点は、同じファイル内、あるいは、別のファイルにあるテ キストのある一部分を差し示すこともできる。そのためには、NAME属性付のア ンカと 断片識別子(破片識別子、fragment identifier) を使う。

<H2><A NAME="boston">Boston</A><H2>

ハイパーリンクの終点は、普通、見出しが使われるが、見出しでなくてもよい。 <A>タグのNAME属性の値 "boston" は、ファイルの中で重複しないように決める。

このハイパーリンクの終点を差し示すためには、同じ文書内の場合、次のよう に HREF属性として、「#」で 始まる文字列を指定する。

This is New York. That is <A HREF="#boston">Boston </A>.
別のファイルの例:
This is Tsukuba. That is <A HREF="usa.html#boston">Boston</A>.
"usa.html" というファイルの中にある <A NAME="boston"></A>で作られたアンカへのハイパー リンク。

◆イメージへのリンクとインライン・イメージ

WWW でイメージを扱う方法

記述例:
<IMG SRC="images/client-server-service.png"
     ALT="サーバがサービスをクライアントに提供している。">
表示例

サーバがサービスをクライアントに提供している。

タグ <IMG> がインライン・イメージを張り付 けるという意味である。<IMG> には、終了のタグ </IMG> はない。

SRC属性では、テキストの途中で展開して表示するイメー ジの URL を指定する。

ALT属性は、イメージの代わりに表示されるテキストを 指定する。これは、Firefox などのブラウザのオプションとして、 「画像の読み込み(Load Images)」がオフに なっている時にイメージに代わって表示れる。 ALT属性は、w3m や lynx などのように、イメージが表示できないブラウザにより使われたり、目 の不自由な人がイメージの内容を知る時に使われる。

IMGタグのSRC属性では、絶対形 式のURL使うこともでる。

<IMG SRC="http://www.tsukuba.ac.jp/icons/penguin.png" ALT="[ペンギンのアイコン]">

インライン・イメージとしてよく使われる画像の形式

PNG (Portable Network Graphics)
普通の圧縮方法(可逆圧縮方法)を使っている。 普通の圧縮方法(可逆圧縮方法)を使っている。コンピュータで作成したアイコ ンや図形、いわいる「アニメのセルのようなベタぬり」に適している。1ピク セルは、赤、緑、青でそれぞれ16ビット、全体で48ビット(248 == 281474976710656色)まで。
GIF (CompuServe Graphic Image Format)形式(ジフ)(.gif)
256色まで。圧縮アルゴリズムとして、LZ77 という 方法が使われており、一部の国で特許が有効なためライセンス料が必要になる。 アメリカや日本では特許は特許は切れている。
JPEG (Joint Photographic Experts Group) 形式(ジェイペグ)(.jpeg,.jpg)
劣化式圧縮方法を使っている。イメージ・スキャナやディジタル・カメ ラで取り込んだ写真に適している。約1670万色(224)まで。

◆アドレス

HTML文書の最後には、普通、 <ADDRESS>,</ADDRESS>タグを使っ て、その文書の著者の電子メール・アドレスや著者のホーム・ページへのリン クを書く。これは、このページの内容にきちんと責任を持つことを示している。

HTML記述:

<ADDRESS>
who at coins.tsukuba.ac.jp
</ADDRESS>
表示例:

who at coins.tsukuba.ac.jp

「who at coins.tsukuba.ac.jp」という表記は、 「who@coins.tsukuba.ac.jp」の意味で、 spam対策 の一種。spamを送信する人は、Web ページに含まれている電子メールのアドレ スを収集することがある。電子メールのアドレスを、自動収集プログラムには 分からないが人間には分かるようにするために変形する。変形の方法は、いろ いろ工夫している人がいる。

◆文字飾り

文書内の単語を太字にしたり斜体にしたりする機能を文字飾りとう。

文字飾りで使う2種類のタグ

論理スタイルタグ
「強調 <EM> <STRONG>」、 「定義 DFN」、 「引用 CITE」、 「コード(コンピュータ) <CODE>」、 「変数 <VAR>」、 「キーボード (KBD」など、文書の論理的な構造を表わ す。表示されるかは、ブラウザに任される。
物理スタイルタグ
「太字 <B>」、「イタリック <I>」、 「タイプライタ・フォント <TT>」、 「フォント指定 <FONT> <BIG> <SMALL> <BASEFONT>」 とった具体的な 表示方法を表わす。
「肩付き <SUP>」と「下付 <SUB>」は、論理的に使 うならば、論理スタイルタグに入れてもよい。

◆整形済みテキスト

整形済みテキストとは、文字端末(iTerm や sshでログインした時)に表示されたコンピュー タの出力である。たとえば、 「コマンドプロンプト」やシェルとの対話の画面の様子をHTMLの文書に張り付 る時に使う。 <PRE></PRE> で該当部分を囲ん だ中では、空白やタブや改行がそのまま有効になる。

HTML記述:

<PRE>
      May 2013
Su Mo Tu We Th Fr Sa
          1  2  3  4
 5  6  7  8  9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
</PRE>
      May 2013
Su Mo Tu We Th Fr Sa
          1  2  3  4
 5  6  7  8  9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
表示例:

      May 2013
Su Mo Tu We Th Fr Sa
          1  2  3  4
 5  6  7  8  9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
May 2013 Su Mo Tu We Th Fr Sa 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31
表(table)を作るために、<PRE></PRE>タグを使う方法 もある。

◆HTMLで使えない文字

次の3つの文字は、HTML の中では特別の意味を持つ。 これらの文字を画面に表示させたい時には、次のように記述する。

表示 HTML中の記述 元の英単語
< &lt; less-than
> &gt; greater-than
& &amp; ampersand
注意: <PRE></PRE>の中でも、 「<」,「>」, 「&」という文字は、解釈される。

◆デバッグ

コンピュータのプログラムに含まれている誤りをバグ(bug、虫)という。バグ を取ることをデバッグという。

デバッグ中のものは、サーバに置く必要はない。 HTML で何か書いたページは、サーバに置かなくてもWWW ブラウザで直接開い て見ることができる。 ファイル(File)メニューで ブラウザでファイルを開く(Open file) を選ぶ。 ファイルを書き換えたら、エディタで保存して、再読込(Reload) ボタンを押す。

書いた文書が画面に現われない時には、<タグ>の 「>」を書き忘れていないかをチェックする。 漢字の「>」ではなく、 ASCII ( 英字、直接入力 ) の 「> 」である。

終了タグをよく書き忘れる。 </H1> </H2> </H3> を下記忘れると、 ブラウザに画面に大きな字が並ぶ。 </UL> </OL> </DL> を書き下記忘れると、その場所で段づけがおかしくなる。

インライン・イメージがうまく表示できない時には、 <IMG>SRC属性で指定している ファイル名をチェックする。

同様にリンクがうまく開かない時には、<A>HREF属性を調べる。既存のページを差す時には、 まず WWW ブラウザで表示して、そこに現われたものを コピー&ペースト(Copy and Paste) でエディタにもってくる。

◆サンプルの利用

WWW ページを作る時には、0 から HTML によりファイルを作成することもでき るが、気に入ったページを真似して書くことからはじめることもできる。ただ し、著作権には注意する。

コンピュータリテラシの授業で利用できるサンプルを用意している。 練習問題参照。

◆ページの内容

WWWページに期待される内容

  1. 独自性(originality)の高い内容、世界中に他に類似のものがないようなもの。
  2. 有益な使えるもの。自分自信でも、他の人のページにあるといい なあと思うようなもの。

個人のWWWページの場合には、次のような内容のものが期待される。

  1. 自分の名前(漢字がある人は漢字、読み方(平仮名かローマ字))
  2. 電子メール・アドレス
  3. 写真
  4. 関連情報へのリンク

ページの末尾に付ける電子メール・アドレスは、重要である。

WWWページに含めないほうがよい情報

  1. 自宅の住所、生年月日、電話番号。
  2. 法律(特に著作権法)を犯しているもの。
  3. 他人の名誉・プライバシを侵害しているもの。

◆形式

1ページの長さには、注意する。WWWのページとしては、適切な長さがある。 長すぎると、遅い回線からアクセスしている人には、応答が悪くる。細かいペー ジに分割しすぎた場合、ページを手繰る操作がわずらわしくなる。

インライン・イメージの大きさや1つのページに張り付ける数にも注意する。 lynx などのように、イメージが表示できないブラウザを使う人や目の不自 由な人のためにも、インライン・イメージがなくても分かるようなページを作 るとよい。少なくとも、インライン・イメージをクリックしなくても先に進め るようにし、<IMG>タグには、必ずALT 属性を付ける。 さらに、テキストだけのページを用意すると完璧である。

どんな画面の大きさのブラウザで表示しても大丈夫なページを作るようにする。 文字の大きさを変えている人もいれば、小さな画面で見ている人もいる。

◆漢字コード

漢字コード については、選択可能なら、電子メールと同じく JIS にするとよい。 EUC と Shift-JIS では、Web ブラウザによる漢字コードの 自動判定に失敗することがある。

Web ブラウザの自動判定に頼らず、 HTML の <HEAD></HEAD> の中に、 <META>タグを使って漢字コードを明示的に示す方法もある。

JIS
<HEAD>
<META HTTP-EQUIV="content-type" CONTENT="text/html;charset=iso-2022-jp">
</HEAD>
EUC (日本語)
<HEAD>
<META HTTP-EQUIV="content-type" CONTENT="text/html;charset=EUC-JP">
</HEAD>
Shift JIS
<HEAD>
<META HTTP-EQUIV="content-type" CONTENT="text/html;charset=Shift_JIS">
</HEAD>

ワードプロセッサによるテキストでの出力、MacOSX やWindows のテキスト・エ ディタの多くは、Shift JIS を出力することが多い。

■HTML簡易リファレンス・マニュアル

■ファイルの属性[4月23日再掲]

Unixのファイルとディレクトリは、内容(ビット列を保存する)の他に、 所有者、更新された日付などの 属性attributes ) を持つ。

ls -l コマンドを実行するとカレントディレクトリのファイルや ディレクトリの属性が表示される。

$ ls -l [←]
total 162
drwx------   6 yas  prof   4096 Apr  9 20:30 Desktop
drwx------   4 yas  prof   4096 Apr  2 14:14 Documents
drwx------  17 yas  prof   4096 Apr  7 13:35 Library
drwx------  11 yas  prof   4096 Apr 14 17:06 Maildir
drwxr-xr-x   3 yas  prof   4096 Mar  9 12:10 WinFiles
drwxr-xr-x   3 yas  prof   4096 Apr 15 13:35 bin
drwxr-xr-x  35 yas  prof   4096 Apr 12 11:44 coins
-rw-------   1 yas  prof      6 Apr 19 21:25 dead.letter
...
$ []
行単位に次のようなファイルやディレクトリの属性が表示さる。

◆所有者(owner)

ファイルが誰の所有物かを示す。 コンピュータのなかでは人はユーザ名で表されるので、 所有者もユーザ名(上の例ではyas)で表される。

◆グループ名

Unixでは複数のユーザが属する グループ(group)を設定できる。 ファイルは必ずどれか1つのグループに属する。

◆大きさ

ファイルの大きさ(size)は、ファイルの内容をバイト数で数えた値(bit ではな く byte)。

◆時刻

Unixのファイルには、次の3種類の時刻が記録されている
最終アクセス時刻 (the last access time)
ファイルの「内容」が最後にアクセス(読み込み)された時刻。 ls -lu で表示される。
最終更新時刻 (the modification time)
ファイルの「内容」が最後に変更(書き込み)された時刻。 ls -l で表示される「時刻」で、 単に「ファイルの時刻」といった場合にはこの時刻を意味する。
最終変更時刻 (the status change time)
ファイルの「属性」が最後に変更された時刻。 ls -lcで表示される「時刻」。
他の時刻も属性の1つなので、「最終更新時刻」を変更すると、 「最終変更時刻」も変更した時刻も変わる。

◆モード(mode)

ファイルの型とファイルへのアクセス(読み書き)の可否を決めるための属性

ファイルの型

モードの一番左1文字は、ファイルの型(type)を表わす。
-
ファイル
d
ディレクトリ

許可されたアクセス方法

モードからファイルの型を除いた部分はアクセスの可否を決めるための 情報。9文字ある。左から3文字の固まりが3組ある。

各3文字はアクセス毎にその許可・拒否を表す。

r	読込み可
w	書込み可
x	実行可(ディレクトリの場合は探索可)
モードで該当する部分が「-」の場合は、その種類のアクセスが許可さ れてないことを意味する。

「読込み可」とは、その内容を参照できること意味する。たとえば、cp コマン ドでコピーできる。読出し可能なディレクトリなら、ls コマンドでそのディレ クトリ中のファイル名の一覧を表示できる。

「書込み可」とは、その内容を変更することができることを意味する。たとえ ば、テキスト・ファイルなら、エディタで修正したものを書き込むことができ る。書込み可能なディレクトリなら、mv コマンドでそのディレクトリのなかに あるファイル名前を変更できる。

「実行可」というのは、ファイルの内容がプログラムの場合は、 そのプログラムを実行することができる。

ディレクトリに対する 「検索可」というのは、その下にあるファイルやディレクトリを たどっていける(ファイルを開く(読み書きのため)、cd (change directory)できる)という意味である。

ディレクトリが「読込み可」でも、「検索可」でないと、 ディレクトリに「読込み可」のファイルがあっても、 ディレクトリに入ってファイルを読むことができない。 逆に、「検索可」でも、ディレクトリが「読込み可」でないと、 ディレクトリにあるファイル名やディレクトリ名を表示させることが できない。

そのディレクトリにあるファイル名を知っていて、そのファイルが「読み込み 可」なら読むことがでる。

アクセスするユーザによって異なったアクセスの許可・拒否がしたいことがあ る。そのために、rwxの指定は、ファイルの所有者、ファイルの属すグループ、 それ以外の人用に3セット用意されている。

例:モードが「rw-r--r--」のファイル

まとめると、「誰でも読めるが所有者しか書けない」。

◆ls -ld

ls コマンドは、引数としてファイル名やディレクトリ名を指定することができ る。
$ ls -l /etc/passwd [←]
-rw-r--r--   1 root  wheel  1932 Aug 22  2005 /etc/passwd
$ []
ls コマンドにディレクトリ名を与えると、ディレクトリそのものではなく、そ の内容が表示される。
$ ls -l /home/lecture/syspro [←]
total 65
drwx------   2 syspro  lecture  4096 Apr 19 18:53 Desktop
drwx------   8 syspro  lecture  4096 Apr 19 18:53 Library
drwx------   5 syspro  lecture  4096 Mar  1 18:10 Maildir
drwxr-xr-x   3 syspro  lecture  4096 Feb 22 19:56 backupfiles2010
-rw-------   1 syspro  lecture     6 Apr 19 19:14 dead.letter
drwxr-xr-x  11 syspro  lecture  4096 Apr  2 12:40 public_html
drwxr-xr-x   4 syspro  lecture  4096 Apr 12 12:00 secure_html
drwxr-xr-x  11 syspro  lecture  4096 Apr 12 12:00 syspro-2010
drwxr-xr-x   3 syspro  lecture  4096 Apr 19 19:09 tmp
$ []
ディレクトリ自身を表示したい時には、ls -l -d (ls -ld) とする。
$ ls -ld /home/lecture/syspro [←]
drwxr-xr-x  16 syspro  lecture  4096 Apr 19 19:13 /home/lecture/syspro
$ []

■アクセス制御

アクセス制御(access control) とは、「主体」が、「オブジェクト」を「操作」する時、どんな操作なら正し いということを定義して、それがきちんと守られていることをということを保 証することである。

図? アクセス制御における主体、オブジェクト、および、操作

図? アクセス制御における主体、オブジェクト、および、操作

Unixでは、アクセス制御の主体は、プロセスである。 プロセスとは、コンピュータの中で実行中のプログラムのことである。 (プログラムでも、ハードディスクに保存されているものはプロセスではない。) プロセスは、利用者と対応しているので、 アクセス制御では、利用者ごとに許されたアクセスの方法を考えれば良い。

アクセス制御のオブジェクトは、ファイル、または、プロセスである。 操作には、次のようなものがある。

◆ユーザとグループ

Unix (MacOSX, Linux含む), Windows NT/2000/XP では、ユーザ(個人)とグルー プを識別したアクセス制御を行うことができる。 オペレーティング・システムごとに、ユーザやそのグループの考え方は、基本 的には似ているが、細かい所で異なる。

図? 実世界のユーザとUNIX中のプロセス・ファイル

図? 実世界のユーザとUNIX中のプロセス・ファイル

◆ユーザ

ユーザ(user, 利用者)とは、Unixの外では、個人(人間)。 Unixの内部では、次のどれかで表現する。
ユーザ名(user name)
文字列
UID(user ID, user identifier)
16ビット-32ビットの整数

Unixでは、全てのファイルやプロセスは、あるユーザの所有物である。 ファイルとプロセスには、UID が付加されている。

◆グループ

グループ(group)とは、Unixの外の世界では、計算機を使う人間の集合。 Unixの内部では、次のどれかで表現する。
グループ名(group name)
文字列
UID(user ID, user identifier)
16ビット-32ビットの整数

1人のユーザが複数のグループに属することができる。

◆ファイルの属性

ファイルは、属性(ls -l で表示)として、UID と GID を1つずつ持つ。 ファイルの所有者となる個人は、1人。 ファイルが属するグループも1つ。

◆プロセスの属性

プロセスは、UID (1個) と GID を複数個持つ。

◆プロセスのユーザ名とグループ名を調べる

プロセスの所有者のユーザ名を表示するには whoamiコマンドを用いる。
$ whoami [←]
yas
$ []
この例では、この人(のプロセス)のユーザ名は、yas

プロセスが属しているグループのグループ名を調べるには、 groupsコマンドを用いる。

$ groups [←]
ugrad _developer netaccounts everyone com.apple.sharepoint.group.1
$ []
この例では、この人(のプロセス)は、 ugrad, _developer, netaccounts everyone, com.apple.sharepoint.group.1, という5つ のグループに属している。

idコマンドも使える。

$ id [←]
uid=1013(yas) gid=530(ugrad) groups=530(ugrad),204(_developer),62(netaccounts),12(everyone),402(com.apple.sharepoint.group.1)
$ []

◆ファイルの UID・GID 属性を調べる

ファイルの UID 属性(所有者属性)と GID 属性を調べるには、 ls -l (ファイルの場合), ls -ld (ディレクトリの場合) を用いる。
$ ls -l ~/.bashrc [←]
-rw-r--r--  1 yas  prof  183  3  4 15:47 /home/prof/yas/.bashrc
$ ls -ld ~ [←]
drwxr-xr-x  53 yas  prof  12288  5 10 17:55 /home/prof/yas
$ []
この例では、UID 属性が yas、GID 属性が prof である。

◆ファイルに対するアクセス制御

Unixでは、ファイルの「内容」のアクセス制御を次の3段階で行う。
ユーザ
ファイルのUID(所有者)が、プロセスのUIDと同じ
グループ
ファイルのGIDが、プロセスのGIDのリストのどれかと同じ
その他
上の2つに当てはまらない時
これをつかって、モード属性の下位9ビットのうち、どの3ビットを使うかを 決める。そして、そのビットが1になっていれば、その操作が許される。

ファイルの「内容」のアクセス3段階であるが、ファイルの「属性」次の2段 階である。

ユーザ
ファイルのUID(所有者)が、プロセスのUIDと同じ
それ以外
ファイルのUID(所有者)が、プロセスのUIDと異なる
ユーザの権限では、ファイルの属性(モード、グループ、時刻)を変更する ことができる。それ以外の権 限では、属性を読み出すことはできるが、変更は一切できない。 つまり、ファイルの内容がアクセスできなくても、ls -l で 属性を調べることはできる。

◆ディレクトリのxの働き

ディレクトリのモードで x は、そのディレクトリの内容を検索できることを意 味する。ディレクトリの x を落すことで、それ以下の部分木全体のアクセスを 禁止することができる。

(ホームディレクトリ以下の)ディレクトリの x を使ったファイルへの読み込み アクセスの許可と禁止。

図? /home/user2/public_html/index.html と /home/user2/Maildir/mail1

図? ディレクトリのxの働き

ファイル /home/user2/public_html/index.html を読むには、次のディレクト リとファイルのモードが必要になる。途中で x が1つでも途絶えると、アクセ スできなくなる。
  1. / の x
  2. home の x
  3. user2 の x
  4. public_html の x
  5. index.html の r
ファイル /home/user2/Maildir/mail1 を読むには、次のディレクト リとファイルのモードが必要になる。途中で x が1つでも途絶えると、アクセ スできなくなる。
  1. / の x
  2. home の x
  3. user2 の x
  4. Maildir の x
  5. mail1 の r

◆スーパー・ユーザ

どのようなアクセスも可能な無敵のユーザ。

スーパー・ユーザ(super user) は、UID が 0 。 特権ユーザ(privileged user)ルート(root)su (su コマンド、あるいは super user の略)ともよばれる。 スーパーユーザのユーザ名は、慣例として root という文字列が使われる。

ファイルのバックアップなど、システム管理の作業には スーパー・ユーザの仕組みが必要になる。

ファイルの UID・GID 属性を変更する

ファイルの UID 属性(所有者属性)を変更するには、chown コマ ンドを用いる。ただし、スーパーユーザの権限が必要である。

ファイルをコピーして、元ファイルを消すことはできる。

ファイルの GID 属性を変更するには、chgrp コマンドを使う。 一般ユーザは、自分が属しているグループにのみ変更できる。 任意のグループに変更するには、スーパー・ユーザの権限が必要である。

◆ユーザ名とUID、グループ名とGIDの対応、属性の伝播

■ファイルのモードの変更

◆chmod コマンド

chmodコマンドは、ファイルのモード属性を変更するためのコマンド。
$ ls -l file1.txt  [←]
-rw-r--r--  1 yas  prof  2  5 10 18:59 file1.txt
$ chmod go-r file1.txt  [←]
$ ls -l file1.txt  [←]
-rw-------  1 yas  prof  2  5 10 18:59 file1.txt
$ []
file1に対して、グループ(g)とそれ以外の人(o)に対して「読込み可」の許可を 取り除いている。

chmodは一般的には次の形式で実行する。

$ chmod set file1 file2 ... [←]
set の形式
[ugoa][=+-][rwx]
ここの[ugoa]は、誰に対するアクセスの設定を変更するかを対象となる人を以 下の表から選んで並べる(複数可)。
文字 単語 意味
u user ユーザ(利用者,所有者)
g group グループ
o others その他
a all 全員、ugo と同じ
[=+-]の意味
文字 意味
+ 許可を追加する
- 許可を除く
= 指定した許可だけとする
[rwxXst]の部分には次のような指定が可能。
文字 単語 意味
r read 読込み可
w write 書込み可
x execute 実行可
X execute 実行可(所有者に対して「実行可」がある時だけ)
setには[ugoa][=+-][rwx]の指定を「u=rw,og=r」のように「,」で区 切って複数並べることもできる。

chmod には、-R (recursive)オプションがある。 これは、ディレクトリをたぐり全部変更することを意味する。

◆モードの実例

rw-r--r--
誰かでも読めるファイル
rwxr-xr-x
誰かでも読めるアクセスできるディレクトリ。 xもたてる。 (たてる==ビットを1にする。)
rwxr-xr-x
実行可能ファイル
rwx------
MH や Mew を使っている場合は、~/Mail ディレクトリのモード
rw-r--r--
WWWページ用のファイル (~/public_html以下のファイル)
rwxr-xr-x
WWWページ用のディレクトリ (public_html以下のディレクトリ)
rwxr-xr-x または rwx--x--x
WWWページを作成する時のホーム・ディレクトリ (~~/public_html の親ディレクトリ)。 x ビットを出す。
rw-rw-r-- または rwxrwxr-x
グループで共同作業するような時には、グループに属する人には書き込みを許す。
r-xr-xr-x, r-x------
読み込み専用のディレクトリ。 その下のファイルを削除することができない。
注意:WWWページを作成する時には、ホーム・ディレクトリのモードにも注意す る。ホーム・ディレクトリがrwx------になっていたら、いくら ~/public_html のモードを rwxr-xr-x にしても、アクセスで きない。

■Emacs

◆ファイルの編集の基本

◆別のファイルへ保存

読み込んだファイルとは別のファイルに保存することができる。 前回のレポートを修正する時に便利。早めに C-x C-w で書き込むこと を奨める。さもないと元のファイルを壊してしまうことになる。

類似のことは、cp コマンド等で元のファイルを別のファイルにコピーしてから、 別のファイルを Emacs で修正してもできる。

◆Emacs補完機能

The Unix Super Text 12.5.1 補完 参照 手引き 3.2.4 ファイル操作 参照

Emacs でファイル名や関数名(M-xの後)を打つ時にも、補完機能がある。 bash にも Emacs をまねて補完機能がある。

■実習

実習時間中には、 以下の課題をできるだけ多く行いなさい。全部を行う必要はない。

★練習問題(801) Emacsの復習

Emacs で、ファイルを作成する方法を復習しなさい。

方法1: 引数にファイル名を与える方法。

方法2: 実行後にファイル名を与える方法

★練習問題(802) Emacs C-x C-w

Emacs で別のファイルへ保存する機能を練習しなさい。

★練習問題(803) emacs、タブキーによる補完機能

The Unix Super Text 12.5.1 補完 参照手引き 3.2.4 ファイル操作 参照

Emacs の補完機能(タブキー)を確認しなさい。

以下の例は、/etc/passwd をタブキーにより開く例である。
  1. emacs を実行する。
    $ emacs [←]
  2. ファイルを開く。C-x C-f
    Find file: ~/[]
  3. ~/」の2文字を消す。Delete キーを 2 回打つ。
    Find file: []
  4. /e」と打ちタブを打つ
    Find file: /e[tab]
    すると、tc/が補完される。
    Find file: /etc/[]
  5. pa」と打ちタブを打つ
    Find file: /etc/pa[tab]
    すると、いくつか候補が表示される。
    In this buffer, type RET to select the completion near point.
    
    Possible completions are:
    pam.d/                             passwd
    passwordreset/                     paths
    paths.d/
    
    <中略>
    
    Find file: /etc/pa[]
    
  6. s」と打ちタブを打つ
    Find file: /etc/pas[tab]
    すると、「wd」が補完される。
    Find file: /etc/passwd[]
  7. 目的のファイル名が見つかったので、最後にリターンキーを打つ。
    Find file: /etc/passwd[←]
その他に、次のファイルを補完により開きなさい。

★練習問題(804) WebブラウザーでのHTMLの観察

この課題の前に、 マウスの設定 がなされており、 「副ボタン」が設定されていることを確認しなさい。

Firefoxブラウザを操作して、 元の HTML (ソース)を表示 しなさい。

  1. HTML を表示したいページを Firefox で普通に表示する
  2. 表示されたページで、何も表示されていない部分(白い部分)にマウスの ポインタを移動して、マウスの主ボタン(左ボタン)でクリックする。(何か選 択している状態だったらこれで解除される。)
  3. マウスの副ボタン(右ボタン)でコンテキスト・メニューを表示する。 Mac では、マウスの右ボタンの代わりに、コントロール・キーを押しながらボ タンを押すことでもよい。
  4. コンテキスト・メニューから「ページのソースを表示」を選ぶ。
コンテキスト・メニューを使うかわりに、「Command+u」 (Command+u)を押す方法もある。

Firefoxのコンテキスト・メニュー、ページのソースを表示。 (クリックで拡大)

★練習問題(805) 画像の読み込み

Firefox, Safari などのブラウザで、画像の読み込み機能をオンにしたりオフ にしたりして、Web ページを表示しなさい。

Firefox

Safari

★練習問題(806) MacOSX 「デフォルトWebブラウザ」

MacOSX では、次のような場合に 「デフォルトWebブラウザ」として登録されているWebブラウザが実行される。
$ open http://www.coins.tsukuba.ac.jp/ [←]
$ open file1.html [←]
この結果、「デフォルトWebブラウザ」として登録されているブラウザが実行さ れ、その URL で示されたWeb ページやファイルが表示される。この機能を確認 しなさい。

★練習問題(807) MacOSX 「デフォルトWebブラウザ」の設定

Safari.app を使えば、「デフォルトWebブラウザ」を好みのものに変更するこ とができる。この機能を確認しなさい。

★練習問題(808) WWWページ用のディレクトリ作成

筑波大学情報学類コンピューティング環境では、個人の WWW ページは、次のよ うな URL で参照される。

ユーザ名」を、ログインの時に打つ自分のユーザ名で置き 換えなさい。 この URL は、次のディレクトリに対応する。 このディレクトリを、mkdir コマンドで作成しなさい。
$ mkdir ~/public_html [←]
作成したディレクトリのその他(others)に対するアクセス許可で x ビットが立っ ていることを確認しなさい。
$ ls -ld ~/public_html [←]
drwxr-xr-x   55 yas  prof  1870 May  1 22:43 /home/prof/yas/public_html
$ []
         ^ここ
さらに、ホーム・ディレクトリにもその他(others)に対するアクセス許可で x ビットが立っていることを確認しなさい。
$ ls -ld ~ [←]
drwxr-xr-x   82 yas  prof  2788 May 22 17:35 /home/prof/yas
$ []
         ^ここ

x ビットがたっていない場合には、その効果を理解し、 chmodコマンド で変更しなさい。

ディレクトリを作成してもディレクトリが空の時に、 Web ブラウザで http://www.coins.tsukuba.ac.jp/~ユーザ名/ を開くと次のようなエラーが表示される。

Forbidden

You don't have permission to access /~ユーザ名/ on this server.

これは、意図された動作である。

★練習問題(809) 単純なテキスト・ファイルの公開

注意:この練習問題は、練習問題 (808)WWW ページ用のディレクトリ作成の後に行いなさい。

ディレクトリ ~/public_html/ の下に、単純なテキスト・ファイル (HTMLではない)を Emacs 等で作成して置きなさい。ファイル名の拡張子は、 「.text」または「.txt」としなさい。

作成したファイルのモードを調べなさい。file1.textという 名前のテキスト・ファイルを作成した場合、次のようにその他(others)に対す るアクセス許可で r ビットが立っていることを確認しなさい。

$ cd ~/public_html [←]
$ emacs file1.text [←]
$ ls -l file1.text [←]
-rw-r--r--   1 yas  prof  2 May 22 22:09 file1.txt
$ []
       ^ここ
作成したファイルを Web ブラウザで表示しなさい。たとえば、 file1.textという名前のテキスト・ファイルを作成した場合、 次のような URL で参照する。

ユーザ名を、ログインの時に打つ自分のユーザ名で置き換え なさい。HTTP で始まる URL には、public_html は含まれないことに注 意しなさい。

★練習問題(810) サンプルのコピー

注意:この練習問題は、練習問題 (808)WWW ページ用のディレクトリ作成の後に行いなさい。

次の HTML ファイルを、ディレクトリ ~/public_html/ の下にコピー し、それを Web ブラウザ表示しなさい。

$ cd ~/public_html [←]
$ cp ~yas/public_html/coins/literacy-2013/samples/sample1.html . [←]
注意: 最後のカレント・ワーキング・ディレクトリの意味の「.」を 忘れないこと。

コピーした後、Web ブラウザで次の URL を開きなさい。

ユーザ名を、ログインの時に打つ自分のユーザ名で置き換え なさい。HTTP で始まる URL には、public_html は含まれないことに注 意しなさい。

★練習問題(811) 個人のホーム・ページの作成

個人のホーム・ページを作成しなさい)。 各自のホーム・ページは、次の HTML ファイルに対応する。

作成したホーム・ページを、Web ブラウザで開きなさい。 Web ブラウザで次の URL を開きなさい。

★練習問題(812) ディレクトリを指定した時のWebページの内容

URL でディレクトリを指定すると、自動的にそのディレクトリにある 「index.html」という名前のファイルが使われる。この機能を使うと、 各自のホーム・ページは、次のように短く表示できる。

この事を確認しなさい。また、ホーム・ページ以外のページについても、この 機能が有効なことを確認しなさい。

★練習問題(813) Emacs HTMLモード

Emacs で拡張子が .html のファイルを開くと、「HTML モード」と呼ばれるモー ドになり、HTML の編集に有用な機能が働くようになる。次のようにして、どの ような機能が利用可能か調べなさい。

この結果、ウインドウが開かれ、説明が表示される。 説明を消すには、C-x 1 (Control+x の後に数字の1) と打つ。

★練習問題(814) Emacs font-lock-mode

font-lock-mode とは、編集しているテキストに含まれるキーワード等を強調し て(色をつけて)表示するモードである。font-lock-mode は、マイナー・モー ドの一種で、HTMLモードやTextモード等のメジャーモードと一緒に使える。次 のようにすると、font-lock-mode を on にしたり off にしたりできる。この 機能を確認しなさい。
M-x font-lock-mode[←]

★練習問題(815) whoami,groups,idコマンド

whoami, groups, idコマンドを使って、プロセス(シェル)のUID, GID, groups 属性を表示しなさい。
$ id [←]
$ whoami [←]
$ groups [←]

★練習問題(816) ls -l、ls -ld コマンド

ルートからホームディレクトリにいたる間でのディレクトリのモードを調べな さい。
$ echo ~ [←]
$ ls -ld / [←]
$ ls -ld /home [←]
$ ls -ld /home/ugrad/ [←]
・・・中略・・・
$ ls -ld  ~ [←]
ディレクトリ ~/public_html や ~/public_html/index.html のモードを調べな さい。
$ ls -ld ~/public_html [←]
$ ls -l  ~/public_html/index.html [←]
他の人(WWWページとして公開するために、WWWサーバ・プロセスからのアクセ スも含む)がアクセスしようとしたらどうなるかを考察しなさい。

その他に、次のファイルやディレクトリのモードを調べなさい。

★練習問題(817) chmod コマンド

chmod コマンドで、ファイルやディレクトリのモードを変更しなさい。 以下の例は、file1に対して、グループ(g)とそれ以外の人(o)に対して「読込み 可」の許可を取り除いている。
$ ls -l file1.txt  [←]
-rw-r--r--  1 yas  prof  2  5 10 18:59 file1.txt
$ chmod go-r file1.txt  [←]
$ ls -l file1.txt  [←]
-rw-------  1 yas  prof  2  5 10 18:59 file1.txt
$ []
go-r を含めて、様々なモードの設定方法がある。 次の設定方法の意味を確認しなさい。

★練習問題(818) 8進数を利用したchmodコマンド

chmod コマンドは、モードを8進数で与えることもできる。 このことを man で確認しなさい。また、利用してみなさい。 8進数で指定することの利点を考えなさい。

★練習問題(819) chgrp コマンド

chgrp コマンドで、ファイルやディレクトリのGID属性を変更しなさい。
$ ls -l file1.txt [←]
(ファイルのグループの表示)
$ id [←]
(自分(プロセス)が属しているグループの表示)
$ chgrp グループ file1.txt [←]
$ ls -l file1.txt [←]
(ファイルのグループの表示)
$ []
(3) まず、適当な内容を持つテキスト・ファイルを作成しなさい。そして、次 のような要求を満たすように chmod コマンドを使ってモードを変更しなさい。 提出するファイルには、chmod コマンドをどのように利用したか、また、その 結果 ls -l の表示がどのようになったかを含めなさい。

★練習問題(820) ディレクトリのGIDの伝播

UIDとGIDの伝播を確認しなさい。 /tmp など、誰でも書き込みできる場所にファイルを作成すると、その ファイルの UID 属性はどうなるか調べなさい。新たに実験用のディレクトリを mkdir コマンドで作成しなさい。そのディレクトリのGID属性を chgrp で変更 し、その中に新たなファイルやディレクトリを作成したら、その GID がどう設 定されるかを確かめなさい。また、既存のファイルをmv コマンドで移動したら どうなるかを調べなさい。

★練習問題(821) WWWページのファイルのモード

WWW ページとして公開するファイルのモードはその他(others)に対するアクセ ス許可で r ビットが立っている必要がある。もし、このビットを chmod o-r で落した場合、Web ブラウザでアクセスできなくなる。このことを確かめなさ い。

$ ls -l sample1.html  [←]
-rw-r--r--  1 yas  prof  408  5 18 11:11 sample1.html
<WWWブラウザでアクセス>
$ chmod o-r sample1.html  [←]
$ ls -l sample1.html  [←]
-rw-r-----  1 yas  prof  408  5 18 11:11 sample1.html
<WWWブラウザでアクセス>
$ chmod o+r sample1.html  [←]
$ ls -l sample1.html  [←]
-rw-r--r--  1 yas  prof  408  5 18 11:11 sample1.html
<WWWブラウザでアクセス>

同様に、ディレクトリを作成し、その他(others)に対する x ビットを立てたり 落したりしながら、その効果を確認しなさい。

$ mkdir dir1 [←]
$ emacs dir1/file1.html [←]
$ ls -ld dir1 [←]
$ ls -l dir1/file1.html [←]
<WWWブラウザでアクセス>
$ chmod o-x dir1 [←]
$ ls -ld dir1 [←]
<WWWブラウザでアクセス>

★練習問題(822) FirefoxによるWebページの保存

Firefox で保存したい Web ページを表示しなさい。 そして、その内容をファイル保存しなさい。

保存の方法には、次のような方法がある。
Web ページ,完全
HTML と中に含まれている画像を保存する
Web ページ,HTMLのみ
HTML だけを保存する。
テキストファイル
HTML の中からテキストだけを抜き出して保存する。 空白で字下げなどを行う。
これらの違いを調べなさい。

★練習問題(824) wgetコマンド

wget は、引数として与えられたURLで指定された資源を取得し、ファイルに保 存するコマンドである。コマンドラインから実行できる。次の例は、資源 http://www.coins.tsukuba.ac.jp/~yas/coins/literacy-2013/samples/sample1.html を取得し、ディレクトリ ~/dir 以下の sample1.html という名前のファイルに 保存している。

$ cd ~/dir [←]
$ wget http://www.coins.tsukuba.ac.jp/~yas/coins/literacy-2013/samples/sample1.html [←]
簡単な使い方は、次のようにすれば表示できる。
$ wget --help [←]
または
$ wget --help | lv [←]
wget コマンドは、標準出力に使い方を出力する これを lv で表示するには、パイプ機能 | を用いる。

詳しくは、man wget を見なさい。

★練習問題(825) Web ブラウザ w3m

w3mは、 iTerm などの文字端末で動作する Web ブラウザである。 w3m を使ってみなさい。

$ w3m -e http://www.coins.tsukuba.ac.jp/ [←]
$ w3m -e ~/public_html/index.html [←]
-e オプションを使うと、端末の文字コードが EUC になる。 次のように打つと、詳しい説明が表示される。
$ w3m --help 2>&1 | lv [←]
w3mコマンドは、標準エラー出力に使い方を表示する。 これを lv で表示するには、2>&1 | を用いる。

詳しくは、man w3m や次の Web ページを見なさい。 http://w3m.sourceforge.net/

★練習問題(826) Web ブラウザ lynx

iTerm などの文字端末で動作する Web ブラウザ lynx を使ってみなさい。

$ lynx [←]
$ lynx ~/public_html/index.html [←]
The Unix Super Text 28.3節 参照

★練習問題(827) HTMLの検査

Another HTML-lint gateway (ミラーサイト) を使って、作成したページの検査を行いなさい。 また、その解説を読みなさい。どの HTML の文法に従うのがよいかを考えなさ い。厳密な HTML の文法に従うことの意義について考えなさい。

★練習問題(828) Firefoxの言語選択

Web ページの中には、1つの URL に対して複数の言語で資源が用意されている ことがある。Firefox は、Web サーバに対して表示可能な言語を送信している。 Web サーバは、受け取った言語のリストの中から、資源を選択して返す。

Firefox の言語選択機能で、どの言語が選択されているか調べなさい。

  1. 「Firefox」メニューから「環境設定」を選ぶ。
  2. 「コンテンツ」タブを選ぶ。
  3. 「言語設定」ボタンを押す。
言語のリストを編集したり、言語の優先順位を変更することができる。

この機能を利用してみなさい。複数の言語で記述されているページを探して、 表示が切り替わることを確認しなさい。

★練習問題(829) emacs、スペース・キーによる補完

Emacs では、ファイル名の補完に、タブキーではなく、スペース・キーを使う こともできる。 The Unix Super Text 12.5.1 参照 この違いを確認しなさい。

MacOSX で動作する Emacs のバージョンによっては、スペースキーでの補完が 標準ではできないことがある。この時には、タブキーを使うか、次のような設 定を ~/.emacs 等の起動時に実行されるファイルに含める方法がある。 こうすると、ファイル名に空白を使いにくくなる。

(if (boundp 'minibuffer-local-filename-completion-map)
     (define-key minibuffer-local-filename-completion-map
       " " 'minibuffer-complete-word))
(if (boundp 'minibuffer-local-must-match-filename-map)
    (define-key minibuffer-local-must-match-filename-map
      " " 'minibuffer-complete-word))

■課題8 HTML による WWWページの作成

(1) HTML で次のような条件を満たす WWW ページを作成しなさい(注意: ホーム・ページでなくともよい)。

  1. <HTML>、<HEAD>、<TITLE> <BODY>タグを含む。
  2. 自分の名前を含む。 漢字の名前がある人は漢字と読み方(平仮名かローマ字))を含む。
  3. 電子メールのアドレスを含む。 (spam対策を行ってもよい。)
  4. 見出しタグ(<H1>、<H2>、<H3>な ど) による見出しを含む。見出しの内容とては適切なものであることを期待す る。(適切な見出しを付ける練習をすると良い。練習しないと上達しない。)
  5. <P>タグによるパラグラフがある。
  6. <A href="..."></A>によるハイパーリンクを含む。
  7. <IMG>タグによる画像を含む。画像の形式は、PNG、または、JPEG。 IMG タグには、ALT属性を付ける。
  8. 物理スタイルタグ含まない
  9. 他のタグで代替可能な <BR>タグを 含まない
  10. 画像が表示されないブラウザで表示しても、すべてのハイパーリンクをた どることができる。
作成した WWW ページの URL (http:// から始まるもの)をレポートに含めなさ い。レポート提出後も WWW ページを修正しても良いが、採点が済むまでは、上 の条件を満たし続けること。

(2) Web ページには、ある条件の本で他人の著作物を含めることができる。(1) で作成した WWW ページに、他人の著作物がある場合には、その出典をレポー トに記述しなさい。また、その著作物を WWW ページに利用してもよいことを 示す根拠を説明しなさい。他人の著作物を含めてはない場合には、「他人の著 作物は含まれていない」とレポートに記述しなさい。

(3) (1) で作成した WWW ページがホーム・ペー ジかどうか記述しなさい。ホーム・ページの場合、「ホーム・ページである」 と記述しなさい。そうでない場合、「ホーム・ページではない」と記述しなさ い。

(4) 次のファイルの属性を ls -l で調べなさい。

調べ方の例:
$ cd ~/Library/Application*Support/Firefox/Profiles/* [←]
$ ls -l cookies.sqlite [←]
このファイルの次の属性を示しなさい。 モードについて、ファイルと同じグループに属する人、その他の人からのアク セスが、このファイル単体でどうなるかを説明しなさい(例: 読み/書き/実行で きる)。

(5) 問題(4) のファイルで、モードに r があったとしても、ファイルと同じグ ループに属する人やその他の人からは、このファイルを読むことができない。 その理由を具体的に木構造の概念を使いながら説明しなさい。

(6) [加点] ハイパーリンクで、 破片識別子(fragment identifier) を利用したページを作成しなさい。 <A>のname属性で、HTML の内部にハイパーリンクの先となる マークをつけなさい。そして、 <A>のhref属性では、# を使って、name属性でマークした部分を指し示しなさい。

レポートには、ページ全体の URL と破片識別子で用いた name 属性の値を含め なさい。

(7) [加点] 次のいずれか1つを行いなさい。

(7a) [加点] (1) のページが英語以外の言語の場合、英語、英語の場合、日本語 で同一内容のページを作成しなさい。それらのページの間で相互にリンクを貼 りなさい。

(7b) [加点] WWW サーバ Apache には コンテントネゴシエーション 機能の機能がある。この機能を使うと、同じ URL でも、ブラウザの設定により (異なる言語による)異なる内容のページが返される。この機能を用いた WWW ページを作成しなさい。また、Firefox やその他のブラウザの機能を用いて、 そのことを確認しなさい。


Last updated: 2013/05/27 11:27:32
Yasushi Shinjo / <yas@cs.tsukuba.ac.jp>