正直に言うと、最初は少しだけ甘く見ていました。
「表を作るだけなら、なんとなくできそうだな」
そう思っていたのです。
ユイ表を作るだけなら簡単そうって、最初はみんな思いますよね。
ユウト私もそう思っていたんですが、セルを結合するところで一気に頭が混乱しました。
- rowspanとcolspanで頭が混乱した理由
- 地味に見えるtableタグが実は役立つ理由
- AIを使いながら反復して身につけた過程
職業訓練校の面接に落ちてから合格するまでの話は、57歳で職業訓練校へ｜面接に一度落ちてから合格した理由に書いています。
HTML 表 作り方｜rowspanとcolspanで頭が混乱した
まずは、表を作り始めてから頭が混乱するまでの経緯です。
ところが、実際に手を動かしてみると、思ったよりずっと難しい。
特に、セルを結合するところで一気に頭が混乱しました。
HTMLには、表を作るためのタグがあります。
今回苦戦したのは、セルを縦横につなげる「rowspan」と「colspan」です。
授業で説明を聞いているときは、「なるほど」と思いました。
でも、自分でコードを書いて画面に表示してみると、頭の中の完成図とは違う表が出てきます。
「なんでこうなるんだろう」
画面を見ながら、何度もそう思いました。
頭の中では、ちゃんと表の形が見えているつもりです。
でも、実際の画面ではセルがずれている。
一行直すと、今度は別の場所が崩れる。
そこを直すと、また別のセルの位置がおかしくなる。
まるで、ひとつ積み木を動かしたら、全体のバランスが変わってしまうような感覚でした。
最初は、どこを見ればいいのかも分かりませんでした。
タグの書き方が間違っているのか。
セルの数が合っていないのか。rowspan や colspan の指定が違うのか。
見ているうちに、だんだん目が疲れてきます。
それでも、画面に出ている表は正直です。自分の書いたコードの通りにしか表示されません。
HTMLの相対パスで画像が表示されずに苦戦した話は、57歳でHTMLを学ぶ｜「おお！」と声が出た日の話に書いています。
HTML 表 作り方｜地味に見えるtableタグが実は役立つ
混乱しながらも進めるうちに、先生の言葉が印象に残りました。
今日、印象に残った先生の言葉があります。
「テーブルは地味で使用頻度があまりなさそうなタグだが、企業の会社情報などによく使われるコードである」
たしかに、表は派手なものではありません。
Webサイトの中でも、目立つデザインというより、情報を整理して見せるためのものです。
でも、会社概要、料金表、営業時間、商品スペックなどを思い浮かべると、表が使われる場面はたくさんあります。
見た目は地味でも、必要な情報をきちんと伝えるためには、とても大事な役割を持っているのだと分かりました。
今日は、表の中に画像を表示させることもできました。
文字だけでなく、画像も表の中に入れられると、少し表現の幅が広がった気がします。
ただ、できるようになったと言っても、まだスムーズではありません。
途中で何度も止まりました。
何度も間違えました。
何度も画面を確認しました。
HTML rowspan colspan｜AIを使いながら反復して身につけた
ここからは、AIの力も借りながら理解を深めていった流れです。
そして、分からなくなったところではAIも使いました。
自分で書いたHTMLコードをAIに見てもらい、どこがずれているのか、どこを直せばよいのかを指摘してもらいました。
AIに聞くと、たしかにヒントは返ってきます。
でも、何も考えずに丸投げしてしまうと、自分の学びにはなりません。
今日感じたのは、AIは答えを出してくれる魔法の道具というより、自分の間違いに気づくための先生のような存在だということです。
自分で考える。
自分で書いてみる。
うまくいかない。
そこでAIに確認する。
もう一度、自分で直してみる。
この繰り返しの中で、少しずつ理解が深まっていくのだと思いました。
正直、授業中は「今日はあまり進まなかったな」と感じました。
表が思った通りに表示されず、同じところを何度も直していたからです。
でも、あとから振り返ってみると、朝には意味が分からなかった rowspan や colspan が、少しだけ読めるようになっていました。
完全に理解できたわけではありません。
でも、朝は意味が分からなかったコードが、少しだけ読めるようになっていたのです。
これが反復なのかもしれません。
一度聞いただけでは分からない。
一度書いただけでは身につかない。
でも、何度も間違えて、何度も見直して、何度も直しているうちに、少しずつ手が覚えていく。
自分の入力を疑いながら見直す視点は、HTML・CSSの試験で学んだ「入力を疑っている」という視点にも書きました。
57歳 HTML学習｜反復が学び直しを支えてくれた
最後に、今日の一日を振り返って感じたことをまとめます。
57歳からの学び直しでは、すぐに理解できないこともあります。
若い頃のように、勢いだけで覚えられないと感じる場面もあります。
でも、そのぶん、つまずいたところを丁寧に見つめることはできます。
「なぜ崩れたのか」
「どこを直せば変わるのか」
「次はどう考えればいいのか」
そうやって一つひとつ確認していく時間も、今の自分にとっては大事な学びです。
今日の授業で思ったことは、学び直しに必要なのは、特別な才能だけではないということです。
もちろん、すぐに理解できる人もいるかもしれません。
でも、私のように何度も止まりながら進む人間にとっては、反復こそがいちばん頼りになる方法です。
できなかったことを、もう一度やってみる。
分からなかったところを、もう一度見てみる。
崩れた表を、もう一度直してみる。
その繰り返しの中で、昨日より少しだけ分かることが増えていく。
職業訓練に通いながら感じるのは、学び直しは人生の作り直しにも似ているということです。
一度でうまくいかなくてもいい。
思った通りに形にならなくてもいい。
何度も直しながら、少しずつ形にしていけばいい。
HTMLの表作成でつまずいた一日でしたが、振り返ってみると、反復の大切さを教えてもらった一日でもありました。
同じように、50代、60代から新しいことを学んでいる方へ。
最近、何度もやり直していることはありますか。
その「もう一度」が、いつか振り返ったとき、大きな一歩になっているのかもしれません。
明日もきっと、新しいところでつまずくと思います。
でも、それも学びの途中なのだと思っています。
通学や生活面での大変さについては、職業訓練は50代にきついか｜片道2時間・月18日の5ヶ月にまとめています。
まとめ
今日は職業訓練で、HTMLの表作りを学びました。
rowspanとcolspanでセルを結合するところに苦戦し、何度も画面を確認しながら進めました。
地味に見えるtableタグですが、会社概要や料金表など、実は身近な場面でよく使われていると知りました。
AIを使いながら何度も直し、反復することで少しずつ理解が深まっていくのだと感じた一日でした。
rowspanとcolspanで頭が混乱した一日でしたが、反復することで少しずつ手が覚えていくと実感できたのが今日の収穫です。
最後までお読みいただき、ありがとうございました。
コメント