Languageの略ですが、ハイパーテキストとは何でしょうか?これは、文章を最初から順に読んでいくだけではなくて、文章の中に「リンク」(「ハイパーリンク」と言う場合もあります)があり、それをたどると関連するところへジャンプできるようにしたものです。03-1(☆☆☆)参考資料でリンクの書き方を調べなさい。ホームページを検索し、練習問題02-4で書いた自己紹介からリンクしなさい。ホームページが見つからない場合は、箇条書きに慶應大学を追加して、SFCのホームページにリンクしなさい。他の人のサイトに無断でリンクを張るのは構わないのでしょうか?著作権法に関しては問題無いと解釈されています(下記参考資料を参照)。そのサイトにリンクに関する条件や指示が書かれている場合は、道義的にそれを尊重すべきでしょう。Locatorの略で、ウェブページの住所のようなものです。典型的なURLは次の形をしています。スキーム(プロトコル)は、ブラウザがどうやってページのソースを取ってくるかという方法を表しています。これはネットワークを使わずに自分のコンピュータに保存されているファイルを使うという意味です。ホスト名は、それぞれのコンピュータに付けられた名前で、どのコンピュータからソースを取ってくるかを示しています。場合は、自分のコンピュータからに決まっているので、ホスト名は書きません。パス名は、コンピュータの中でどのファイルを取ってくるかを示しています。スキーム(プロトコル)とホスト名については、「情報基礎2」で詳しく勉強します。絶対URLと相対URLURLは住所のようなものなので、世界中のウェブページの中から目的のページを探し出せるようになっていますが、その分どうしても長くなってしまいます。近所の家について話す時には「うちの2軒右の家」と言って、いちいち「神奈川県藤沢市...」と言わないように、今表示しているページのURLを基準にして「近所」のウェブページを簡単に指定できる書き方もあります。2014年度以降入学者」のリンクをクリックし、そのページがどのようなURLなのか見なさい。http://itclass.sfc.keio.ac.jp/guide/index.htmlのように、どこにあっても常に同じページを指すURLを「絶対URL」、new.htmlのように現在のページを基準にして他のページを指すURLを「相対URL」と呼びます。全世界のどのウェブページでも指し示すことができる。リンクを書く場所によらず、同じURLになる。短く書くことができる。複数ページから成るウェブサイト全体を他の場所に移動する時、リンクを書き直す必要がない。URLの書き方の規則は、次の「ファイルシステム」を勉強すればわかります。http://itclass.sfc.keio.ac.jp/guide/でも同じページが表示されますが、転送や省略の機能を使っているので、http://itclass.sfc.keio.ac.jp/guide/index.htmlが正式なURLです。ファイルシステムURLのパス名の書き方を知るには、コンピュータがファイルをどうやって管理しているかを知らないといけません。ディスクの中でファイルがどのように格納されているかということを「ファイルシステム」と呼びます。ファイルとディレクトリ(PPT版ダウンロード)ファイル名には日本語の文字も使えますが、トラブルの原因になる(例えばWindowsとMacの間でファイル転送した時に正しく表示されない)ことがあります。ファイル名の中に空白文字が入っていると操作を間違いやすくなります。この授業では、ファイル名にはアルファベットと数字だけを使うようにしてください。自分のファイルを他の人が勝手に読み書きすると困りますが、複数人で共有したい場合もあるので、ファイルごとにアクセス権を設定できます。(PPT版ダウンロード)普通はユーザごとに別のディレクトリを使い、他のユーザは勝手に書き込んだりできないようになっています。設定を変えれば他のユーザも書き込めるようにできます。共用領域を使って練習してみましょう。03-3(☆☆☆☆)エディタで適当な内容を書き、ex03-3.txtという名前で保存しなさい。Finderのメニューで【移動】→【フォルダへ移動...】を実行し、/pub/sfc/ipl/info1-freeの中身を表示しなさい。これは、共用領域の中にあるディレクトリで、誰でもファイルを作れるように設定してあります。ex03-3.txtを/pub/sfc/ipl/info1-freeに移動してみなさい。他の人が作った同じ名前のファイルがあると移動できません(他の人のファイルに上書きする権限は無いため)。何か別の名前に変えてから移動しなさい。隣の人からファイル名を教えてもらい、隣の人が作ったファイルをエディタで開けるかどうかやってみなさい。そこに何か書き足して保存しようとするとどうなるでしょうか?ファイルを右クリックして【情報を見る】を実行しなさい。ファイルの情報の一番下に「共有とアクセス権」があります。「everyone」のところが他のユーザからのアクセスを許可・禁止するところです。アクセス権は何になっているでしょうか?隣の人に、ファイルの「everyone」のアクセス権を「読み/書き」に変更してもらい、隣の人のファイルを変更して保存できるかやってみなさい。付けたものが絶対URLになります。ホスト名を書かないのでスラッシュが3個並ぶことに注意してください。場合、ファイルシステムの絶対パス名がそのまま絶対URLのパス名部分になるとは限りません。なるのかと言うと、ウェブサーバの設定によるので一概には言えません。SFC-CNSの場合にどうなるかは後で説明します。相対URLは、プロトコルもホスト名も書きません。ファイルシステムの相対パス名がそのまま相対URLになります。03-4(☆☆☆)練習問題02-4で書いた自己紹介introduction.htmlと同じディレクトリにlink.htmlという名前で次の内容のファイルを作りなさい。--></body></html>body要素の中に相対URLで自己紹介へのリンクを書きなさい。ブラウザでlink.htmlを開き、リンクをクリックして自己紹介へ飛べることを確認しなさい。同じディレクトリに、dirAという名前で新しいディレクトリを作りなさい。link.htmlをdirAの中に移動しなさい。link.htmlの相対URLを修正して、正しく飛べるようにしなさい。自己紹介とdirAがあるディレクトリに、dirBと言う名前で新しいディレクトリを作りなさい。自己紹介をdirBの中に移動しなさい。link.htmlの相対URLを修正して、正しく飛べるようにしなさい。introduction.htmlは元の場所に戻しておきましょう。今まで作ったページは自分しか見ることができませんでした。アクセス権の設定によっては他の人も見ることができますが、それもCNSにログインしている人に限られます。今度は、作ったページをインターネットに公開し、世界中の誰でもそのページを見ることができるようにします。詳しい仕組みは「情報基礎2」で勉強しますので、ここでは公開する方法だけ練習します。SFC-CNSでは、ユーザごとに特定のディレクトリにファイルを置けば、自動的にインターネットに公開されます。そのディレクトリの場所は次の通りです。絶対パス名は/home/ログイン名/public_htmlです。特別教室のiMacでは、デスクトップにpublic_htmlというディレクトリがあります。(無い場合はCNS_HOMEDIR→public_htmlを使ってください。下の説明動画はこちらの方法を使っています。)他の人がブラウザで見る時は、http://web.sfc.keio.ac.jp/~ログイン名/ファイル名というURLでアクセスします。~(チルダ)が付くことに注意しなさい。03-5(☆☆)ファイルex03-5.htmlを次のように書きなさい。charset="utf-8"><title>練習問題03-5</title></head><body><h1>インターネットに公開してみるテスト</h1><p>ほげほげ</p></body></html>「ほげほげ」を何か好きな言葉に置き換えなさい。このファイルをpublic_htmlディレクトリに移動しなさい。ブラウザでhttp://web.sfc.keio.ac.jp/~自分のログイン名/ex03-5.htmlにアクセスしてみなさい。隣の人のログイン名を聞き、ブラウザでhttp://web.sfc.keio.ac.jp/~隣の人のログイン名/ex03-5.htmlにアクセスしてみなさい。スマホを持っている人は、スマホのブラウザで自分のex03-5.htmlと、隣の人のex03-5.htmlをアクセスしてみなさい。自分のパソコンで作ったファイルをインターネットで公開したい場合は、CNSのpublic_htmlにファイルを転送します。「6CNSサーバ」の章を見てください。公開するファイルのアクセス権は、誰でも読めるようにしておく必要があります。CNSでは普通にエディタでファイルを作るとそのようになります。ファイル転送ソフトや圧縮ソフトによって作ったファイルは自分しか読めない設定になることがありますので注意してください。public_htmlの中にディレクトリを作る場合は、URLのファイル名の部分はpublic_htmlからの相対パス名になります。public_htmlの中にhobbyというディレクトリを作り、その中にmusic.htmlを置いた場合のURLはhttp://web.sfc.keio.ac.jp/~自分のログイン名/hobby/music.htmlになります。03-6(☆☆)public_htmlディレクトリの中に、新しくinfo1という名前のディレクトリを作りなさい。ex03-5.htmlをinfo1ディレクトリの中に移動しなさい。ex03-5.htmlのURLはどう変化するでしょうか?ブラウザでアクセスして確認しなさい。隣の人のex03-5.htmlもアクセスしてみなさい。ウェブページを公開する際は、著作権法などの法律を守ることはもちろんですが、SFC-CNS利用内規で「慶應義塾大学の品位を落とすような行為」も禁止されていますので、注意してください。introduction.htmlのような個人情報を含むファイルを不用意に公開しないようにしてください。著作権ウェブページを公開するときには著作権について注意しなければいけません。03-7(☆)特別教室iMacのデスクトップ→Share_zmac→index.htmlを開くと「情報倫理デジタルビデオ小品集3」を見ることができます。次の項目を見て、どのような内容か簡単にまとめなさい。Webカメラは肖像権を侵害?注意:ライセンスにより、特別教室のiMacでしか再生を許可されていませんOSのバージョンアップが原因で、Firefoxでは再生できなくなりました。Safariで再生するときは次のように設定してください。03-8(☆☆)無料で写真・イラスト・BGMなどウェブページ制作用の素材を公開しているサイトがあります。そのようなサイトをいくつか探し、利用規約がどのようになっているか調べなさい。無料ダウンロードサイトには、ウイルスやスパイウェアなど悪意のあるソフトをばらまくサイトもあります。HTMLHTMLとはページのソース前回、ワードプロセッサで作ったファイルをターミナルで表示してみると、画面に見える文章とはぜんぜん違うということをやりました。ウェブページでも同じようなことがあります。02-1(☆)Firefoxで適当なページを表示し、メニューの【ツール】→【Web開発】→【ページのソース】を選択しなさい。通常の表示とソースの間の対応関係は見当がつくでしょうか?ウェブページとしてコンピュータの中に保存されているのは、ソースの方です。通常目にする画面は、ソースに書かれている内容を元にして、ブラウザが人間に見やすいように表示してくれたものです。ウェブページに限らず、コンピュータの中で何か処理をする時に元になるものは、ソースと呼びます。ソース(source)は「源」という意味です。sauceではありません。試しに簡単なウェブページを作ってみましょう。02-2(☆)テキストエディタで次の内容を書き、ファイルに保存しなさい。