web-dev-qa-db-ja.com

サブフォルダーへの相対リンク

3つのファイルがあるWebサイトがあると仮定します。
/home/blog.html
/home/picture1.jpg
/home/files/picture2.jpg

それを編集してみましょうblog.htmlファイル。現在のフォルダーへのリンクを作成する場合、次のようにします。
<a href="./">Current folder</a>

しかし、現在のフォルダー内のファイル、サブフォルダー、またはサブフォルダー内のファイルへのリンクを作成する正しい方法は何ですか？次のいずれかです。
<a href="picture1.jpg">Picture 1</a>
<a href="files/">Files</a>
<a href="files/picture2.jpg">Picture 2</a>
または
<a href="./picture1.jpg">Picture 1</a>
<a href="./files/">Files</a>
<a href="./files/picture2.jpg">Picture 2</a>

私がチェックしたように、どちらの方法も私のブラウザーでうまく機能します。しかし、私はそれらのどれが好ましい方法であるか知りたいですか？それらのいずれかが少し詳細に少し優れていますか？

htmllinks
3
Jeyekomon

STD 66 で定義されているURL解決の一部として、./部分がURLの先頭から削除されます。これは、フォルダーやファイルとは関係ありません。これは、一般的なURL仕様で規定されている単なる文字列操作です。したがって、たとえば、URL picture1.jpgと./picture1.jpgは同じ意味を持ち、同じ絶対URLに解決されます。

どちらを好むかは好みの問題です。他の条件が同じであれば、短いためだけでなく、相対的なURLの意味で人々が持つ混乱のリスクをいくらか軽減するために、短い選択肢を好むことが最善です。

3
Jukka K. Korpela

これ 記事はあなたのために物事を片付けるのに役立つはずです。

次のように、現在のフォルダーの上にあるフォルダー（別名、ディレクトリ）を要求するときは、スラッシュ（.）の前にドット（/）を追加するだけです。

../parent_folder/picture1.jpg

または、次のような現在のディレクトリ：./

次に例を使用して、リンクテキストに対応するものを書き留めます。

<a href="./">current folder</a>
<a href="picture1.jpg">picture1 in current folder</a>
<a href="files/">files folder</a>
<a href="files/picture2.jpg">picture2 in files folder</a>

W3C Link Checker ツールを使用して、Webページ内のリンクを確認できます。

1
dan