웹사이트 제작과 디지털 마케팅에 관한 이야기
같은 키워드로 검색해도 구글에선 1페이지에 뜨는 사이트가 네이버에선 흔적조차 없는 경우가 많다. 두 검색엔진은 동작 방식 자체가 다르고, 한국 고객을 잡으려면 네이버만의 노출 규칙을 따로 챙겨야 한다.
닥나무 껍질을 두드려 만드는 한지의 결을, 빠르게 스쳐 가는 디지털 화면에 어떻게 옮길 수 있을까. 한지 공방 '닥(DAK)'의 브랜드 사이트는 그 질문에서 출발했다.
한글 제목 끝에 한두 글자만 외롭게 다음 줄로 떨어지는 문제, CSS 한 줄로 해결할 수 있다. text-wrap: balance와 pretty는 자바스크립트 없이 한글 웹사이트의 줄바꿈을 자동으로 정돈해 주는 새 표준이다.
사용자가 다시 들어왔을 때 페이지가 더 빠르게 뜨는지, 매번 처음과 똑같이 무거운지는 코드가 아니라 응답 헤더 한 줄에서 갈립니다. Cache-Control과 ETag의 기본기만 잡아도 재방문 속도가 달라집니다.
모달, 드롭다운, 툴팁을 만들기 위해 라이브러리를 끌어다 쓰던 시대가 저물고 있습니다. HTML 표준에 들어온 Popover API는 두 줄의 속성만으로 접근성과 키보드 인터랙션까지 한꺼번에 해결해 줍니다.
한 번도 차를 마셔본 적 없는 사람이 다래의 사이트를 보고 첫 시음을 신청하기까지. 보성 산지의 고요함을 디지털 화면에 옮기는 작업은 사진 한 장보다 깊이의 문제였습니다.
매주 라인업이 바뀌고 한정판이 떴다 사라지는 작은 막걸리 양조장의 사이트는 일반 식음료 사이트와 결이 다릅니다. 발효의 시간을 사이트의 흐름으로 옮긴 달담 양조장 프로젝트 후기를 정리합니다.
한 페이지에 강조 버튼이 여러 개라면 가장 중요한 행동이 오히려 묻혀버립니다. 버튼에 위계를 부여해 사용자의 시선을 매출로 이어지는 흐름으로 안내하는 다섯 가지 디자인 원칙을 정리했습니다.
CTR과 CPC는 양호한데 매출이 그대로라면, 문제는 광고가 아니라 랜딩페이지일 가능성이 큽니다. 광고와 랜딩 사이의 '메시지 일치(Message Match)'를 점검하는 다섯 가지 원칙을 정리했습니다.