情報処理実習3B(Web)

2017年度 前期 木04 15:15-16:45 瀬田2-119

Syllabus

講義概要/Course outline

近年、社会の様々な情報インフラとしてインターネット技術が用いられるようになっている。現代社会における情報の流通、コミュニケーションのあり方などへの理解を深める上でインターネットに関する技術的な理解を深めることは必須である。将来企業その他で仕事をしていく際にも、情報戦略の基盤としてのインターネットの基本的な仕組みを理解していることには大きな意義がある。

本実習ではインターネット技術のうち、ユーザにとっての「窓口」として幅広い役割を担っているWebシステムに関する理解を深めることを目的とする。Webシステムがいかなる技術の組み合わせで作られているかを理解し、サイトを利用するユーザサイドとサイト開設者サイド、各々のWebサイトの「見え方」にまで踏み込んで理解を深める。それを通じてどういうシステムが使いやすいのか、Webサイトを評価をする眼を養う。

Webシステム構築技術として本実習が扱う内容は以下の通り。

  • HTML(本実習はHTML5に準拠)
  • スタイルシートを用いたサイトデザイン
  • サーバサイドウェブプログラム(使用言語は「PHP」)

本実習はウェブページ作成に関して全くの未経験者を対象とする。HTMLの基本的なタグの学習から始める。

プログラミング言語も扱うが、難しくはない。トライしてみて、自身の向き不向きを把握していくことは卒業後の進路選択を考える上でも重要である。仮に「自分には向かない」ということを知ることも有意義なことである。学生の間に経験しておくことを強くお勧めする。

到達目標/Attainment objectives

Webシステムの基本構造を理解し、ユーザビリティを中心にWebサイトを適切に評価する視点を持てるようになることが目標である。そのために最低限の技術的知識を学習する。

  • HTMLの構造を理解し、基本的なタグを書けるようになる
  • CSS(スタイルシート)を用いた統一的なサイトデザインの方法を理解する
  • ユーザが入力したデータをサーバ側で処理して表示画面に戻す流れを理解する
  • プログラミングを経験し、簡単なシステムを構築する

開発環境・ツール類

「つまみ食いWebシステム開発」講座

オリエンテーション(04/13)

背景
課題

HTML入門1~基本書式1(04/20)

HTMLの記述
周辺環境
課題

HTML入門2~基本的なタグ(04/27)

文書構造の記述
  1. 文章構造の記述
  2. 段落
  3. 引用
  4. 強調、改行など
課題

HTML入門2~リストと表(05/11)

リスト
  • 順番のないリスト
  • 順番のあるリスト
  • 定義リスト
課題
  • セルの結合
課題

HTML入門3~画像とリンク(05/18)

画像
  • 画像の貼り付け
図示領域
  • 図示領域の確保
課題
リンク
  • 外部ファイルへのリンク
    • 絶対参照
    • 相対参照
  • 内部リンク(id属性)
課題

スタイルシート(CSS)による表示の統御1(05/25)

指定方法
諸要素への装飾
課題

スタイルシート(CSS)による表示の統御2(06/01)

ボックス
課題
表示
課題

スタイルシート(CSS)による表示の統御3(06/08)

レイアウト・配置
実践的な手法
課題

応用事例研究(06/15)

実践的な手法
サイトデザインを考える
課題

フォーム(06/22)

フォームタグによる入力画面設計
課題

プログラミング事始め1(06/29)

レビュー
JavaScript基本1
PHP基本1

プログラミング事始め2(07/06)

JavaScript基本2
PHP基本2
課題
JavaScript基本3
PHP基本3
課題

PHP実践~サーバーとのデータ授受1(07/13)

入力データの受け取りと処理
課題

JavaScript実践~画面操作(07/20)

レビュー
DOM・イベント・フォーム
課題

まとめ(07/27)

課題
カフェレストラン
各ページで用いられている技術を出来るだけたくさん指摘せよ。
アルゴリズムの基本
  • JavaScriptで変数signalが"red"なら"止まれ"、そうでなければ"進め"と出力されるプログラムを書け。
  • PHPで1から10までの数値が出力されるプログラムを書け。
運賃計算
運賃計算ページはクライアントサイドプログラミングで作られているか、サーバサイドプログラミングで作られているか、そのように判断した根拠を含めて答えよ。
郵便番号住所検索
郵便番号住所検索システムはクライアントサイドプログラミングとサーバサイドプログラミングを併用して作られている。各々の言語のどういう特徴がこのシステムに生かされているか。

解答はmanaba