HTML講習1

一つ前

[id:tsugehara:20060615:1150335442]

概要

今回Webプログラミングの講習を受けたのが、主業務優先との事だったので、主業務を優先しつつしっかりとした講習を行うには、どういった手がいいかなぁとぼんやり考えていたのだが。
結論としては主業務の一環として講習資料を整備すればいいのだと気付いた。
ということで、一応主業務の一つであるこの日記に記述していって、その日記を集約したものを文書にすれば一石二鳥じゃないか、と結論を出し、毎日少しずつ文書を作っていくものとする。
諸事情でXML Webサービスのネタ等が出しにくい状態になっていたので、この日記的にも教材を与えてもらって有難いというのもあるし。

目次構成

初日の今日はまず目次からだろう。

  1. HTMLの生い立ち
  2. HTMLの言語(文書)構造
  3. 定義済み要素
  4. 定義済み属性
  5. CSSJavaScriptの用法を理解する
  6. 実践

こんな感じか。
Webで「実践」をどうやればいいかという点については、アップロード版でも設けてアップしたもらったのを各自が批評するという感じでいいかなと考えている。そんなに真面目に考えるほど、この日記の読者はいない気もするが(笑)

大体の記述内容

HTMLの生い立ち

HTMLが生まれた理由、HTMLとの関係、SGMLとの関係辺りをなるべくサクッと。
私自身が曖昧な理解しかしていないので、ここの記述に一番手間取りそう。

HTMLの言語(文書)構造

ヘッダ要素とかブロック要素とかインライン要素とか。
ここが今回の主旨。

定義済み要素

一応講習という事で軽くリストアップする。
その際これはインライン要素でこれはブロック要素、このタグは表示上はこうなるが、本来はどういう意味かというのをちょっと解説したい。
ボリュームが大きくなりがちなところなので、いくつかピックアップするだけでいいか。
10個くらいと考えると、html、head、body、div、span、p、font、center、meta、script・・辺りかな。
iframeとかimgとかもやりたいが。

定義済み属性

一応簡単に。共通属性・・だけで手一杯かな。
他にも色々ありますよで終わらせる予定。

CSSJavaScriptの用法を理解する

HTMLってそれ単体だと固定の文書でしかないので、CSSで製作者サイドの思惑通りに文書を整形し、JavaScriptでユーザ操作に反映したりダイナミックに動かす事が出来たりするわけだ。
なんて概要は適当に記述しておいて、JavaScriptCSSから見て「使いやすいHTML」の書き方というのを少しレクチャーしてみたい。
ここの記述は慎重にやる必要があるので、やはりちょっくら時間がかかりそうである。

実践

最後は「以上ですが理解できましたか?できましたか。では実際に作ってみましょう」という事にして、あるテーマに対して理想的なHTMLを各自で考え、作ってもらうことにする。制限時間は20分くらいでいいだろう。
で、作り終わったらソースをプリントアウトして、画面をプロジェクタで映して、自分の口でこうこうこういう理由でこうしてます、と語ってもらえばいいだろう。
語ってる間にどんどん突っ込めばディベートの練習にもなってよさそう。


と、いう感じで行く。
私が社内で赤っ恥をかく前に、アドバイスいただけると有難い。