"올해 이직운 있나요?" 사주 앱 세 곳의 답이 다 달랐던 이유
같은 생년월일시를 넣었는데 앱마다 이직운 풀이가 정반대로 나왔습니다. 출생 시간 처리, 절기 기준, 해석 방식이 어디서 갈리는지 직접 비교해 정리했습니다.
사장님 모니터에선 쨍하던 브랜드 파랑이, 손님 아이폰에선 다른 파랑으로 뜬다 — 색을 sRGB 밖으로 꺼내는 oklch·display-p3의 시대
웹의 색은 30년 된 sRGB 상자 안에서만 움직여 왔습니다. oklch와 display-p3가 그 상자를 열었고, 덕분에 색은 더 선명해지기 전에 먼저 관리하기 쉬워집니다.
제목은 묵직하게, 본문은 담백하게 — 글꼴 파일을 네 개씩 부르지 않고 굵기를 조절하는 법
굵기마다 글꼴 파일을 따로 싣느라 제목이 밍밍해진 사이트가 많습니다. 한 파일로 100부터 900까지 다루는 가변 폰트가 한글 사이트에서 특히 유리한 이유와, 도입 전 확인할 세 가지를 정리했습니다.
서버는 답을 다 준비해 뒀는데, 손님의 브라우저는 아직 무엇을 받을지 몰라 기다리고 있다 — HTTP/3와 103 Early Hints가 첫 화면을 앞당기는 시대
사이트가 느린 이유가 늘 이미지 용량은 아닙니다. 파일을 내려받기도 전에 흘려보내는 연결·대기 구간을 HTTP/3와 103 Early Hints가 어떻게 줄이는지, 그리고 오늘 당장 할 수 있는 조치는 무엇인지 정리했습니다.
손님은 홈페이지를 잘 보고 나갔는데, 다시 부를 방법이 우리에겐 하나도 없다 — 앱 없이 브라우저가 손님을 데려오는 웹 푸시 알림의 현실과 한계
이메일도 전화번호도 없이, 앱을 만들지 않고도 손님 폰에 알림을 띄우는 웹 푸시. 아이폰 제약과 한 번뿐인 기회라는 현실을 짚고, 재입고·잔여 좌석·예약 리마인더처럼 실제로 효과가 나는 자리와 허용률을 올리는 순서를 정리했습니다.
이 CSS 신기능, 지금 써도 되나요 — Baseline이 대신 답해주는 것
새 기능을 소개하는 글은 넘치는데, 정작 필요한 답은 '언제부터 안심하고 써도 되는가'입니다. 브라우저 지원 판단의 공통 기준이 된 Baseline을 실무 관점에서 정리했습니다.
첫 화면을 꽉 채우려 100vh를 썼더니, 모바일 주소창이 '문의' 버튼을 반쯤 잘라먹는다 — 화면 높이를 주소창까지 계산해 담는 CSS dvh·svh 단위의 시대
모바일에서 100vh는 주소창이 접힌 가장 큰 높이를 기준으로 잡혀 버튼이 잘리곤 합니다. 주소창을 계산에 넣는 새 단위 svh·lvh·dvh로 자바스크립트 없이 첫 화면을 정확히 채우는 법을 정리했습니다.
스타일이 서로 이기려고 !important를 덕지덕지 붙이다, 어느 순간 아무도 화면 색 하나 못 바꾼다 — CSS 캐스케이드 레이어(@layer)가 스타일의 서열을 미리 정해 두는 시대
CSS에서 스타일끼리 우선순위 싸움이 벌어질 때마다 !important와 복잡한 선택자로 힘겨루기하던 관행의 한계와, 스타일의 서열을 미리 층으로 나눠 정해 두는 캐스케이드 레이어(@layer)가 작은 회사 웹사이트 관리에 주는 이점을 풀어냅니다.
손님이 검색창 대신 AI에게 묻고, AI가 정리해 준 답만 보고 홈페이지엔 들르지 않는다 — 생성형 AI 검색이 작은 회사의 검색 유입을 통째로 바꾸는 시대
손님이 검색 링크 대신 AI가 요약한 답을 먼저 봅니다. 클릭이 줄어드는 시대에 작은 회사 홈페이지가 AI에게 '인용'되게 만드는 5가지 원칙을 정리했습니다.