대니
danny's blog@dannywon_dev
발행 74 · 대기 92

1인 개발자. 클로드 코드를 팀처럼 굴린다. 매일 겪은 것만 쓴다.

버그와 함정

도련 3mm 는 표준이 아니었다 — CSS @page 를 뺀 이유

명함 인쇄용 파일을 만들다 도련 값을 하나로 박았는데, 국내 인쇄소 중 3mm 를 쓰는 곳이 없었다

인쇄소에 넘길 파일을 코드로 만들 때 제일 먼저 검색하는 게 도련 값이다. 검색하면 3mm 라고 나온다. 나도 그렇게 박았다.

명함을 만들어 주는 화면을 짰다. 화면에서 편집하면 인쇄소에 넘길 파일이 그대로 나오는 물건이다. 인쇄물엔 도련이라는 게 있다. 종이를 자를 때 칼이 밀리니까 실제 크기보다 바깥으로 조금 더 뽑아두는 여백이다. 배경색이 가장자리까지 가는 디자인이면 이게 없으면 흰 선이 남는다.

export const BLEED_MM = 3;

CSS 에도 종이 크기를 박았다. 90×50mm 명함에 사방 3mm 를 더해서 96×56mm.

@page { size: 96mm 56mm; margin: 0; }

3mm 인 곳이 없었다

며칠 뒤 국내 인쇄소들의 입고 규격을 실제로 찾아봤다.

업체 도련 작업 크기
A사 2mm 94×54mm
B사 1mm 92×52mm

3mm 인 곳이 없었다. 내가 만든 파일은 어느 업체에 넘겨도 크기가 안 맞았다.

덤으로 하나 더 나왔다. B사는 AI·EPS·PDF 만 받는다. 나는 SVG 내려받기 버튼에 「인쇄소에 넘길 때 쓰세요」라고 적어뒀는데, 그 업체는 접수 자체를 안 해준다.

물리 값인 줄 알았다

「업계 표준이니까 값 하나면 된다」고 생각했다. 도련은 물리적인 것이고, 칼이 밀리는 정도는 어디나 비슷할 테니까.

틀렸다. 도련은 물리 값이 아니라 계약 값이다. 그 업체의 재단기와 공정이 정하고, 업체가 「이렇게 보내라」고 공지한다. 물리학이 아니라 규약이다.

이걸 가르는 질문이 하나 있었다. 이 값을 정하는 게 누구인가.

  • 자연이 정하는 값(A4 크기, 1인치=25.4mm)은 하나로 박아도 된다
  • 받는 쪽이 정하는 값(도련, 파일 형식, 색 공간)은 받는 쪽을 먼저 고르게 해야 한다

내가 박은 3mm 는 두 번째였는데 첫 번째인 줄 알았다.

그래서 뭘 바꿨나

업체를 먼저 고르게 했다. 고르면 도련이 따라 바뀌고, 그 업체가 요구하는 것도 같이 뜬다.

{ id: "A", bleedMm: 2, accepts: "PDF · AI",       needsOutline: false }
{ id: "B", bleedMm: 1, accepts: "AI · EPS · PDF", needsOutline: true  }
{ id: "custom", bleedMm: 3, accepts: "PDF", note: "쓸 업체 공지를 확인하세요" }

needsOutline 이 켜진 업체를 고르면 인쇄 버튼 아래에 경고가 뜬다. 브라우저가 만드는 PDF 는 글꼴을 심을 뿐 윤곽선으로 바꾸지 않아서, 그 업체에선 반려될 수 있다. 못 고치는 문제라도 화면에 적어두는 것과 안 적어두는 것은 다르다.

그리고 CSS 에서 종이 크기를 뺐다.

🔴 `@page` 는 여기 없다 — 코드가 그때그때 만들어 넣는다.
   크기가 90×50 과 세로형 50×90 으로 갈리고 도련도 업체마다(2·1·3mm) 달라서
   CSS 에 박아두면 반드시 어긋난다.

값 하나를 고치는 일이 아니었다. 「이 값은 하나로 정해질 수 있는가」를 잘못 판단한 것이라, 그 값이 흘러 들어가던 자리를 전부 열어야 했다.

박아둘 값과 물어볼 값은 다르다. 가르는 건 그걸 정하는 사람이 나인가 상대인가다.

← 목록으로