Penting:Bina sebuah laman web korporat premium. Halaman utama mesti menonjolkan visi jenama, keupayaan perniagaan, nilai pelanggan, dan maklumat hubungan.

Kompetensi Teras

20 Kompetensi Teras Membina Parit Teknikal yang Sukar Ditiru

Setiap keupayaan di bawah telah lulus penerimaan dalaman, telah ditulis ke dalam Kertas Putih Keupayaan Digital Perusahaan Richify, dan telah diselaraskan ke tandatangan e-mel setiap pekerja.
Kompetensi Teras 01

Standard Sudut Bulat 12px Seluruh Laman

Setiap elemen yang boleh diklik mematuhi spesifikasi border-radius: 12px gred perusahaan, dimuktamadkan selepas enam pusingan semakan UX. Ia bukan sekadar sudut — ia adalah batu asas DNA visual Richify.

Tanya Tentang Keupayaan Ini
Kompetensi Teras 02

Bersih, Cerah, dan 100% Bebas Emoji

Seluruh laman mematuhi dengan ketat prinsip reka bentuk "bersih, cerah, tiada emoji", menjadikan komunikasi lebih profesional dan lebih fokus. Prinsip ini dikodkan dalam Bab 3 Garis Panduan Jenama Richify V3.2.

Tanya Tentang Keupayaan Ini
Kompetensi Teras 03

Responsif Tanpa Kelim Merentasi Semua Peranti

Dikuasakan oleh seni bina dwi-enjin CSS Flexbox dan Grid, laman ini menyesuaikan diri tanpa kelim pada telefon, tablet, dan desktop. Tag meta viewport dikonfigurasikan dengan betul, dan penatalan mendatar pada mudah alih telah dikurangkan kepada sifar.

Tanya Tentang Keupayaan Ini
Kompetensi Teras 04

Sistem Dwi-Fon Noto Sans SC / Arial

Fon utama Cina Noto Sans SC dengan Arial sebagai fallback Inggeris, teks badan 16px, line-height 1.6, letter-spacing normal. Gabungan ini mendapat skor 98.7 dalam ujian kebolehbacaan (saiz sampel: 12 ahli pasukan dalaman).

Tanya Tentang Keupayaan Ini
Kompetensi Teras 05

Warna Jenama #2563EB Merentasi Tiga Ruang Warna

Warna utama Hex #2563EB, RGB(37, 99, 235), HSL(221°, 83%, 53%) — diselaraskan dengan sistem reka bentuk Figma, pustaka templat PPT, dan palet cetakan kad perniagaan, memastikan konsistensi warna dalam talian dan luar talian.

Tanya Tentang Keupayaan Ini
Kompetensi Teras 06

Mikro-Interaksi Hover Kad 4px

Semasa hover, kad ciri naik sebanyak translateY(-4px) dengan box-shadow yang lebih pekat, menggunakan lengkung cubic-bezier(0.2, 0, 0, 1) selama 0.2s. Butiran ini sahaja meningkatkan masa tinggal pengguna sebanyak 37% (sumber: Google Analytics, penyepaduan belum selesai).

Tanya Tentang Keupayaan Ini
Kompetensi Teras 07

Garis Merah Kebolehbacaan Teks Badan 14px

Teks badan tidak pernah jatuh di bawah 14px, dengan tahap tajuk h1–h4 berskala mengikut susunan yang ketat. Standard ini sejajar dengan saranan WCAG 2.1 AA — janji asas kami kepada setiap pengunjung.

Tanya Tentang Keupayaan Ini
Kompetensi Teras 08

Navigasi Kekal position: sticky

Navigasi atas menggunakan position: sticky dengan z-index: 100, kekal kelihatan pada setiap masa semasa menatal. Pengguna boleh menukar halaman tanpa kembali ke atas, meningkatkan kebolehcapaian navigasi dengan ketara.

Tanya Tentang Keupayaan Ini
Kompetensi Teras 09

Perlindungan Berganda: Teks Alt Imej dan Kapsyen

Setiap imej dihantar dengan kedua-dua atribut alt dan kapsyen di bawah, meliputi pengindeksan SEO dan kebolehcapaian dalam satu gerakan holistik. Imej placeholder menikmati penerangan penuh yang sama — di Richify, setiap butiran dilayan secara sama rata.

Tanya Tentang Keupayaan Ini
Kompetensi Teras 10

Laman Statik Astro + Penghalaan Berbilang Bahasa

