새로운 질서 위키

제목을 다음 문단과 붙여두기

쪽 끝에 제목만 남고 설명은 다음 쪽으로 넘어가면 두 내용의 관계를 따라가기 어렵다. ‘다음 문단과 함께’ 같은 조판 설정은 제목의 마지막 줄과 다음 문단의 첫 줄 사이에서 쪽이 나뉘지 않게 한다. 제목 스타일에 묶어두면 반복해서 적용하기 쉽다. (Practical Typography: Keep with next paragraph)

  • 제목과 뒤따르는 본문, 도판과 그 캡션처럼 함께 읽을 단위를 정한다.
  • ‘문단 안의 줄을 함께 유지하기’와 ‘다음 문단과 함께 유지하기’를 구별한다. 하나는 문단 내부를, 다른 하나는 문단 사이를 다룬다.
  • 모든 문단을 연달아 묶으면 큰 덩어리가 움직이거나 원치 않는 빈 공간이 생길 수 있다. 필요한 경계에만 적용한다.
  • 종이 크기, 여백, 글자 크기를 바꾸면 쪽의 경계도 달라진다. 설정 이후에 최종 출력에서 다시 본다.

웹 페이지를 인쇄할 때

인쇄용 CSS에서는 제목 뒤의 쪽 나눔을 피하도록 요청할 수 있다. 아래는 기존 HTML의 <h2>와 <h3>에 적용할 CSS 조각이다.

@media print {
  h2, h3 {
    break-after: avoid-page;
  }
}

이 값은 쪽 나눔을 피하라는 조건이지, 다음 절 전체를 무조건 한 쪽에 넣는 명령은 아니다. 다른 강제 나눔이나 가용 공간도 결과에 영향을 준다. 웹 브라우저가 만든 PDF에서 제목과 다음 문장이 어느 쪽에 놓였는지 확인한다. (MDN: break-after)

브라우저 인쇄와 판짜기에서 읽는 순서의 쪽을 먼저 확인하고, 쪽 끝에 남은 한 줄은 문단 내부의 나눔 문제로 따로 살필 수 있다.

#타이포그래피 #CSS #인쇄

검색