IT応用

IT応用は複数教員で並行開講のため，MyKONANでのIT応用のシラバスは共通となっています．そのままでは実施しにくいこともあり，𠮷川担当分は細かな修正があります．必ず以下のシラバスの変更箇所を熟読したう上で受講してください．初回の講義でもこの資料を用いて説明します．修正内容が自分に合わないという方は申し訳ありませんが，他の教員の開講分を受講してください．

なお共通のシラバスとこのページの記載が異なる場合は，このページの記載内容が優先されます．

• HTML5とCSS3を用いて構文的に正しいウェブページを作成する方法をアクティブラーニングにより学習する
• レスポンシブデザインを用いてデバイスに依存しないウェブページを作成する手法をアクティブラーニングにより学習する

• HTML5とCSS3を用いて構文的に正しいウェブページを作成する方法を習得すること
• レスポンシブデザインを用いてデバイスに依存しないウェブページを作成する手法を習得すること

授業は大きく基礎知識の習得（前半7回，以下前半）とウェブ作成（後半7回，以下後半）に大別される．なお前半も後半もアクティブラーニングにより実施するため，教員は基本的に教えないので，自ら学習しないと単位習得は極めて難しい．

前半（第2回から第8回）

その日のテーマに関するアンケートを実施し，それを教員が解説する．その後，その日のテーマをグループごとにアクティブラーニングにより自分たちで学習する．グループは毎時間異なる

後半（第9回から第15回）

グループごとにウェブを作成するための作業を実施する．グループは固定とする．ただし使いやすさの評価の課題とウェブ作成の課題のグループは異なる

確認書の提出

講義の進め方，シラバスの内容，成績評価に関する説明を理解したことの確認書．定められた期日までに提出がない場合は以下の評価にかかわらず不可と評価する

前半：35点

（毎回のグループ課題の完成物：3点＋毎回のリアクションペーパー：2点）×7回

後半：55点

（毎回のグループの作業報告：3点＋毎回のリアクションペーパー：2点）×7回＋（プレゼンテーション：10点）×2回

平常点：10点

授業への参加度合いが低いと加点されない

1. ガイダンス：講義に関する説明
2. 画像処理：スマホによるJPEG，PNGの画像入力，スマホあるいはPCでの加工，修正
   資料等：アンケート[txt]／グループワーク説明[txt]／グループワーク用シート[PDF]
3. HTMLの作成：まずは試しにテキストエディタでソースファイルを入力
   資料等：アンケート[txt]／作業内容[PDF]
4. HTMLの文法：文法上正しいページを作成するためのポイント
   資料等：アンケート[txt]／グループワーク説明[txt]／グループワーク用シート[PDF]
5. コンテンツの構造化：ブラウザが適切に理解できるページ
   資料等：アンケート[txt]／グループワーク説明[txt]／グループワーク用シシート[PDF]／追加課題[html]
6. CSSの特徴：ページ表現のいろいろな手法，ページレイアウトや動的表示
   資料等：アンケート[txt]／グループワーク説明[txt]／グループワーク用シート[PDF]／CSS3サンプル[html]
7. FTPとマルチメディア：FTPを用いたコンテンツのアップロード方法と画像，動画，音声，SVGのウェブページでの表示
   資料等：アンケート[txt]／グループワーク説明[txt]／グループワーク用シート[PDF]
8. レスポンシブデザイン：装置に合わせた適切なページデザイン＋ユーザビリティ
   資料等：アンケート[txt]／グループワーク説明[txt]／グループワーク用シート[PDF]／レスポンシブデザインサンプル[html]
9. グループ分けと使いやすさの評価(1)：後半のグループ分けとMyKONANの評価
10. 使いやすさの評価(2)：MyKONANの評価（早く終わったグループはウェブ作成に着手のこと）
11. プレゼンテーション：グループごとに評価結果のプレゼン
12. ウェブ作成(1)：グループごとにサイトの作成
13. ウェブ作成(2)：グループごとにサイトの作成
14. ウェブ作成(3)：グループごとにサイトの作成
15. プレゼンテーション：グループごとに作成ページのプレゼン

USBメモリで動作可能な無料のHTML無料のエディタ．なお自分のパソコンを持ち込むのであれば，USBメモリで動作可能という制限は外して選んでよい．

StyleNote5

zipファイルの展開でインストールらしいのでうまくいけばUSBメモリでも利用可能

Crescent Eve

インストール先にUSBメモリを指定すると利用可能

Atom portable

高機能エディタAtomのポータブル版．カスタマイズ可能な分だけ使い慣れるまで敷居が高いかも

Notepad++ portable

Notepadの強化型エディタNotepad++のポータブル版

HTML5，CSS3などの文法チェックなどのお役立ちサイト．

Another HTML-lint

HTML5の文法チェックサイト（説明が日本語）

The W3C Markup Validation Service

同じくHTML5の文法チェックサイト（説明は英語のみ）

The W3C CSS Validation Service

CSSの文法チェックサイト（説明は日本語対応）

MDN:Mozilla Developer Network

Mozillaの開発者向けサイト．HTML5やCSS3のリファレンスなど使える情報が公開

他にもあると思うので，各自で探してほしい．

講義中に使用するデバイスは講義室の備え付けのPCを利用しても，自分で持ち込んでも構わない．ただしインターネットに接続できるデバイスを用意すること．