情報システムコース2年生の授業では、HTMLとCSSを用いたホームページ制作に取り組みました。とある日の授業では、見本や手順を確認しながら、基本的なページを一つずつ形にしていく学習を行いました。
まずはHTMLで、見出しや本文、画像などを配置し、ページの構造(骨組み)を作成します。続いてCSSで、文字の大きさや色、余白、配置を調整し、見やすいデザインへ整えていきました。コードを変更すると画面の見え方がすぐに変わるため、生徒たちは「どこを変えるとどう変化するのか」を確かめながら作業を進めていました。
制作の途中では、意図した通りに表示されない場面もあります。その際は、コードを見直して原因を探し、修正して再確認するという流れを繰り返します。こうした試行錯誤を通して、情報を整えて伝える力や確認しながら改善する力が自然と身についていきます。授業中には、友人同士で画面を見せ合いながら助言し合ったり、うまくいった工夫を共有したりする姿も見られました。
今回の学習は、手順に沿って制作する形ではありますが、基本を確実に押さえることが目的です。基礎が固まることで、レイアウトの工夫や表現の幅を広げる土台にもつながります。
これからも、生徒たちの授業の様子を学校ブログでお届けしてまいります。ぜひご覧ください。


