SEO 입문
대체 텍스트 — 장식 이미지와 정보 이미지는 반대로 씁니다
모든 이미지에 설명을 붙이는 것이 정답이 아닙니다. 장식 이미지는 비워야 하고, 정보 이미지는 그림이 아니라 정보를 적어야 합니다.
Technote
디자인과 사용자 경험을 책임지는 디자이너를 위한 가이드. 테마 선택 · 웹폰트 · 이미지 최적화가 속도와 전환에 미치는 영향을 다룹니다.
글 71편· 디자이너
SEO 입문
모든 이미지에 설명을 붙이는 것이 정답이 아닙니다. 장식 이미지는 비워야 하고, 정보 이미지는 그림이 아니라 정보를 적어야 합니다.
테마 · 플러그인 입문
16px은 누가 정한 유행이 아니라 브라우저와 사용자가 합의한 기본값입니다. 그 값을 기준으로 삼되, 한글 장문에서는 한 단계 올릴 이유가 분명히 있습니다.
성능 최적화 입문
카메라 원본을 그대로 올려도 화면은 멀쩡해 보입니다. 그래서 문제가 늦게 발견됩니다 — 워드프레스가 그 뒤에서 무엇을 하는지 알면 기준이 잡힙니다.
테마 · 플러그인 입문
브랜드색 하나로는 화면을 그릴 수 없습니다. 호버 · 눌림 · 틴트 배경 · 비활성까지 필요한 변형을 규칙으로 뽑아내면, 화면마다 색을 새로 고르는 일이 없어집니다.
테마 · 플러그인 입문
파일 두 개면 끝납니다. 다만 헤더의 Template 한 줄과 스타일 로드 순서를 잘못 잡으면, CSS 를 아무리 써도 화면이 바뀌지 않습니다.
테마 · 플러그인 입문
연한 회색 본문은 시안에서 가장 세련되어 보이고, 실제 화면에서 가장 먼저 읽히지 않습니다. 기준값 세 개만 알면 색을 고르는 그 자리에서 판단할 수 있습니다.
테마 · 플러그인 입문
좁은 화면에서 시작하면 결정할 것이 줄어듭니다. 넓은 화면에서 시작하면 매번 무엇을 버릴지 정해야 하고, 그 결정은 끝나지 않습니다.
테마 · 플러그인 입문
웹의 기본 행간은 라틴 알파벳을 기준으로 정해진 값입니다. 한글은 같은 크기에서 글자 안의 획이 더 촘촘하고 받침 때문에 실제 글자 높이도 커서, 같은 1.5가 훨씬 답답하게 읽힙니다.
테마 · 플러그인 입문
시안에 붙은 색 견본과 디자인 토큰은 값이 같아도 다른 물건입니다. 차이는 값이 아니라 이름에 있고, 그 이름이 6개월 뒤의 수정 비용을 정합니다.
성능 최적화 입문
사진과 평면 도형은 압축이 작동하는 원리가 다릅니다. 그 차이를 알고 고르면 눈에 보이는 화질은 그대로인 채 파일만 작아집니다.
테마 · 플러그인 입문
테마 업데이트는 폴더를 통째로 교체합니다. 그것이 정상 동작이고, 그래서 우리 수정은 교체되지 않는 자리에 있어야 합니다.