あるくテック

日々試行錯誤しつつ実践中

プログラミングの授業例 テーブル

『学び合い』という授業の考え方に基づいて行った、プログラミングの授業実践を記録しています。

テーブルとは

テーブルはWebページ上で表を作成して文字や画像を配置するためのHTMLプログラムの機能です。表とはいっても、エクセルのような計算機能などはありませんので、必要であればJavaScriptなどを使って機能をプログラムすることになります。

Webページのデザインによってはテーブルを使わないこともありますので、HTMLやCSSの基礎として学ぶ内容としては、リスト(li,ul, ol)に比べて最近は学習の優先度は低くなったものかもしれません。Dreamweaverを用いてWebページを制作する場合、テーブルタグの知識がなくてもとりあえずは作れてしまうとも思います。

とはいえタグの入れ子構造を学ぶのにも良い題材であるので、クラスの到達度や進捗状況など応じて組み込んでいました。

Dreamweaverについて

DreamweaverはWebサイトを制作するためにおそらく今現場で最も使われているアプリケーションの1つです。よく知らない方にとっては、そして学生達も最初は、ワープロなどで文書を作るようにWebサイトが作れる、という期待を持っているようですが、実際にはHTMLやCSSの基礎は理解していないと厳しいです。

例えば「作業をしていたらレイアウトが突然崩れた!」といった不具合が出た時に、ある程度HTMLとCSSを知っていないと対処できません。

授業概要

授業で配布したプリントは次のようなものです。 (授業はテキストエディタを用いたWebサイト制作の授業向けで、Dreamweaverを用いた授業向けではありません。)

 

『学び合い』について

『学び合い』(二重括弧付き)は、授業の考え方です。授業方法ではないため、単純にプリントを配ればアクティブラーニングが成立するというものではないだろうと考えています。もし私のプリントを参考にして下さる方は、様々なサイトや書籍がありますのでぜひ一度ご覧ください。