첫 화면을 꽉 채우려 100vh를 썼더니, 모바일 주소창이 '문의' 버튼을 반쯤 잘라먹는다 — 화면 높이를 주소창까지 계산해 담는 CSS dvh·svh 단위의 시대
모바일에서 100vh는 주소창이 접힌 가장 큰 높이를 기준으로 잡혀 버튼이 잘리곤 합니다. 주소창을 계산에 넣는 새 단위 svh·lvh·dvh로 자바스크립트 없이 첫 화면을 정확히 채우는 법을 정리했습니다.
문의가 들어와도 사장님은 저녁에야 메일함을 열고, 손님은 답장 빠른 옆 가게로 넘어간다 — 작은 회사 웹사이트 문의 실시간 알림(카톡·문자) 설계의 5가지 원칙
홈페이지 문의를 이메일로만 받으면 늦게 확인해 손님을 놓치기 쉽다. 알림톡·문자 이중화부터 미확인 리마인드까지, 문의를 놓치지 않는 실시간 알림 설계 5가지 원칙을 정리했다.
네이버·인스타·GA·매출이 네 군데에 흩어져 매주 캡처만 하다 오전이 다 간다 — 작은 회사가 마케팅 데이터를 한 대시보드로 모으는 5가지 원칙
채널마다 따로 노는 숫자를 매주 캡처해 붙이는 일에 반나절을 쓰고 있다면, 문제는 데이터가 아니라 흩어진 구조다. 흩어진 마케팅 데이터를 한 대시보드로 모으는 5가지 원칙을 정리했다.
해킹 메일 한 통에 5년치 홈페이지가 통째로 사라지고서야, 사장님은 그제야 '백업'을 검색한다 — 작은 회사 웹사이트 백업·복구 설계의 5가지 원칙
사고는 예고 없이 찾아오고, 백업이 없으면 홈페이지는 한순간에 사라진다. 작은 회사가 데이터를 지키는 백업·복구 설계의 다섯 가지 핵심을 정리했다.
손님은 지금 딱 하나만 물으면 되는데, 문의 폼은 이름·연락처부터 요구하고 답은 내일에야 온다 — 작은 회사 웹사이트에 실시간 채팅 상담을 붙이는 5가지 원칙
전화는 부담스럽고 문의 폼은 느립니다. 손님이 궁금한 순간 바로 묻고 바로 답받는 실시간 채팅 상담을, 작은 회사가 성가시지 않게 잘 붙이는 5가지 원칙을 정리했습니다.
손님은 우리 홈페이지의 색만 보고도 '믿을 만한 곳'인지 '싸구려'인지를 3초 만에 정한다 — 작은 회사 웹사이트 색상(브랜드 컬러) 설계의 5가지 원칙
색은 취향이 아니라 신뢰의 문제다. 업종에 맞는 주색 하나, 셋으로 줄인 팔레트, 버튼에만 쓰는 강조색까지 — 돈 들이지 않고 홈페이지를 믿음직하게 만드는 색 설계 5가지 원칙을 정리했다.
손님은 한 번 사고 나면 우리 가게를 그날로 잊는다 — 작은 회사가 카카오톡 채널로 손님을 단골로 붙드는 5가지 원칙
새 손님을 부르는 광고비는 매달 나가는데, 계산이 끝나는 순간 손님과의 연결은 끊긴다. 카카오톡 채널로 그 끈을 다시 잇는 다섯 가지 원칙을 정리했다.
스타일이 서로 이기려고 !important를 덕지덕지 붙이다, 어느 순간 아무도 화면 색 하나 못 바꾼다 — CSS 캐스케이드 레이어(@layer)가 스타일의 서열을 미리 정해 두는 시대
CSS에서 스타일끼리 우선순위 싸움이 벌어질 때마다 !important와 복잡한 선택자로 힘겨루기하던 관행의 한계와, 스타일의 서열을 미리 층으로 나눠 정해 두는 캐스케이드 레이어(@layer)가 작은 회사 웹사이트 관리에 주는 이점을 풀어냅니다.
고객은 우리 사이트에서 찾다 못 찾고 나간다 — 작은 회사 웹사이트 내부 검색을 제대로 만드는 5가지 원칙
메뉴를 아무리 잘 짜도 방문자의 상당수는 검색창부터 찾습니다. 결과 0건으로 끝나는 검색을 매출로 바꾸는 내부 검색 설계 원칙 다섯 가지를 정리했습니다.