[포토샵 기초_해상도 개념] ppi와 dpi의 개념 웹, 저,고화질 인쇄 설정/ RGB,CMYK 컬러모드 간략히 알려드림

 

1. ppi(pixel per inch) 란?

'가로 세로 1인치당 들어가는 픽셀의 개수' 를 말합니다. 
- 웹용 설정 : 72 ppi 
- 저화질 인쇄용 : 보통 100~150ppi (현수막, 배너 등 인쇄물 보는 거리가 2m바깥)
- 고화질 인쇄용 : 300ppi(책 등 인쇄물 보는 거리가 20cm 안쪽(진짜 가까운 것), 용량높음 주의★)

 

2. dpi(dot per inch) 란?

'가로 세로 1인치당 들어가는 도트의 개수' 를 말합니다. 
단, 인쇄 시 해상도가 살짝 번질 수 있다는 것 주의 ★

 

3. dpi와 ppi의 차이가 무엇일까?
'실제 출력되는 이미지, 디지털 이미지의 차이'를 말합니다. 
컴퓨터 화면이나 휴대폰 액정으로 보는 이미지들은 작은 픽셀로 이루어져있는데, 이미지를 구성하는 요소가 '픽셀' 입니다.

단, 출력되는 이미지는 아주 작은 '점'들로 이루어짐.

 

4. pt와 ppi의 관계
단위     이름      환산값
---------------------------------------------
pt       point   1pt = 0.72inch 1/72
px       pixel    1px = 1dot(화면최소단위)
em       em     1em = 100%

 

72ppi = 1pt = 1px = 100%
96ppi = 1pt*96/72 > 133%
300ppi = 1pt*300/72 > 416%

 

※ 최종 출력물이 종이일 때는 PPI와 상관없이 24pt텍스트를 쓰면 항상 동일한 크기의 텍스트가 표시되지만 디스플레이 장치가 되면 크기가 달라보이는 문제가 생김 주의★

5.  [C+K > Units  > type = pixel] 
pixel 로 바꾸어주면 해상도에 따라서 폰트가 변하는 것을 방지해줍니다. 

6. 포토샵에서 한글 폰트가 영문으로 나온다면? 해결방법 

[C+K > type > show font names in english 체크해제] 만하면 끝!!

한글폰트가 계속 영문으로 나와서 애를 먹었다면 위에 순서대로 따라해보세요. 

 

요로케 나올 것입니다. 

 

7. 컬러모드

- Bitmap : 흑/백으로만 이루어진 컬러모드 2개의 색상 
- Grayscale : 회색 음영 모드 8비트에서는 최대 256까지 회색 음영을 사용할 수 있음.
- RGB : 빨노파 색상, 채널당 8비트를 사용하며 0(검정)에서 255(흰색)까지의 강도값이 할당.

예를 들어 밝은 빨강은 R246,G0,B50으로 이루어짐.
세 구성 요소값이 똑같으면 회색음영이 만들어짐.
모든 구성요소의 값이 255면 흰색, 0이면 검정.  

- CMYK : 인쇄용 컬러모드 0이면 검정이 되는 RGB와 달리 CMYK는 구성요소의 값이 모두 0이면 흰색이 됌.

청록,자주,노랑,검정으로 이루어져있으며 채도를 아무리 올려도 색이 변하지 않는 색들로 이루어짐.

- Lab : 밝기 구성요소(lightness)가 있으며 A(녹색-빨강), B(파랑-노랑)으로 이루어짐.  
※  Lab 가 실무에 잘 안쓰이긴 하지만 [ rgb > cmyk ]로 변경할때 Lab를 사용하게 되면 색상변화가 덜해서 쓰이기도 함. 

 

포토샵 컬러모드 RGB, CMYK

번외) 상세페이지 만들 때 웹 환경 기준이 되는 Font(폰트) 사이즈  

- title 기준 21px - title-large 기준 24px/36px/48px - text 16px 기본 기준 14/12/10px(무조건 2단위로 가야함) - text-large  기본 18/20/24/26/28px

이런 식으로 상세페이지 본문 텍스트 폰트 크기인 '배송안내' 에는 크기를 설정할 때에도 기본인 18px 사용했고,

'발송일 기준 3-4일 이내 도착할 예정입니다' 의 본문 폰트 크기는 14px로 사용하는 등의 규칙이 존재한다.

※ 폰트가 너무 적다면 2px 씩 늘어나는 규칙을 잊지 말고 키우기를!