Technote

워드프레스 실무 노하우 골라 읽는 기술 노트

글 34편· 테마 · 플러그인 · 디자이너

테마 · 플러그인 실무

편집 가능한 영역을 디자인 전에 정합니다

CMS 가 표현할 수 없는 디자인은 배포된 뒤에도 계속 협상 대상으로 남습니다. 어디까지 편집자가 바꿀 수 있는지를 먼저 정하면 그 협상 자체가 사라집니다.

디자이너 3분 읽기

테마 · 플러그인 심화

JS 없이 만드는 상호작용과 그것을 안전하게 하는 규칙

details · :target · :focus-within · :has() · 스크롤 타임라인으로 상당수의 상호작용이 스타일시트 안에서 끝납니다. 안전하게 만드는 규칙은 하나입니다 — 기본값이 완성된 상태여야 합니다.

디자이너 6분 읽기

테마 · 플러그인 실무

아이콘을 폰트로 넣을까, SVG 로 넣을까

세 방식은 화면에서 같은 그림을 그립니다. 갈리는 것은 색을 몇 개 쓸 수 있는가, 보조기기에 무엇으로 읽히는가, 그리고 실제로 몇 개가 방문자에게 내려가는가입니다.

디자이너 6분 읽기

테마 · 플러그인 실무

다크 모드는 기본값이 아니라 결정이어야 합니다

다크 모드는 기능 하나가 아니라 유지·검증해야 할 표면이 두 배가 되는 일입니다. 넣을 이유가 분명한 사이트가 있고, 그렇지 않은 사이트가 있습니다.

디자이너 4분 읽기

테마 · 플러그인 심화

sticky 가 조용히 죽는 이유 — 조상의 overflow 한 줄

position: sticky 는 실패해도 에러를 내지 않습니다. 임계값 · 부모의 여유 · 조상의 overflow 세 가지만 순서대로 확인하면 원인은 거의 항상 그 안에 있습니다.

디자이너 5분 읽기

테마 · 플러그인 심화

측정폭과 수직 리듬 — 끝까지 읽히는 본문 조판

한 줄에 몇 글자를 담을지와 요소 사이 간격을 어떻게 쌓을지가 장문 글의 완독률을 좌우합니다. 한글은 글자가 넓어 라틴 기준의 글자 수 관례를 그대로 쓸 수 없습니다.

디자이너 5분 읽기

테마 · 플러그인 실무

페이지 빌더의 대가 — 편집 편의와 이관 가능성

빌더는 한 가지를 아주 잘합니다. 대신 레이아웃이 데이터베이스로 들어갑니다. 경계선을 어디에 긋느냐가 이 교환을 감당 가능하게 만듭니다.

디자이너 3분 읽기

테마 · 플러그인 실무

편집자에게 임의 색을 주지 않는 설정

색 선택기를 열어 두면 6개월 뒤 브랜드색과 미묘하게 다른 색이 사이트에 쌓입니다. 편집자의 잘못이 아니라 시스템이 물어봤기 때문입니다.

디자이너 3분 읽기

Cited

함께 보면 좋은 기술 노트

워드프레스 밖의 주제는 같은 팀이 운영하는 동지커뮤니케이션 기술 인사이트에 정리돼 있습니다. 아래 요약은 원문 그대로 인용했으며, 제목을 누르면 원문으로 이동합니다.

기술 인사이트 전체 보기

₩270,000 · 신청하기