본문은 끝났는데 그림 자리가 비어 있었습니다
블로그 여러 편에 개념 그림이 들어갈 자리가 있었습니다. 그런데 그 자리에는 실제 그림이 아니라 자리표시(placeholder)가 들어가 있었고, 캡션도 그림을 설명하지 않고 '여기에 그림이 들어갈 예정'에 가까운 문구였습니다.
영상 섹션도 사정이 같았습니다. 연결된 영상이 없는 글에서도 영상 섹션이 화면에 그려졌습니다. 링크가 있어야 할 곳에는 준비 중이라는 문구가 남아 있었습니다.
쓸 때는 '나중에 채우자'였습니다. 문제는 그 '나중'이 배포보다 뒤였다는 점입니다. 독자에게는 본문은 다 끝났는데 화면 곳곳에 지키지 않은 약속이 붙어 있는 글로 보였을 겁니다.
지금 배포된 당신의 사이트에는 '곧 추가'라고 적어 둔 채 남아 있는 자리가 몇 개나 있습니까?
왜 아무것도 실패하지 않았나
자리표시도 빌드 입장에서는 멀쩡한 콘텐츠입니다. 이미지 경로는 존재하고, 캡션은 문자열이고, 준비 중 문구도 그냥 텍스트입니다. 빌드는 통과하고 페이지는 정상적으로 뜹니다. 깨지는 것이 없으니 경고도 없습니다.
영상 섹션은 템플릿 쪽 문제였습니다. 영상 필드가 비어 있는지와 상관없이 섹션을 그리는 구조였습니다. 글 파일을 아무리 고쳐도 템플릿이 빈 틀을 계속 그렸을 겁니다.
당신이라면? 자리표시를 모두 지우고 그림 없는 글로 두겠습니까, 아니면 한 번에 다 채우겠습니까?
한 커밋에서 한 일
- 브랜드 톤을 맞춘 SVG 다이어그램 17개를 만들어 각 글의 자리표시를 대신하게 했습니다. 파일은 글 슬러그별 이미지 폴더에 넣었습니다.
- 영상 섹션은 영상이 없으면 아예 숨기도록 템플릿을 바꿨습니다. 영상이 있을 때는 ▶ 표시와 영상 제목을 함께 보여 줍니다. 이를 위해 frontmatter에 youtubeTitle 필드를 추가했습니다.
- 자리표시용 캡션과 준비 중 링크 문구를 정리했습니다.
변경은 글 파일 한 편당 몇 줄 수준이었고, 템플릿 쪽이 조금 더 컸습니다. 핵심은 '비어 있으면 그리지 않는다'를 콘텐츠가 아니라 템플릿이 맡도록 한 것입니다.
값싸게 채울 수 없었던 한 편
ffmpeg 함정을 다룬 글 하나만 자리표시를 남겼습니다. 그 자리에 필요한 건 개념도가 아니라 실제 터미널 출력 캡처였기 때문입니다. 다이어그램은 개념을 설명할 수는 있어도 명령을 실제로 돌렸다는 증거를 대신하지는 못합니다. 그럴듯한 그림으로 덮으면 자리는 채워지지만 글의 근거는 오히려 약해집니다. 이 한 편은 명령을 다시 돌리고 화면을 캡처하는 수고 말고는 방법이 없습니다.
자가진단 체크리스트
- 배포된 페이지에서 placeholder, 준비 중, coming soon 같은 문자열을 검색하면 몇 개가 나옵니까?
- 선택 필드(영상, 링크, 이미지)가 비어 있을 때 템플릿이 섹션 자체를 숨깁니까, 빈 틀을 그립니까?
- 채우지 못한 자리 중에서 그림으로 대신할 수 있는 것과 실제 캡처가 있어야 하는 것을 구분해 두었습니까?
솔직한 부분
자리표시가 얼마 동안 노출됐는지, 몇 명이 봤는지, 그게 체류나 신뢰에 영향을 줬는지는 모릅니다. 확인할 데이터가 없습니다. 새로 넣은 다이어그램은 개념을 그린 것이지 측정값을 시각화한 게 아닙니다. ffmpeg 글은 아직 자리표시가 남아 있습니다. 그리고 이 커밋에는 같은 일이 다시 생기는 걸 막는 자동 검사가 들어 있지 않습니다. 다음 글에서 또 '나중에 채우자'를 쓰면, 막아 줄 장치는 지금도 없습니다.