情報処理実習3B(Web)

2019年度 前期 木04 15:15-16:45 瀬田3-B106

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

講義概要/Course outline

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

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

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

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

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

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

到達目標/Attainment objectives

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

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

開発環境・ツール類

実習内容

順次公開

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

本実習最終課題
架空の店紹介サイトを作成
要件詳細

Cafe Restaurantサイトと同等の構成

※トップページ・店紹介ページ・商品紹介ページ・フォーム設置ページの四ページ構成とする。

初回作業指示

店の概要と「店名」を定めよ

HTML入門1(04/18)

課題

「ホームページ」黎明期によくあった自己紹介ページのようなページを作成

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

基本的なタグ1
リスト
  • 順番のないリスト
  • 順番のあるリスト
  • 定義リスト
  • セルの結合

HTML入門4~画像とリンク(05/02)

画像
  • 画像の貼り付け
リンク
  • 外部ファイルへのリンク
    • 絶対参照
    • 相対参照
  • 内部リンク(id属性)

HTML入門5~総合実習(05/09)

リンク
  • 外部ファイルへのリンク
    • 絶対参照
    • 相対参照
  • 内部リンク(id属性)
作業指示
  • トップページ・店紹介ページ・商品紹介ページを作成し、相互にリンクを貼れ。

    参考:Cafe Restaurant

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

指定方法
諸要素への装飾

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

ボックス
表示

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

レイアウト・配置

応用事例研究(06/06)

実践的な手法
作業指示
  • トップページ・店紹介ページ・商品紹介ページを作成せよ。サイトデザインはスタイルシートを用いよ。

    参考:Cafe Restaurant

総合実習(06/13)

サイトデザインを考える
作業指示
  • トップページ・店紹介ページ・商品紹介ページを作成せよ。サイトデザインはスタイルシートを用いよ。

    参考:Cafe Restaurant

フォーム1(06/20)

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

フォーム2(06/27)

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

webシステムとプログラミング言語1-サーバーとのデータ授受(07/04)

レビュー
PHP基本
課題
入力データの受け取りと処理
課題

webシステムとプログラミング言語2-画面操作(07/11)

レビュー
JavaScript基本
課題
DOM(Document Object Model)・イベント・フォーム
クライアントとサーバーの協調
課題

まとめ(07/18)

本実習最終課題(再掲)
架空の店紹介サイトを作成
要件詳細

Cafe Restaurantサイトと同等の構成

※トップページ・店紹介ページ・商品紹介ページ・フォーム設置ページの四ページ構成とする。

締切
2019/07/24 23:55