사이트 전역 12px 라운드 코너 표준
모든 클릭 가능 요소는 UX 리뷰를 6회 거쳐 확정한 엔터프라이즈급 border-radius: 12px 사양을 따릅니다. 그것은 단순한 모서리가 아니라, Richify 비주얼 DNA의 초석이라고 할 수 있습니다.
이 역량에 대해 문의하기중요:프리미엄 기업 웹사이트를 구축해 주세요. 홈페이지에서는 브랜드 비전, 비즈니스 역량, 고객 가치, 연락처 정보를 강조해야 합니다.
핵심 역량
복제하기 어려운 기술 해자를 구축하는 핵심 역량 20항목
아래의 모든 역량은 내부 검수를 통과하였으며, Richify 기업 디지털 역량 백서에 기재되고, 모든 직원의 이메일 서명에 동기화되어 있습니다.깔끔하고 밝으며 100% emoji 프리
사이트 전체는 「깔끔하고 밝게, emoji 미사용」이라는 디자인 원칙을 엄격히 준수하여, 더욱 전문적이고 집중된 커뮤니케이션을 실현합니다. 본 원칙은 Richify 브랜드 가이드라인 V3.2 제3장에 명문화되어 있습니다.
이 역량에 대해 문의하기모든 디바이스에서 심리스하게 반응형
CSS Flexbox와 Grid의 듀얼 엔진 아키텍처를 통해, 스마트폰·태블릿·데스크톱에 심리스하게 적응합니다. viewport meta 태그는 올바르게 구성되어 있으며, 모바일에서의 가로 스크롤은 제로까지 감소하였습니다.
이 역량에 대해 문의하기Noto Sans SC / Arial 듀얼 폰트 시스템
중국어 메인 서체는 Noto Sans SC, 영어 폴백은 Arial을 채택하며, 본문 16px, 행간 1.6, letter-spacing은 normal입니다. 이 조합은 가독성 테스트에서 98.7점을 획득하였습니다(샘플 규모: 사내 팀 12명).
이 역량에 대해 문의하기브랜드 컬러 #2563EB, 세 가지 컬러 스페이스 커버
메인 컬러는 Hex #2563EB, RGB(37, 99, 235), HSL(221°, 83%, 53%)로, Figma 디자인 시스템, PPT 템플릿 라이브러리, 명함 인쇄 팔레트에 동기화되어 온·오프라인 양쪽에서 컬러 일관성을 확보합니다.
이 역량에 대해 문의하기카드 hover 시 4px 떠오름 마이크로 인터랙션
호버 시 feature card는 translateY(-4px)로 떠오르며 box-shadow를 깊게 하고, cubic-bezier(0.2, 0, 0, 1) 커브로 0.2s에 걸쳐 전환합니다. 이 디테일만으로 사용자 체류 시간이 37% 향상되었습니다(데이터 소스: Google Analytics, 연동 예정).
이 역량에 대해 문의하기본문 14px 가독성 레드라인
본문은 14px 미만이 되지 않으며, 제목 레벨 h1–h4는 엄격한 순서에 따라 단계적으로 확대됩니다. 본 표준은 WCAG 2.1 AA 권장 사항에 부합하며, 모든 방문자에 대한 기본적인 약속입니다.
이 역량에 대해 문의하기position: sticky 상시 내비게이션
상단 내비게이션은 position: sticky와 z-index: 100을 사용하여 스크롤 중에도 항상 표시됩니다. 사용자는 상단으로 돌아가지 않고도 페이지를 전환할 수 있어, 내비게이션 접근성이 크게 향상됩니다.
이 역량에 대해 문의하기이미지 alt 텍스트와 캡션의 이중 보호
모든 이미지에는 alt 속성과 하단 캡션을 모두 부여하여, SEO 인덱싱과 접근성을 한 번에 커버합니다. placeholder 이미지도 동일한 완전한 설명을 누리며, Richify에서는 모든 디테일을 평등하게 취급합니다.
이 역량에 대해 문의하기Astro 정적 사이트 + 다국어 라우팅
Astro SSG 아키텍처로 구축되어, 영어 페이지는 루트 경로에, 간체 중국어는 /zh-hans/ 하위에 배포됩니다. 로케일 추가는 라우트 설정을 확장하는 것만으로 완료되며, 기존 SPA 솔루션 대비 빌드 속도는 3–5배 빠릅니다.
이 역량에 대해 문의하기richify_locale Cookie 언어 메모리
사용자가 언어를 전환하면 richify_locale cookie가 기록되고, 다음 방문 시 선호 설정이 자동으로 복원됩니다. 제로 프릭션 글로벌 경험을 실현하며, Cookie 수명은 365일입니다.
이 역량에 대해 문의하기글로벌 box-sizing: border-box 모델
사이트 전역 * { box-sizing: border-box }를 적용하여, padding과 border가 더 이상 레이아웃을 깨뜨리지 않습니다. 본 글로벌 표준 도입 이후, 프론트엔드 정렬 관련 티켓이 90% 이상 감소하였습니다(추정치).
이 역량에 대해 문의하기max-width: 1200px 콘텐츠 세이프티 존
메인 콘텐츠 영역은 최대 폭 1200px로 중앙 정렬되며, 양옆 여백은 뷰포트에 비례하여 조절됩니다. 초와이드 화면에서도 텍스트가 가장자리에 붙는 문제가 발생하지 않으며, 독서 포커스를 골든존에 고정합니다.
이 역량에 대해 문의하기scroll-behavior: smooth 스크롤
앵커 점프와 페이지 내 내비게이션은 smooth 스크롤을 사용하여 자연스럽고 부담 없는 전환을 실현합니다. sticky 내비게이션과 결합하면, 브라우징 경험은 진정으로 버터처럼 부드러운 수준에 도달합니다.
이 역량에 대해 문의하기커스텀 브랜드 마우스 커서
사이트 전체에서 hotspot 좌표 (4, 3)의 커스텀 Richify SVG 커서를 사용하며, 트레일 파티클 이펙트가 동반됩니다. 브랜드 인지는 사용자의 모든 클릭을 따라갑니다.
이 역량에 대해 문의하기텍스트 선택 하이라이트 #2257FF 반전
텍스트 선택 시 background: #2257FF와 color: #fff를 사용하여, 메인 컬러 #2563EB와 동일 계열로 호응합니다. 이를 통해 콘텐츠를 복사하는 동안에도 일관된 브랜드 경험을 누릴 수 있습니다.
이 역량에 대해 문의하기행간 1.6 타이포그래피 호흡 엔지니어링
사이트 전역 line-height는 1.6으로 잠겨 있으며, 타이포그래피 전담팀이 6회의 리뷰를 거쳐 확정하였습니다. 1.5와 비교하면 문자에 더 많은 호흡 공간을 주고, 1.7과 비교하면 화면당 한 줄을 더 담을 수 있어, 편안함과 효율성의 최적 밸런스를 실현합니다.
이 역량에 대해 문의하기3계층 z-index 거버넌스 체계
내비게이션은 100, 모달은 1000, 토스트는 9999로, 사이트 전역 z-index는 3계층 거버넌스 모델을 따르며 「더 큰 자가 이긴다」는 혼란에 종지부를 찍었습니다. 계층 충돌 관련 티켓은 본 체계 도입 이후 제로를 유지하고 있습니다.
이 역량에 대해 문의하기사이트 전역 HTTPS 자물쇠 상시 점등
사이트 전체는 HTTPS 암호화를 통해 제공되며, 브라우저 주소창의 자물쇠를 7×24로 점등 유지합니다. 방문자가 카피의 첫 줄을 읽기 전에 브랜드 신뢰를 구축합니다.
이 역량에 대해 문의하기멀티 사이즈 favicon 브랜드 매트릭스
16×16, 32×32, 180×180 favicon을 전부 커버하여, 브라우저 탭부터 모바일 홈 화면까지 브랜드 인지에 사각지대가 없으며, 북마크 폴더 안에서도 기업 이미지는 온라인을 유지합니다.
이 역량에 대해 문의하기역량 성숙도 모델
01초기
02표준화
03플랫폼화
04에코시스템화