SEO 입문
읽히는 글의 뼈대 — 질문, 답, 근거, 다음 행동
글이 안 읽히는 이유는 문장력이 아니라 순서인 경우가 대부분입니다. 네 부분의 순서만 지키면 글쓰기 훈련 없이도 끝까지 읽힙니다.
Technote
글 217편
SEO 입문
글이 안 읽히는 이유는 문장력이 아니라 순서인 경우가 대부분입니다. 네 부분의 순서만 지키면 글쓰기 훈련 없이도 끝까지 읽힙니다.
테마 · 플러그인 입문
기능표를 비교하면 유료가 언제나 이깁니다. 창업가의 기준은 기능이 아니라 데이터의 무게 — 그 도구가 사라졌을 때 무엇을 잃는가입니다.
보안 입문
취약점은 조용히 존재하다가 어느 날 공개됩니다. 공개된 순간부터 시계가 돌아가고, 그 시계는 우리가 업데이트를 누를 때 멈춥니다.
테마 · 플러그인 입문
데모 화면은 어느 테마나 예쁩니다. 1년 뒤에도 문제가 없을지를 가르는 것은 유지보수 이력과 속도이고, 둘 다 구매 전에 확인할 수 있습니다.
AI 활용 실무
능력의 문제가 아니라 맥락의 문제입니다. AI가 볼 수 없는 정보로 내려야 하는 결정이 어떤 것인지 알면, 맡길 것과 맡기지 않을 것이 분명해집니다.
테마 · 플러그인 입문
기기 이름으로 정한 기준선은 매년 낡습니다. 대신 컴포넌트를 천천히 넓히면서 무너지는 지점을 기록하면, 그 값이 그대로 기준선이 됩니다.
SEO 입문
모든 이미지에 설명을 붙이는 것이 정답이 아닙니다. 장식 이미지는 비워야 하고, 정보 이미지는 그림이 아니라 정보를 적어야 합니다.
테마 · 플러그인 입문
16px은 누가 정한 유행이 아니라 브라우저와 사용자가 합의한 기본값입니다. 그 값을 기준으로 삼되, 한글 장문에서는 한 단계 올릴 이유가 분명히 있습니다.
성능 최적화 입문
카메라 원본을 그대로 올려도 화면은 멀쩡해 보입니다. 그래서 문제가 늦게 발견됩니다 — 워드프레스가 그 뒤에서 무엇을 하는지 알면 기준이 잡힙니다.
테마 · 플러그인 입문
브랜드색 하나로는 화면을 그릴 수 없습니다. 호버 · 눌림 · 틴트 배경 · 비활성까지 필요한 변형을 규칙으로 뽑아내면, 화면마다 색을 새로 고르는 일이 없어집니다.
AI 활용 실무
기계 번역은 사이트를 더 많은 사람이 읽을 수 있게 만듭니다. 다만 검색 노출은 그렇게 얻어지지 않고, 그 차이를 알고 쓰면 선택이 쉬워집니다.
테마 · 플러그인 입문
파일 두 개면 끝납니다. 다만 헤더의 Template 한 줄과 스타일 로드 순서를 잘못 잡으면, CSS 를 아무리 써도 화면이 바뀌지 않습니다.
Cited
워드프레스 밖의 주제는 같은 팀이 운영하는 동지커뮤니케이션 기술 인사이트에 정리돼 있습니다. 아래 요약은 원문 그대로 인용했으며, 제목을 누르면 원문으로 이동합니다.
AI 활용
CLAUDE.md 작성법 — AI 코딩 어시스턴트에게 프로젝트를 가르치는 기술
Claude Code, Cursor, Copilot 같은 AI 코딩 도구는 프로젝트 컨텍스트를 정확히 알수록 더 나은 결과를 냅니다. 효과적인 CLAUDE.md 구조와 작성 원칙을 공유합니다.
AI 활용
AI에게 UI 디자인을 요청하는 프롬프팅 전략 — Claude·GPT로 시안 만들기
AI에게 "예쁜 버튼 만들어줘"라고 요청하면 실망스러운 결과가 나옵니다. 제약 조건·레퍼런스·역할 정의를 담은 구조적 프롬프트로 원하는 디자인을 정확하게 요청하는 전략을 공유합니다.
테마 · 플러그인
SCSS 기초 완전 정복 — 변수부터 모듈 구조까지
CSS의 한계를 극복한 SCSS(Sass)의 핵심 문법을 정리합니다. 변수, 중첩, Mixin, @use, 모듈 구조까지 — 실무에서 바로 쓸 수 있는 패턴 중심으로 설명합니다.
테마 · 플러그인
디자인 토큰 & 테마 색상 시스템 — SCSS 변수로 브랜드 아이덴티티 구축하기
색상 팔레트를 단순한 HEX 코드 모음이 아닌, 의미 있는 설계 시스템으로 만드는 방법. 시맨틱 토큰 구조와 SCSS 변수 설계 패턴을 실제 프로젝트 예시로 설명합니다.
성능 최적화
반응형 타이포그래피 시스템 설계 — 웹 가독성의 과학
폰트 크기를 픽셀로 하드코딩하는 시대는 끝났습니다. Type Scale, clamp()로 유동적 폰트 크기, 한글 웹폰트 최적화, 줄간격 황금비율까지 — 어떤 화면에서도 읽기 좋은 타이포그래피 시스템을 설계하는 방법을 알아봅니다.
개발 워크플로우
피그마에서 SCSS로 — 디자이너·개발자 핸드오프 실전 가이드
피그마 디자인을 코드로 옮기는 과정에서 발생하는 오해와 손실을 최소화하는 방법. 토큰 추출, 컴포넌트 명명 규칙, 스페이싱 시스템 동기화까지 실무 워크플로우를 단계별로 정리합니다.