The note of Legendre

절대경로는 파일의 주소를 전부 기술하는 방법입니다.
유닉스 계열의 운영체제라면
/home/someuser/Desktop/blahblah.html
윈도 계열의 운영체제라면
C:\Windows\mspaint.exe
또는 C:/Windows/mspaint.exe를 쓸 수 있습니다. (가장 앞의 드라이브 문자는 꼭 C가 아니어도 됩니다.)

반면에 상대경로는 지금 위치를 기준으로 경로를 설명합니다.
위에서 예를 든 유닉스 계열의 운영체제에서 blahblah.html에서, 같은 Desktop 디렉토리의 someimage.jpg를 접근한다고 할 때 상대경로는 someimage.jpg입니다.
/home/someuser/Desktop/images/subimage.jpg 를 접근하려고 할 경우,
상대경로는 images/subimage.jpg 이고
/home/someuser/Desktop/supimage.jpg를 접근하려고 할 경우,
상대경로는 ../supimage.jpg 입니다.

여기서 점을 두 개 찍은 ..은 그 디렉토리의 상위 디렉토리라는 의미입니다.
(참고로 점을 한 개 찍은 .은 현재 디렉토리를 가리킵니다.)

그렇다면 /home/someuser/superimage.jpg를 접근하려고 하면 어떻게 해야 할까요?
blahblah.html이 위치한 디렉토리에서 상위 디렉토리를 두 번 올라가야 하므로
상대경로는 ../../superimage.jpg로 쓰면 됩니다.

이러한 상대경로는 (X)HTML이나 CSS 문서를 작성할 때 이미지, 스타일시트 파일 등 웹페이지에 필요한 파일들의 경로를 지정할 필요가 있을 때 사용할 수 있습니다. 일반적으로 절대경로보다는 상대경로를 쓰는 것이 총 주소의 앞부분이 달라지더라도 내용은 보존되기 때문에, 이식성 면에서 더 좋습니다. (만일 절대 경로로 작성했고, 웹 관련 파일들을 지금으로부터 다른 서버로 옮겨야 한다면 그 절대경로를 일일이 고쳐주어야 하겠지요.)

그럼 경로에 관한 다른 이야기를 해 볼까요?
우리가 쓰고 있는 웹 브라우저(예: 모질라 파이어폭스, 인터넷 익스플로러..)는 하드에 저장된 파일을 보여줄 수 있습니다. 최상위 디렉토리에 가고 싶다면 윈도 계열의 운영체제에서는 file:///C: 를 유닉스 계열의 운영체제에서는 file:/// (여기서는 주소가 그냥 /부터 시작하죠.)
을 입력하여 볼 수 있습니다.

그런데 우리가 웹 주소를 입력할 때에는 http:// 해서 '/'(이스케이프 문자)를 두 번 사용합니다. 왜 그럴까요? http://somecompany.com/이 있다고 가정해 봅시다. 그러면 우리는 그 홈페이지의 디렉토리나 파일을 접근하려면 http://somecompany.com/somedirectory/ 또는 http://somecompany.com/index.html 이런 식으로 할 수 있습니다.
디스크 내부에 접근할 때에는 이 somecompany.com이 생략되어(또는 그렇게 생각하고), 즉 file://(생략된 경로)/ 형태이다 보니 이스케이프 문자를 세 번 사용하게 된 거죠.

1) 알씨를 사용해서

일단 그림파일을 알씨로 엽니다. 그 다음은 그림 아무 곳에라도 마우스 포인터를 위치시키고, 오른쪽 클릭을 해서 메뉴를 띄웁니다.



이미지 크기 변경이라는 대화상자가 뜹니다.



비율로 선택하기, 해상도로 조정하기 등이 뜨는데 제가 생각할 땐 해상도로 조정하기가 가장 편할 것으로 생각합니다.
'크기에 비례' 부분을 체크해 주시면 그림이 일그러지지도 않고요.

1024*768 해상도를 기준으로 할 때 800*600 내외에서 그림을 조정하시면 가장 이상적으로 그림 전체를 볼 수 있는 형태가 되리라 생각해요.

미리보기를 누르시면 어느정도 축소되는지 볼 수 있어요. 그 다음에 확인 버튼을 누르면

크기변환_원래.jpg 이런식으로 변환이 됩니다. (옵션에 따라 저장되는 위치나 파일 이름은 다를 수 있어요.)

2. Adobe Photoshop으로 이미지 크기 변경하기



File - Open을 통해 크기를 변경할 이미지를 불러옵니다.

Adobe Photoshop에서는 웹에서 사용할 용도로 이미지를 저장하는 옵션을 따로 가지고 있어요.

File-Save for Web을 클릭합니다.



Image Size 라는 탭을 클릭합니다.
(빨간 사각형으로 표시되어 있어요.)



크기를 변경할 수 있는 탭이 활성화되었네요.



New Size 부분에서 width와 height의 크기를 픽셀 단위로 변경할 수 있어요.
Constrain Proportion에 체크되어 있다면 한 쪽을 줄일 때 전체적으로 같이 줄여줍니다.(그림이 안 일그러지도록)
Percent는 Original Size를 100%로 놓고 값을 보여주고요, Percent 단위로도 변경 가능합니다.
다 조정하셨으면 Apply (빨간 네모칸으로 표시) 버튼을 누르셔서 옆에 이미지 크기가 변경되는 지 확인하시고요.
Save(보라색 네모칸으로 표시) 버튼으로 저장을 하면 됩니다.

3) 이미지 호스팅 서비스 이용

http://www.imageshack.us/

미국 회사인데, 광고를 게시하는 대신에 무료 이미지 호스팅을 해 줍니다.
사진첩에는 직접 업로드 하면 되지만 게시판에 글을 쓸 때 이미지가 필요할 경우 유용합니다.
이 글도 이 서비스를 이용해서 작성되었고요.

사용방법은 간단합니다. 업로드 할 이미지 중 PC에 저장된 이미지를 '찾아보기..'를 통해 지정해 줍니다.
크기를 변경하고 싶다면 resize image에 check한 후 변경할 size를 선택합니다.
(image 크기에 대해 간략한 설명이 나올 겁니다.)

가능한 파일타입은 jp(e)g gif bmp png tif(f) swf 이고요, 용량은 1.5 MB를 넘으면 안 됩니다.
host it! 버튼을 눌러서 호스팅을 시킵니다.



Thumbnail for Websites는 웹사이트에서 이미지를 보여주는데 썸네일 형식으로 조그맣게 보여준다는 뜻이고요.
Hotlink for Websites는 호스팅한 이미지를 그대로 보여주는 것입니다.
(HTML 태그를 이용해야 하니, 제로보드에서는 HTML 사용에 체크를 해 주시고 복사-붙여넣기 하시면 되겠죠?)
Direct link to image는 이미지가 호스팅 된 링크 주소이고요.

forum이 들어잇는 옵션은 포럼 형태의 게시판에서 쓰이는 BBCode 형식인데 제로보드에서는 지원하지를 않으니 여기서는 별로 쓰실 일이 없을 것 같네요.

Note: kusci.net에 작성했던 글을 그대로 옮깁니다.