개요
NanoH2O는 역삼투(RO)·나노여과(NF) 멤브레인을 만드는 수처리 기업이다. 사이트 상단 공지 바에는 LG Water Solutions Is Now NanoH2O – A New Era Begins라는 문장이 흐른다. 사명을 바꾸고 다시 시장 앞에 선 브랜드가 첫 화면에서 We are back이라고 선언하는 셈이다. 이번 리뷰는 이 리브랜딩 사이트가 복귀 선언을 어떤 시각 언어로 풀었는지, 그리고 B2B 산업재 웹사이트가 감성 스토리텔링과 제품 정보를 어떻게 한 흐름에 담았는지를 본다. 홈페이지 제작을 앞둔 제조·기술 기업이라면 눈여겨볼 장면이 많다.
브랜드 & 메시지
히어로는 어두운 수면 위에 We are back. And we're here to turn water into possibilities.라는 흰 헤드라인을 얹었다. 문장 끝 마침표만 오렌지로 칠한 디테일이 눈에 띈다. 이 오렌지 마침표는 아래의 Our technology is only the beginning.에서 다시 등장하며 브랜드 시그니처로 굳는다. Water is not our business. It's our purpose.에서는 purpose 한 단어만 오렌지로 강조해, 블랙·화이트·오렌지 세 가지 색만으로 톤앤매너를 통제한다. 네비게이션은 About Us, Media Center, Products, Solutions, Resources, Tools 여섯 항목으로 간결하고, CTA는 More Information 하나로 절제되어 있다. 소리 높여 팔지 않고 태도를 먼저 보여주는 구성이다.
UX/UI 관점
이 사이트 웹디자인의 강점은 스크롤 자체가 서사라는 점이다. 첫째, 다크 히어로에서 밝은 그라데이션 섹션으로, 다시 어두운 제품 섹션으로 이어지는 명암 리듬이 지루할 틈을 주지 않는다. 둘째, 작은 물방울이 스크롤을 따라 점점 커지다 사람의 모습을 품은 커다란 방울로 변하는 모티프는 물이 목적이라는 카피를 시각으로 증명한다. 셋째, RO/NF 멤브레인 실물을 검은 배경 위 스포트라이트로 보여줘 산업재를 플래그십 제품처럼 격상시켰다. 넷째, Contents Hub는 이미지 카드로, Company News와 Announcements는 텍스트 리스트로 나눠 정보 밀도를 단계적으로 조절했다. 다섯째, 푸터를 가득 채운 초대형 NANOH2O 워드마크가 새 이름을 마지막 장면에 각인시킨다.
IA·SEO 전략
리브랜딩 사이트의 IA·SEO는 일반적인 웹사이트 제작과 과제가 다르다. 검색 엔진에는 아직 LG Water Solutions라는 이전 이름의 자산이 남아 있으니, 구 브랜드 키워드로 유입되는 수요를 301 리디렉션과 브랜드 전환 안내 페이지로 손실 없이 넘겨야 한다. 헤더의 언어 아이콘이 시사하듯 글로벌 대상 사이트라면 hreflang 정합성도 필수다. Malta에 10년 넘게 고품질 담수를 공급한 사례, Mostaganem 플랜트의 8년 여정 같은 Contents Hub 글들은 그 자체로 훌륭한 SEO 자산이다. 지역명·공정명 키워드를 title과 구조화 데이터에 반영해 검색 랜딩으로 키울 만하다. 다만 Company News와 Announcements에 같은 제목이 반복 노출되는 초기 상태는 콘텐츠가 쌓이면 해소되겠지만, 중복 크롤링이 생기지 않도록 정리해 두는 편이 좋다.
성능·접근성
풀스크린 수면 비주얼과 스크롤 연동 애니메이션은 이 사이트의 매력이자 성능 부담이다. 히어로는 포스터 이미지를 프리로드해 LCP를 먼저 확보한 뒤 모션을 얹는 순서가 안전하다. 물방울 애니메이션은 transform과 opacity 기반으로 유지하고, prefers-reduced-motion 사용자를 위한 정적 대체 화면을 준비해야 한다. 하단 카드 이미지들은 lazy loading과 명시적 width/height로 CLS를 막는다. 접근성 면에서는 밝은 배경 위 오렌지 텍스트의 명도 대비, 히어로·제품 캐러셀 화살표의 키보드 포커스, 뉴스레터 입력창의 레이블 연결이 우선 점검 대상이다.
디지털 파트너 더블루캔버스
NanoH2O처럼 기술이 곧 브랜드인 기업일수록 홈페이지 제작은 제품 카탈로그가 아니라 스토리 설계에서 시작해야 한다. The Blue Canvas는 제조·B2B 기업의 웹사이트 제작에서 기획과 웹디자인, 개발, SEO, 퍼포먼스 마케팅을 하나의 흐름으로 묶는다. 리브랜딩 시점의 검색 자산 이관, 케이스 스터디 중심의 콘텐츠 허브 구축, 글로벌 다국어 사이트 운영까지, 이 리뷰에서 다룬 과제들이 곧 우리가 매일 다루는 일이다. 브랜드의 다음 장을 준비하고 있다면 함께 그려보자.
마무리와 다음 스텝
NanoH2O 사이트는 복귀 선언이라는 하나의 메시지를 컬러, 모티프, 타이포그래피로 끝까지 밀어붙인 UX/UI의 좋은 예다. 남은 과제는 셋으로 정리된다. 첫째, 구 브랜드 검색 수요를 새 도메인으로 잇는 리디렉션·브랜드 SEO 체계. 둘째, Malta·Mostaganem 같은 실증 사례를 검색 랜딩으로 키우는 콘텐츠 허브 확장. 셋째, 대형 비주얼과 스크롤 모션에 성능·접근성 가드레일을 세우는 일. 인상적인 첫인상을 오래가는 신뢰로 바꾸는 힘은 결국 이 기본기에서 나온다.