ウェブページの作成

ウェブサイトの初期設定手順

  1. Internet Exploreを全画面モードに拡大している場合はウィンドウを縮小すること.
  2. Internet Explorer を使って,以下のURLを開きなさい.
    http://www.e.gsic.titech.ac.jp/~wakita-k-aa/scripts/
    
  3. setup_home.py をクリックせず,右クリックして表示されるメニューから「対象をファイルに保存(A)…」を選択し,デスクトップに保存しなさい.ダウンロードが完了したら,デスクトップを眺めて,確かに setup_home.py が保存されていることを確認しなさい.setup_home.py はウェブサイトを利用できるようにするための設定である.
  4. setup_home.py をダブルクリックして実行しなさい.

  5. 正常に設定が完了した場合には,z: ドライブpublic_htmlという名前のフォルダが作成される.このフォルダのなかに保存したデータがウェブサイトに登録される.あなたのウェブサイトのフォルダは,URL は以下のようになる.

    http://www.e.gsic.titech.ac.jp/~アカウント名/
    

たとえば,アカウント名が12B01234という人がpublic_htmlフォルダのなかにBirthday.movというムービークリップを保存すると,このムービークリップは以下の URL としてウェブに公開される.

    http://www.e.gsic.titech.ac.jp/~12B01234/Birthday.mov

実習1 — 写真画像の掲載

  1. 写真画像を用いた実習
  • 写真を撮影可能な電話を持っているか否かに応じて以下のいずれかをしなさい.
    1. 写真を撮影可能な電話を持っている人は,この場で自分の掌を撮影した写真を,電子メールで大学の自分のメールアドレスに送付しなさい.しばらく待てば届くので,Thunderbird を使って添付された写真のファイルを前述の public_html フォルダのなかにmyhand.jpgという名前で保存しなさい.
    2. 写真を撮影可能な電話を持っていない人は,Internet Explorer を使って掌の写真を探し,それを上と同様に保存しなさい.

  • 前述の操作によって,public_htmlフォルダに保存した掌の写真はあなたのウェブサイトに登録されたはずであり,ウェブのURLが割り当てられるはずである.このURLを自分のノートに記載しなさい.

  • Internet Explorer のアドレスバーに,ノートに記載したURLを記入することで,確かに掌の写真が開けることを確認しなさい.


  • 実習2 — 英文テキストの掲載

    1. テキストエディタを用いて作成したテキストファイルをpublic_htmlフォルダのなかにtext-e.txtという名前で保存しなさい.text-e.txtには,英語で適当な字句を記述しておくこと.

    2. 前述のテキストファイルはpublic_htmlフォルダに保存したので,ウェブのURLが割り当てられるはずである.このURLを自分のノートに記載しなさい.

    3. 前述のURLをInternet Explorerのアドレス欄に記入し,該当する英文が確かに開くことを確認しなさい.


    実習3 — 和文テキストの公開

    1. テキストエディタを用いて作成したテキストファイルをpublic_htmlフォルダのなかにtext-j.txtという名前で保存しなさい.text-j.txtには,「日本語」で適当な字句を記述しておくこと.

    2. 前述のテキストファイルはpublic_htmlフォルダに保存したので,ウェブのURLが割り当てられるはずである.このURLを自分のノートに記載しなさい.

    3. ノートに記載したURLをInternet Explorerで開き,なにが表示されるか確認しなさい.もしも文字化けした場合には,どのようにすれば文字化けを避けることができるか,試行錯誤しなさい.


    実習4 — はじめての HTML 形式

    • テキストエディタを用いて作成した新しいテキストファイルに教科書 p. 72: 図3.3の内容記述し,それをpublic_htmlフォルダにweb.htmlという名前で保存しなさい.

    • ※: 文字入力のモードには十分に気をつけること.記号やURLは英文モードで入力しなくてはならい.入力モードの切り替えにはキーボード左上の「半角/全角」キーを用いること.

    • 正確に作業ができれば,図3.4のように表示されるはず.

    • 教科書を忘れた人はココを参照のこと.


    実習5 — 応用

    実習4を参考にHTMLファイルを作成し,public_htmlフォルダの下にliteracy.htmlという名前で保存しなさい.literacy.html の内容は,コンピュータリテラシの授業のなかで最も学びたい内容について記述すること.内容は300文字程度.


    以上の実習が完了したら,Thunderbird を用いて以下の要領で実習結果を提出すること.

    • 件名はコンピュータリテラシ: 【クラス名】とする.ただし,【クラス名】は CL1b, CL6a, CL7b のうち該当するもの.
    • 宛先は,以下のいずれかより受講クラスに該当するものを適切に指定すること.

      • wakita.k.aa-cl1b-2012@m.titech.ac.jp
  • wakita.k.aa-cl6a-2012@m.titech.ac.jp

  • wakita.k.aa-cl7b-2012@m.titech.ac.jp

  • 本文の先頭に氏名と学籍番号を記載すること.

  • 本文に5つの課題で作成したウェブページの URL のリストを掲載すること.

  • ウェブページの作成」への1件のフィードバック

    コメントを残す

    以下に詳細を記入するか、アイコンをクリックしてログインしてください。

    WordPress.com ロゴ

    WordPress.com アカウントを使ってコメントしています。 ログアウト / 変更 )

    Twitter 画像

    Twitter アカウントを使ってコメントしています。 ログアウト / 変更 )

    Facebook の写真

    Facebook アカウントを使ってコメントしています。 ログアウト / 変更 )

    Google+ フォト

    Google+ アカウントを使ってコメントしています。 ログアウト / 変更 )

    %s と連携中