MENU

57歳からのHTML学習|リンクタグと画像タグの違いでつまずいた日

PC作業をする男性の手元

HTMLを学び始めると、似たようなタグが出てきて、頭の中が混ざることがあります。

ぼくの場合、今回つまずいたのはリンクタグでした。

少し前に学んだ画像タグと似て見えて、

「これは画像を表示するタグだったかな」

「これはページへ移動するタグだったかな」

と、何度も手が止まりました。

でも、実際にコードを書いてみると、少しずつ違いが見えてきました。

リンクタグは、ページとページをつなぐためのタグです。

そして今日は、その「つながる感覚」が少しだけ分かりました。

目次

画像タグとリンクタグが頭の中で混ざりました

6月10日の職業訓練では、HTMLのリンクタグについて学びました。

リンクタグは、文字や画像をクリックしたときに、別のページへ移動できるようにするためのHTMLです。

ブログでよく見る「詳しくはこちら」というリンクも、この仕組みで作られています。

ただ、初心者の自分には、最初からすんなり理解できたわけではありません。

前に学んだ画像タグと、今回のリンクタグの記述が少し似ているように見えて、混同してしまいました。

画像を表示するタグ。
ページへ移動するタグ。
メールアドレスへつなげるタグ。

役割は違うのですが、コードの中に英語や記号が並ぶと、まだ一瞬で見分けることができません。

「これは何のためのタグだったかな」

そう思いながら、ひとつずつ確認していく時間になりました。

リンクタグは「どこへ移動するか」を決めるものです

今日、少しできるようになったことがあります。

それは、リンクで飛びたいページを指定できるようになったことです。

リンクタグでは、「クリックしたら、どこへ移動するのか」を指定します。

たとえば、このように書きます。

<a href="page.html">詳しくはこちら</a>

まだ細かい意味を全部覚えられているわけではありません。

でも、href の中に「移動したい先」を書くのだと考えると、少し整理しやすくなりました。

別のWebサイトに移動することもできます。
自分で作った別のページに移動することもできます。
メールアドレスにリンクを設定して、クリックするとメールを送れるようにすることもできます。

最初はただの文字に見えていたHTMLが、リンクを設定することで、実際に動き出す感じがしました。

文字をクリックすると、別のページへ移動する。

メールアドレスをクリックすると、連絡につながる。

自分が書いた小さなコードによって、ページとページ、人と情報がつながっていく。

そう考えると、リンクタグはWebサイトにとって、とても大切な役割を持っているのだと感じました。

絶対パスと相対パスは、住所の書き方に似ています

今日の授業で印象に残った言葉があります。

「外部リンクは絶対パス、内部リンクは相対パスで設定する」

最初に聞いたときは、少しむずかしく感じました。

絶対パスとは、インターネット上の住所を最初から最後までしっかり書くような指定方法です。

外部のWebサイトへリンクするときに使います。

一方で、相対パスは、自分が作っているWebサイトの中で、今いる場所から見て「どこにあるか」を指定する方法です。

たとえば、同じフォルダの中にあるページや、ひとつ下のフォルダにあるページへ移動するときに使います。

自分なりに言い換えるなら、

外へ行くときは、住所をしっかり書く。
家の中で移動するときは、今いる場所から見て案内する。

そんな感覚に近いのかもしれません。

専門用語のままだと難しく感じますが、生活の中の言葉に置き換えると、少し理解しやすくなります。

手を動かすと、少しずつ違いが見えてきました

今日は検索もAIも使っていません。

授業の中で学んだことを、自分の手でコードを書きながら確認しました。

AIを使えば、分からないことをすぐに調べることもできます。

でも今日は、あえて自分で迷いながら、手を動かす時間になりました。

画像タグとリンクタグが混ざる。
絶対パスと相対パスで迷う。
メールアドレスへのリンク設定で確認する。

こういう小さなつまずきは、正直少し疲れます。

でも、実際に書いて、間違えて、直してみると、少しずつ違いが見えてきます。

「分かった」と言えるほどではなくても、昨日より少しだけ見えるものが増える。

57歳からの学び直しでは、この「少しだけ」が大事なのかもしれません。

学び直しは、忘れても戻れば大丈夫です

若いころのように、一度聞いたらすぐ覚えられるわけではありません。

昨日分かったつもりのことを、今日また忘れていることもあります。

でも、それでも大丈夫なのだと思います。

混同したら、もう一度見比べればいい。
忘れたら、もう一度書いてみればいい。
手が止まったところが、今日の学びの入り口なのかもしれません。

今日できるようになったのは、リンクで飛びたいページを指定すること。

そして、メールアドレスにリンクを設定すること。

小さなことですが、Webサイトを作るうえでは大切な一歩です。

リンクが設定できると、Webページがほかのページとつながります。

今日の小さな理解も、明日の授業やこれから作るページにつながっていく。

そう考えると、1つのリンクタグにも、前向きな意味を感じられました。

同じように50代、60代から学び直しをしている方へ。

新しい言葉が出てくると、最初は戸惑いますよね。

でも、ひとつずつ手を動かしていけば、昨日より少し分かることが増えていきます。

あなたが最近、「少しだけできるようになった」と感じたことは何ですか。

コメントで教えてもらえたらうれしいです。

次回は、今回混同したリンクタグと画像タグの違いを、自分なりに整理して書いてみます。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

コメント

コメントする

目次