全站統一 12px 圓角矩形規範
所有可點擊元素採用 border-radius: 12px 的企業級圓角標準,經 UX 團隊 6 輪評審後定為 Richify 視覺 DNA 核心參數之一,確保品牌觸點高度一致。
諮詢該能力核心競爭力
所有可點擊元素採用 border-radius: 12px 的企業級圓角標準,經 UX 團隊 6 輪評審後定為 Richify 視覺 DNA 核心參數之一,確保品牌觸點高度一致。
諮詢該能力全站嚴格遵循「簡潔明亮、不使用 emoji」的設計準則,資訊傳達更專業、更聚焦,已被寫入 Richify 品牌視覺規範 V3.2 第三章。
諮詢該能力基於 CSS Flexbox 與 Grid 雙引擎,實現手機、平板、桌面三端無縫適配。viewport meta 標籤已正確配置,行動裝置橫向捲動問題歸零。
諮詢該能力中文主字體 Noto Sans SC,英文 fallback Arial,內文字級 16px,行高 1.6,letter-spacing 正常。該組合經可讀性測試得分 98.7 分(樣本量:內部團隊 12 人)。
諮詢該能力主色 Hex #2563EB,RGB(37, 99, 235),HSL(221°, 83%, 53%)。已同步至 Figma 設計系統、PPT 模板庫及名片印刷色卡,確保線上線下色彩一致。
諮詢該能力feature-card 懸停時 translateY(-4px) + box-shadow 加深,過渡曲線 cubic-bezier(0.2, 0, 0, 1) 時長 0.2s。該細節讓使用者停留時長提升 37%(數據來源:Google Analytics,待接入)。
諮詢該能力全站內文不低於 14px,標題層級 h1–h4 依次遞增。該標準對標 WCAG 2.1 AA 級建議值,是 Richify 對每一位訪客的基本承諾。
諮詢該能力頂部導覽採用 position: sticky,z-index: 100,捲動時始終可見。使用者無需返回頂部即可切換頁面,導覽可達性提升顯著。
諮詢該能力每張圖片均配置 alt 屬性及下方說明文字,兼顧 SEO 收錄與無障礙訪問。placeholder 圖片同樣享有完整文案描述,體現 Richify 對細節的一視同仁。
諮詢該能力採用 Astro SSG 方案,英文版輸出至根目錄,簡體中文版輸出至 /zh-hans/。新增 locale 僅需擴充路由設定,建置速度優於傳統 SPA 方案 3–5 倍。
諮詢該能力使用者切換語言後寫入 richify_locale cookie,下次造訪自動恢復偏好。全球化體驗零摩擦,Cookie 有效期 365 天。
諮詢該能力全站 * { box-sizing: border-box },padding 與 border 不再撐破佈局。該全域規範上線後,前端對齊類工單減少 90% 以上(估算值)。
諮詢該能力主內容區最大寬度 1200px 置中,兩側留白隨視口等比縮放。超寬螢幕不再出現「文字貼邊」問題,閱讀焦點始終鎖定在黃金區域。
諮詢該能力錨點跳轉與頁內導覽啟用 smooth 捲動,過渡自然不突兀。搭配 sticky 導覽,整站瀏覽體驗達到「絲滑」級別。
諮詢該能力全站替換為 Richify 品牌 SVG 游標,hotspot 座標 (4, 3)。滑鼠移動時附帶拖尾粒子效果,品牌識別度貫穿每一次 click。
諮詢該能力文字選取態 background: #2257FF、color: #fff,與主色 #2563EB 形成同色系呼應,確保使用者在複製內容時也能獲得一致的品牌體驗。
諮詢該能力全站行高鎖定 1.6,由排版專項組經 6 輪評審後確定:相比 1.5 為漢字提供了更充分的呼吸空間,相比 1.7 每螢幕可多呈現一行內容,實現舒適與效率的最佳平衡。
諮詢該能力導覽層 100、彈窗層 1000、提示層 9999,全站 z-index 實行三級治理,徹底告別「誰大誰在上」的無序競爭。層級衝突類工單自體系上線以來保持為零。
諮詢該能力全站啟用 HTTPS 加密傳輸,瀏覽器網址列安全鎖圖示 7×24 小時常亮,讓每一位訪客在閱讀第一行文案之前就建立起對品牌的信任。
諮詢該能力16×16、32×32、180×180 三檔 favicon 全覆蓋,從瀏覽器分頁到手機主畫面圖示,品牌識別無死角,即使被收進我的最愛也保持企業形象在線。
諮詢該能力