Pilih dari keterampilan Panduan Web Modern yang tercantum agar sesuai dengan tahap Anda saat ini dalam siklus proses pengembangan web, mulai dari gaya awal hingga penerapan keamanan akhir.
Disiplin web inti
Pengatur untuk membantu mengasah dan memfokuskan pekerjaan Anda berdasarkan disiplin web.
accessibility
/modern-web-guidance accessibility
Berfungsi sebagai panduan audit terpusat untuk menilai, memperbaiki, dan menerapkan pola aksesibilitas yang efektif di seluruh aplikasi Anda.
Lihat keterampilan accessibility di GitHub
performance
/modern-web-guidance performance
Membantu Anda mengoptimalkan Core Web Vitals, mengurangi latensi waktu pemuatan halaman, dan meningkatkan responsivitas terhadap input pengguna.
Lihat keterampilan 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 keterampilan user-experience di GitHub
Teknologi web
Keterampilan inti ini menyediakan blok penyusun penting untuk aplikasi modern apa pun, sehingga memastikan proyek Anda dimulai dengan praktik terbaik modern dengan 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.
Lihat keterampilan html di GitHub
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.
Lihat keterampilan css di GitHub
css-layout
/modern-web-guidance css-layout
Tata letak CSS modern seperti flexbox, petak, subpetak, kueri penampung, penentuan posisi anchor, dan ukuran intrinsik. Gunakan keterampilan ini saat membuat arsitektur komponen UI atau tata letak halaman yang responsif.
Lihat keterampilan css-layout di GitHub
forms
/modern-web-guidance forms
Praktik terbaik untuk membuat formulir web yang mudah diakses, aman, dan mudah digunakan. Gunakan panduan ini saat membuat atau mengubah formulir, input, dan alur pengiriman.
Lihat keterampilan forms di GitHub
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 memindahkan kode C++, membuat library C++ dengan Emscripten, atau menyiapkan komponen C++ berperforma tinggi di browser.
Lihat keterampilan 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 sesuai dengan Manifes V3 yang menghindari potensi masalah umum siklus proses pekerja layanan dan sandbox. Untuk ikut serta, Anda harus menentukan keterampilan chrome-extensions:
npx skills add GoogleChrome/modern-web-guidance --skill chrome-extensions
Lihat keterampilan 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 memindahkan library C/C++ ke modul WebAssembly.
security
/modern-web-guidance security
Panduan keamanan preventif untuk developer web (XSS, CSP, Cookie, Isolasi Lintas Origin). Gunakan keterampilan ini untuk memandu proses audit, pengujian, dan penerapan kebijakan keamanan dengan aman.
Lihat keterampilan security di GitHub
passkeys
/modern-web-guidance passkeys
Orientasi komprehensif dan prinsip lintas fungsi untuk menerapkan WebAuthn dan Kunci Sandi di aplikasi web. Gunakan panduan ini saat menangani pendaftaran, autentikasi, pengelolaan, atau autentikasi ulang kunci sandi.
Lihat keterampilan passkeys di GitHub
privacy
/modern-web-guidance privacy
Panduan berorientasi tindakan untuk developer web dalam 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.
Lihat keterampilan privacy di GitHub
Sistem agentic
Keterampilan ini membantu menjembatani kesenjangan antara aplikasi web dan alur kerja AI 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
Terapkan WebMCP untuk mengekspos fungsi browser sisi klien sebagai alat interaktif untuk agen AI.
Lihat keterampilan webmcp di GitHub
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.