Technote

테마 · 플러그인

테마와 플러그인을 고르는 법 · 검증하는 법 · 대체제 · 성능 영향. 잘못된 선택이 만드는 비용을 다룹니다.

글 51편· 테마 · 플러그인

테마 · 플러그인 실무

그리드 칸이 내용 때문에 부푸는 문제 — minmax(0, 1fr)

repeat(3, 1fr) 은 세 칸이 같은 폭이 된다고 약속하지 않습니다. 안에 든 코드 블록이나 긴 문자열 하나가 칸을 밀어내고, 그러면 판 전체가 화면 밖으로 나갑니다.

디자이너 3분 읽기

테마 · 플러그인 실무

CSS 커스텀 프로퍼티로 토큰 심기

토큰 목록을 :root 한 곳에 두고 컴포넌트가 그것만 참조하게 만들면, 사이트 전체의 색과 간격이 파일 하나에서 움직입니다.

디자이너 3분 읽기

테마 · 플러그인 실무

설치 버튼을 누르기 전 3분 동안 볼 것

플러그인은 우리 사이트 안에서 우리와 같은 권한으로 돕니다. 그래서 고르는 기준은 기능이 아니라 신뢰이고, 신뢰는 설치 전에 확인할 수 있습니다.

창업가 3분 읽기

테마 · 플러그인 실무

색과 폰트는 페이지마다 고르지 않습니다

페이지를 만들 때마다 색을 고르면 한 사이트 안에 열 개의 사이트가 생깁니다. 전역 설정 한 곳에 넣어 두는 것만으로 이 문제가 사라집니다.

창업가 3분 읽기

테마 · 플러그인 입문

처음에 필요한 플러그인은 다섯 개뿐입니다

플러그인 하나는 기능 하나가 아니라 유지보수 부채 하나입니다. 처음부터 스무 개를 깔면 무엇이 문제를 만드는지 영영 알 수 없게 됩니다.

창업가 3분 읽기

테마 · 플러그인 실무

초점 표시를 지우지 않기 — outline: none 이 없애는 것

기본 초점 링이 디자인과 맞지 않는 것은 사실입니다. 다만 지우기만 하면 키보드 사용자의 커서가 통째로 사라집니다 — 지우는 대신 바꾸는 방법이 있습니다.

디자이너 3분 읽기

테마 · 플러그인 실무

clamp() 하나로 단계마다 값을 다시 쓰지 않기

제목 크기를 브레이크포인트마다 다시 선언하고 있다면 유지보수가 계속 늘어납니다. clamp() 는 최소 · 유동 · 최대를 한 줄에 담아 그 재선언을 없앱니다.

디자이너 4분 읽기

테마 · 플러그인 실무

keep-all 이 한글에 주는 것, 다른 언어에서 빼앗는 것

한글 어절이 중간에서 잘리는 문제는 CSS 한 줄로 해결됩니다. 그런데 그 한 줄은 공백이 없는 일본어 · 중국어에서 "끊을 자리가 없다"는 뜻이 되어 가로 스크롤을 만듭니다.

디자이너 5분 읽기

₩270,000 · 신청하기