Web Guide다크모드테마 전환야간 모드
다크모드 지원, 꼭 필요한가
요즘 다들 한다고 해서 우리도 해야 하는 것은 아닙니다.
제작과 유지 비용이 두 배 가까이 드는 결정입니다. 필요한 경우와 아닌 경우를 구분해야 합니다.
01비용이 두 배에 가깝다
다크모드는 색만 반전하면 되는 것이 아닙니다. 모든 색을 다시 정하고, 모든 화면을 두 번 확인하고, 이미지와 로고도 별도로 준비해야 합니다.
이후 페이지를 추가할 때마다 두 가지 모드를 모두 만들어야 합니다.
색 체계 두 벌모든 색의 다크모드 버전을 정해야 합니다.
검수 두 배모든 화면을 양쪽 모드에서 확인합니다.
이미지 대응투명 배경 로고, 흰 배경 이미지가 다크모드에서 튑니다.
그림자와 테두리밝은 배경 기준으로 만든 효과가 어두운 배경에서 안 보입니다.
유지 부담페이지를 추가할 때마다 두 번 작업합니다.
02필요한 경우
사용자가 오래 머무르는 서비스, 밤에 쓰는 서비스, 개발자나 젊은 사용자층이 많은 서비스에서는 다크모드 요구가 실제로 있습니다.
반면 잠깐 방문해 정보를 확인하고 나가는 기업 홈페이지에서는 요구가 거의 없습니다.
필요한 경우
장시간 사용하는 서비스 · 야간 사용이 많음 · 개발자·젊은 층 대상 · 텍스트 중심 콘텐츠 · 앱과 함께 운영
불필요한 경우
잠깐 방문하는 기업 홈페이지 · 브랜드 색이 중요한 사이트 · 이미지 중심 · 예산이 제한적 · 페이지가 많음
03한다면 지킬 것
다크모드를 제대로 하려면 단순히 배경을 검게 만드는 것이 아닙니다. 완전한 검정 배경은 오히려 눈이 피로합니다.
그리고 사용자의 시스템 설정을 따르되, 직접 전환할 수도 있게 하는 것이 일반적입니다.
완전한 검정 피하기
순수 검정보다 살짝 밝은 회색이 눈에 편합니다.
흰색 글자 피하기
순백보다 약간 어두운 회색이 눈부심을 줄입니다.
채도 낮추기
밝은 모드의 색을 그대로 쓰면 어두운 배경에서 너무 튑니다.
시스템 설정 따르기
사용자 기기 설정을 기본값으로 합니다.
수동 전환 제공
직접 바꿀 수 있는 버튼도 둡니다.
선택 기억
다음 방문 때도 선택이 유지되게 합니다.
04대안이 있다
전면 다크모드 대신 부분적으로 대응하는 방법도 있습니다. 비용을 크게 들이지 않고 불편을 줄일 수 있습니다.
특히 밝은 흰 배경이 눈부신 문제는 배경색을 아주 연한 회색으로 하는 것만으로도 완화됩니다.
점검 항목
배경을 순백 대신 연회색
눈부심이 줄어듭니다. 비용이 들지 않습니다.
본문 글자색 조정
순수 검정 대신 진한 회색. 대비가 과하지 않게.
읽기 모드
긴 글 페이지에만 다크모드를 제공하는 방법.
나중에 추가
요구가 실제로 있을 때 추가합니다. 구조만 미리 고려해 둡니다.
CHECK POINT
□ 다크모드 요구가 실제로 있는지 확인했는가
□ 제작과 유지 비용 증가를 감안했는가
□ 한다면 완전한 검정을 피했는가
□ 밝은 모드 색을 그대로 쓰지 않았는가
□ 시스템 설정을 기본값으로 따르는가
□ 선택이 다음 방문에도 유지되는가
□ 전면 도입 대신 부분 대응을 검토했는가
#다크모드#테마 전환#야간 모드#컬러 시스템#제작 비용#접근성#사용성#홈페이지 디자인#웹비스타#홈페이지 제작