新入社員ここでは、IT系企業の新入社員向けにHTMLを解説しています。デザイナーになるほどHTMLに詳しくなくてもいいけれど、Webアプリを作る上で必要な入力画面は自力で作りたい、そんなあなたのためのページです。前回は、「スタイルを適用する対象をセレクタで広げる」方法を学びました。今回は、あなたのサイトを訪れるユーザーに色々なページを見てもらうためにリンクについて学びましょう。リンクを貼るリンクリンクを貼るとユーザーを別ページに誘導することができます。Language)には“Hyper”(超える)“Text”(今までのテキストを)という意味があります。HTMLの語源になっているのがこのリンクの機能です。「ページ内リンク」という3つのリンク方法について学びます。URLのリンクまずはURLのリンクです。href="https://www.yahoo.co.jp/">ヤフージャパンへ</a>リンクを作るにはこのように<a>タグを使います。“href”でリンク先を指定します。reference」の略です。今回は、例としてヤフージャパンのURLを指定しています。別タブで開くリンクにすることができます。target="_blank">ヤフージャパンを新しいタブで</a>ただし、ユーザーが現在ページを見失ったり、「戻るボタン」が使えなくなるというデメリットは把握して使いましょう。別ファイルへのリンク次に別のファイルへのリンクです。href="next.html">次のページへ</a>別ファイルを用意し、同じ階層に配置します。その(パスを含んだ)ファイル名を“href”で指定します。今回はリンク先として同一のフォルダ内にあるnext.htmlとしています。ここでもしも、リンク先のファイルが同一フォルダ内に無かったらどのように指定したら良いでしょうか?下位フォルダにある場合と上位フォルダを辿る必要がある場合とに分けて説明します。href="under/next.html">次のページへ</a>underフォルダ内のnext.htmlを指定しています。そのまま直感的に表現できます。href="../brother/next.html">次のページへ</a>「..」で一つ上のフォルダに移動します。「../brother/」は同じ階層にあるフォルダ内のファイルという意味になります。このようなパスの指定方法を相対パスといいます。自分自身(のHTMLファイル)から見た相対的な位置関係を指定するのでこの名前があります。ひとつ「https://(ドメイン名)」で始まる絶対パスという方法もありますが、リンク先の指定方法としては相対パスのほうが優れています。ドメインを変更しても、リンクを修正しなくて良いからです。相対パスは「現在地からの道案内」、絶対パスは「住所」に例えることができます。いった住所のイメージです。ページ内リンク最後にページ内リンクです。id="link">ページ内リンク</h1>リンクしたいところに“id”を指定します。リンク先のidは同じものを記入します。このように書けば、ページ内リンクを作ることができます。以上、今回は「URLリンク、別ファイルリンク、ページ内リンク」について学びました。次回は、「画像を貼って表現力アップ」する方法について学びましょう。確認画面は表示されません。上記内容にて送信しますので、よろしければチェックを入れてください。