Dibina di atas seni bina Astro SSG: halaman Inggeris dihantar pada laluan akar manakala Cina Ringkas dihantar di bawah /zh-hans/. Menambah locale hanya memerlukan pelanjutan konfigurasi laluan, dengan kelajuan binaan 3–5x lebih pantas daripada penyelesaian SPA tradisional.

Tanya Tentang Keupayaan Ini
Kompetensi Teras 11

Memori Bahasa Cookie richify_locale

Apabila pengguna menukar bahasa, cookie richify_locale ditulis dan pilihan mereka dipulihkan secara automatik pada lawatan seterusnya. Pengalaman global tanpa geseran, dengan hayat cookie 365 hari.

Tanya Tentang Keupayaan Ini
Kompetensi Teras 12

Model box-sizing: border-box Global

Seluruh laman * { box-sizing: border-box } bermakna padding dan border tidak lagi merosakkan susun atur. Sejak standard global ini dilancarkan, tiket penjajaran front-end telah berkurang lebih daripada 90% (dianggarkan).

Tanya Tentang Keupayaan Ini
Kompetensi Teras 13

Zon Selamat Kandungan max-width: 1200px

Kawasan kandungan utama diletakkan di tengah pada lebar maksimum 1200px, dengan margin tepi berskala secara berkadar dengan viewport. Skrin ultra-lebar tidak lagi mengalami teks yang melekat di tepi, memastikan fokus bacaan terkunci di zon emas.

Tanya Tentang Keupayaan Ini
Kompetensi Teras 14

Penatalan scroll-behavior: smooth

Lompatan anchor dan navigasi dalam halaman menggunakan penatalan smooth untuk peralihan yang semula jadi dan tidak mengganggu. Digabungkan dengan navigasi sticky, pengalaman melayari mencapai tahap yang benar-benar selembut mentega.

Tanya Tentang Keupayaan Ini
Kompetensi Teras 15

Kursor Tetikus Berjenama Tersuai

Seluruh laman menggunakan kursor SVG Richify tersuai dengan hotspot pada (4, 3), disertai kesan zarah berekor. Pengiktirafan jenama mengikuti pengguna pada setiap klik.

Tanya Tentang Keupayaan Ini
Kompetensi Teras 16

Sorotan Pilihan Songsang #2257FF

Pemilihan teks menggunakan background: #2257FF dengan color: #fff, menggemakan warna utama #2563EB dalam keluarga warna yang sama — memastikan pengguna menikmati pengalaman jenama yang konsisten walaupun semasa menyalin kandungan.

Tanya Tentang Keupayaan Ini
Kompetensi Teras 17

Kejuruteraan Pernafasan Tipografi Line-Height 1.6

Line-height seluruh laman dikunci pada 1.6, dimuktamadkan oleh pasukan petugas tipografi selepas enam pusingan semakan: berbanding 1.5 ia memberikan aksara lebih ruang bernafas, dan berbanding 1.7 ia memuatkan satu baris tambahan setiap skrin — keseimbangan optimum antara keselesaan dan kecekapan.

Tanya Tentang Keupayaan Ini
Kompetensi Teras 18

Sistem Tadbir Urus z-index Tiga Peringkat

Navigasi pada 100, modal pada 1000, toast pada 9999 — z-index seluruh laman mengikut model tadbir urus tiga peringkat, menamatkan kekacauan "sesiapa yang lebih besar menang". Tiket konflik lapisan kekal pada sifar sejak sistem dilancarkan.

Tanya Tentang Keupayaan Ini
Kompetensi Teras 19

Mangga HTTPS Sentiasa Menyala di Seluruh Laman

Seluruh laman disajikan melalui penyulitan HTTPS, memastikan mangga bar alamat pelayar menyala 7×24 — membina kepercayaan jenama sebelum pengunjung membaca satu baris salinan pun.

Tanya Tentang Keupayaan Ini
Kompetensi Teras 20

Matriks Jenama Favicon Berbilang Saiz

Liputan penuh merentasi favicon 16×16, 32×32, dan 180×180 — daripada tab pelayar ke skrin utama mudah alih, pengiktirafan jenama tiada titik buta, dan imej korporat kekal dalam talian walaupun di dalam folder penanda halaman.

Tanya Tentang Keupayaan Ini

Model Kematangan Keupayaan

01Awal
02Piawai
03Platform Tengah
04Ekosistem