Pilih dari keterampilan Panduan Web Modern yang tercantum agar sesuai dengan tahap Anda saat ini dalam siklus proses pengembangan web, mulai dari penataan gaya awal hingga penerapan keamanan akhir.
Disiplin web inti
Pengelola untuk membantu mempertajam dan memfokuskan pekerjaan Anda berdasarkan disiplin web.
accessibility
/modern-web-guidance accessibility
Berfungsi sebagai panduan audit utama Anda untuk menilai, memperbaiki, dan menerapkan pola aksesibilitas yang efektif di seluruh aplikasi Anda.
Lihat skill accessibility di GitHub
performance
/modern-web-guidance performance
Membantu Anda mengoptimalkan Data Web Inti, mengurangi latensi waktu pemuatan halaman, dan meningkatkan responsivitas terhadap input pengguna.
Lihat skill performance di GitHub
user-experience
/modern-web-guidance user-experience
Berfungsi sebagai toolkit antarmuka pengguna (UI) untuk menerapkan elemen kustom responsif, transisi yang lancar, dan pola gaya modern dengan cepat.
Lihat skill user-experience di GitHub
Teknologi web
Keterampilan inti ini memberikan dasar penting untuk aplikasi modern apa pun, memastikan project Anda dimulai dengan praktik terbaik modern dengan mempertimbangkan HTML semantik, kecepatan, dan interoperabilitas.
html
/modern-web-guidance html
Panduan berorientasi tindakan untuk arsitektur HTML modern, semantik, API interaktif native (Dialog, Popover, Detail), pengelolaan fokus, dan prioritas resource. Gunakan panduan ini saat menyusun dokumen web, menerapkan overlay native, atau mengoptimalkan urutan pemuatan resource.
css
/modern-web-guidance css
Panduan berorientasi tindakan untuk arsitektur, tata letak, dan performa CSS modern. Gunakan panduan ini saat membuat gaya, mengelola sistem desain, atau mengoptimalkan rendering web.
css-layout
/modern-web-guidance css-layout
Tata letak CSS modern seperti flexbox, petak, subpetak, kueri penampung, penentuan posisi anchor, dan penskalaan intrinsik. Gunakan keterampilan ini saat merancang komponen UI atau tata letak halaman yang responsif.
Lihat skill css-layout di GitHub
forms
/modern-web-guidance forms
Praktik terbaik untuk membuat formulir web yang lebih mudah diakses, aman, dan mudah digunakan. Gunakan panduan ini saat membuat atau mengubah formulir, input, dan alur pengiriman.
cpp-on-the-web
/modern-web-guidance cpp-on-the-web
Mengompilasi C dan C++ untuk web modern menggunakan WebAssembly. Gunakan keterampilan ini saat Anda perlu mem-port kode C++, membuat library C++ dengan Emscripten, atau menyiapkan komponen C++ berperforma tinggi di browser.
Lihat skill cpp-on-the-web di GitHub
Kemampuan browser (keikutsertaan)
Keterampilan ini membantu Anda mengembangkan ekstensi Chrome yang mengikuti standar modern seperti Manifes V3 dan menyederhanakan publikasi ke Chrome Web Store dengan bantuan untuk menyiapkan metadata, kebijakan privasi, dan justifikasi izin. Keterampilan ini bersifat keikutsertaan, dan tidak diaktifkan secara default.
chrome-extensions
/modern-web-guidance chrome-extensions
Buat ekstensi Chrome yang aman dan mematuhi persyaratan di bawah Manifes V3 yang menghindari kesalahan umum siklus proses pekerja layanan dan sandbox. Untuk mengaktifkan, Anda harus menentukan kemampuan chrome-extensions:
npx skills add GoogleChrome/modern-web-guidance --skill chrome-extensions
Lihat skill chrome-extensions di GitHub
Keamanan, kepercayaan, dan identitas
Keterampilan ini berfokus pada kepercayaan pengguna dengan mengamankan aplikasi dari eksploitasi sisi klien seperti XSS melalui header HTTP defensif dan isolasi origin. Developer juga dapat mengembangkan alur autentikasi dengan kunci sandi, meminimalkan pelacakan pihak ketiga, dan menggunakan keterampilan untuk mem-porting library C/C++ ke modul WebAssembly.
security
/modern-web-guidance security
Pedoman keamanan preventif untuk developer web (XSS, CSP, Cookie, Isolasi Lintas Asal). Gunakan kemampuan ini untuk memandu proses audit, pengujian, dan men-deploy kebijakan keamanan secara aman.
Lihat skill security di GitHub
passkeys
/modern-web-guidance passkeys
Orientasi komprehensif dan prinsip lintas bidang untuk menerapkan WebAuthn dan Kunci Sandi di aplikasi web. Gunakan panduan ini saat menangani pendaftaran, autentikasi, pengelolaan, atau autentikasi ulang kunci sandi.
Lihat skill passkeys di GitHub
privacy
/modern-web-guidance privacy
Panduan berorientasi tindakan bagi developer web untuk menerapkan privasi berdasarkan desain, minimisasi data, audit pihak ketiga, dan penanganan data yang aman. Gunakan keterampilan ini saat mendesain aplikasi, mengintegrasikan layanan pihak ketiga, menangani data pengguna, atau mengonfigurasi header keamanan.
Sistem agentic
Keahlian ini membantu menjembatani kesenjangan antara aplikasi web dan alur kerja AI Anda dengan WebMCP. Dengan mengekspos fungsi browser sisi klien sebagai alat interaktif, Anda dapat menginstruksikan agen AI untuk berinteraksi langsung dengan fitur aplikasi.
webmcp
/modern-web-guidance webmcp
Menerapkan WebMCP untuk mengekspos fungsi browser sisi klien sebagai alat interaktif untuk agen AI.
Langkah Berikutnya
Setelah memahami Panduan Web Modern, coba sendiri! Temukan fitur dan kasus penggunaan yang didukung dalam Panduan Web Modern, dan coba beberapa perintah contoh untuk memulai.