상대경로와 절대경로

안녕하세요 찐망고입니다.

오늘은 경로를 포스팅해볼까 하는데요.

 

경로를 사용하는 경우 대부분은 

문서에 링크를 걸거나

이미지를 띄울 때 많이 사용합니다.

경로가 틀어지지 않아야 링크도 잘 걸리고 이미지도 잘 보이겠죠 ㅎㅎ

당연히 css문서나 js문서를 연결할 때도 매우 중요하고요

 

상대경로의 기준은 현재 작업하고 있는 문서의 위치를 기준으로 연결한 문서들을 찾는 거고요

절대경로의 기준은 현재 경로를 걸기위한 문서 위치의 시작을 찾는 거예요.

 

예를 들어서

D드라이브에 찐 망고폴더에 문서와 이미지폴더가 있는데

문서에 이미지폴더안에 있는 이미지를 연결하고 싶다라고 하면

 

상대경로는 문서를 기준으로 이미지폴더를 찾는 거라

<img src="이미지폴더/이미지이름.이미지확장자">

이런 식으로 경로를 넣어주면 되지만

 

절대경로는 누구나 다 알고 있는 동일한 위치를 기준으로 시작을 찾는 거라

<img src="D:\찐망고\이미지폴더\이미지이름.이미지확장자">

이런 식으로 문서의 위치와 상관없이 이미지의 시작을 찾아 연결해 주는 방식이죠.

하지만 저 경로는 로컬에서만 존재하겠죠?

그래서 로컬경로라고도 해요. 사용할 일이 없죠 아무래도 서버에는 드라이브 따윈 존재하지 않으니까

 

 

개별작업 시 상대경로를 추천하는 건

상대경로들이 결국 FTP를 통해 서버에 올라가서 도메인주소를 달고 나머지 경로들을 연결해 줍니다.

https://t1.daumcdn.net/tistory_admin/static/top/pc/img_common_tistory_230106.png

현재 저 주소는 티스토리 로고에 해당하는 이미지 경로이고

도메인 주소로 시작하는 외부경로입니다. 

웹상에 업로드가 되면 모든 파일과 링크는 절대경로로 표현이 되는데요

앞에 도메인인. net다음 보이는 텍스트들이 폴더명이라 생각하면 돼요.

서버에는 로컬처럼 c드라이브나 d드라이브 같은 것들이 존재하지 않으므로

로컬에서 드라이브형태로 잡힌 절대경로를 그대로 업로드해버리면

링크고 이미지고 아예 안 뜨는 상황이 생깁니다.

 

물론 가끔 서버에 올려진 파일들을 연결하기 위해 저 외부경로들을 상대경로 대신 연결하기도 하죠

 

 

상대경로 작업 순서는

1. 현재 작업 중인 문서의 위치를 찾는다.

2. 그 위치를 기준으로 연결한 문서나 이미지를 찾는다.

3. 찾는 위치가 위로(상위폴더) 넘어가는지 아래로(하위폴더) 내려가는지에 따라 경로를 다르게 표시한다.

<!-- 작업중인 문서의 위치와 이미지의 위치가 같다 -->
<img src="이미지이름.이미지확장자">
<img src="./이미지이름.이미지확장자">

<!-- 작업중인 문서의 위치를 기준으로 이미지의 위치가 상위폴더에 존재한다-->
<img src="../이미지이름.이미지확장자">

<!-- 작업중인 문서의 위치와 기준으로 이미지의 위치가 하위폴더에 존재한다 -->
<img src="폴더이름/이미지이름.이미지확장자">
<img src="./폴더이름/이미지이름.이미지확장자">

 

절대경로인 경우

<img src="/A폴더이름/이미지이름.이미지확장자">
<img src="/A폴더이름/B폴더이름/이미지이름.이미지확장자">
<img src="/A폴더이름/B폴더이름/C폴더이름/이미지이름.이미지확장자">

슬래시를 붙여 모든 경로의 시작을  폴더이름부터라고 생각하면 됩니다.