【HTML】Aタグに関する小技
どうも！LSSです！！
今回は「それほど特別な知識じゃないけど、知ってるとちょっと嬉しいかも？」な部分について書いてみます。
Aタグについて
世界中の情報が網のように繋がるインターネット。
そのサイトとサイト、ページとページを繋ぐ役割を担う、基本にして最重要とも言えるタグ、それがリンクを形成する「Aタグ」です。
基本的な書式（書き方）は次のようになります。
コード
<a href="リンク先のURL">リンクがかかる文字</a>
赤と青の太字部分は、それぞれ書き換えて使用する事になります。
例えば、
<a href="https://little-strange.hatenablog.com/">Little Strange Software</a>
とコードを書き、ブラウザで表示すると、
こうなります。
これを、見た人がクリックする事で次から次に見たいページを移動していける仕組みですね。
小技その１ 別ウィンドウ（別タブ）で開くリンク
先ほどのコードに少し、手を加えてみます。
コード
<a href="https://little-strange.hatenablog.com/" target="_blank">Little Strange Software</a>
半角でスペースを開けて、target="_blank"を追加しました。
すると、
見た目は全く変わりません。
が、クリックした時に、最初に書いたほうだと今開いているページを開いているブラウザがリンク先に移動するのに対し、target="_blank"を入れた方は
「元のページから離脱せずに、新しいウィンドウ（タブブラウザなら新しいタブ）が追加されてそちらにリンク先が表示される」
ことになります。
なお、はてなブログの場合は、「編集 見たまま」画面にURLっぽい文字列をコピペすると、自動的にリンクに仕立ててくれますので、そうした上で、別タブで開かせたい部分だけ、HTML編集画面でtarget="_blank"を追記するのがお手軽です。
例えばですが「自分のサイト内のリンクはそのまま移動、他サイトへのリンクは target="_blank" 」といったような使い分けが考えられますね。
（どっちをどうするかはお好みで^^）
あと、余談ですが「とにかく全部、別タブで開くようにしたい！全部にtarget="_blank"を入れるのは面倒！！」という方には
421miyakoさん(id:m421miyako)の↑の記事が役立ちます！
小技その２ 同じページの一番上に戻るリンク
たいていのWebページ・ブログ記事は縦に長く、画面スクロールして読み進めていきますが、どこか途中で「一番上に戻りたい」場合。
リンク先URLの部分にある記号だけを入れる事で、対応できます。
コード
<a href="#">一番上に戻る</a>
このコードをブラウザで見ると、
こうなります。
クリックすると、ページ移動はせずに、画面が一番上まで一気に戻ります！
もちろん、「一番上の戻る」の文字の部分は好きな文言に変更できます^^
小技その3 サイトトップページに戻るリンク
それぞれのサイト・それぞれのブログ、のトップページに戻るリンクを入れたい場合があります。
最初にサンプルとしてあげたように
<a href="https://little-strange.hatenablog.com/">Little Strange Software</a>
トップページのURLを指定すると、もちろんトップページに移動するリンクになりますが、これをより簡単に書く方法があります！
コード
<a href="/">Little Strange Software</a>
このコードをブラウザで開くと、
動作としては同じくトップページに戻るのですが、URLをわずか「/」１文字で表現できます！
これは、例えばそのページが
https://little-strange.hatenablog.com/entry/2020/01/04/000100
といったURLだった場合。
https://little-strange.hatenablog.com/entry/2020/01/04/000100
https//で始まるサイトアドレスの次、最初の「/」以降をバッサリとカットしたURLがリンク先、って事になります。
あとがき
targetの指定先は、実は_blankの他にもあったりもしますが、もっとも有用なのはやはり_blankかな？と思いますね。（あとはだいたいフレーム関連で、フレームを使用したページを作成した際には必須となりますが、フレーム自体流行ってなさそうｗ）
小技その２、サイトのトップに戻る、はお手軽ですね^^
なお、ここで使う「#」はその後に文字を指定する事で「ページ内の指定位置に飛ぶ」という使い方が元々の用途？で、はてなブログの「目次」にはその用途で使用されていたりもします。
ってなとこで、今回はこのへんで！
次回もまた、よろしくお願いします^^
