ההנחיות בנושא אתרים מודרניים הן קבוצה של מיומנויות שמשלבות מומחיות בפלטפורמת האינטרנט, שיטות מומלצות ונתוני תאימות לדפדפן ישירות בסוכני הקידוד שלכם.

התקנה באמצעות modern-web-guidance CLI (מומלץ):

npx modern-web-guidance@latest install
מתחילים הצגה ב-GitHub

פועל עם סוכן התכנות המועדף שלכם שמבוסס על AI

אפשר להשתמש ב-Modern Web Guidance עם סוכני התכנות המועדפים שלכם מבוססי-AI, כדי לקבל גישה להנחיות לגבי שיטות מומלצות באינטרנט המודרני בתהליך העבודה המועדף עליכם.
הצגת כל אפשרויות ההתקנה

כדי להתקין את Modern Web Guidance בפרויקט באמצעות Agent Skills של Vercel:

npx skills add GoogleChrome/modern-web-guidance

מתקינים את היכולות של Modern Web Guidance ב-Claude Code:

# 1. Add the marketplace:
/plugin marketplace add GoogleChrome/modern-web-guidance
# 2. Install the plugin
/plugin install modern-web-guidance@googlechrome
# 3. Reload plugins
/reload-plugins

כדי להתקין את היכולות של Modern Web Guidance עבור Copilot CLI:

# 1. Add the marketplace:
/plugin marketplace add GoogleChrome/modern-web-guidance
# 2. Install the plugin
/plugin install modern-web-guidance@googlechrome

מתקינים את היכולות של Modern Web Guidance עבור Antigravity CLI:

agy plugin install https://github.com/GoogleChrome/modern-web-guidance
כדי לקבל מידע נוסף על המיומנויות האלה ועל האופן שבו הן משפרות את תהליך העבודה של פיתוח אתרים בעזרת AI, כדאי לצפות בסשן בנושא 'Modern Web Guidance' בכנס Google I/O.
לצפייה

הנחיות לשיפור חוויית המשתמש

כדי ליצור תכונות חדשות, לחדש קוד מדור קודם ולשפר את מהירות האפליקציה, כדאי לנסות כמה מההנחיות לדוגמה הבאות כדי להפעיל את התכונה Modern Web Guidance בתהליך העבודה שלכם בתכנות בעזרת AI. 
Create an accordion-style stats component that smoothly animates on open and close.
 
Build a tab bar with a sliding highlight that tracks active items using CSS Anchor Positioning.
 
Design a dashboard card that uses container queries to adapt its layout to its own width.
 
Update legacy modal window implementations to use the <dialog> element and animate them using modern CSS features.
 
Migrate legacy tooltips to use the Popover API and CSS Anchor Positioning.
 
Implement a passkey-based login flow using the latest WebAuthn features.
 
Implement a starter Content Security Policy (CSP) without breaking my app.
 
Perform a security audit of my site and suggest improvements.
 
Set up my app to begin preloading pages when users hover over important links.
 
My app has lots of long tasks, and its INP is affected. Help me fix it.
 
Help me improve my app's LCP.
כדי לשפר את תהליך העבודה של פיתוח אתרים, אפשר לשלב בין כלי הפיתוח ל-Chrome לסוכני AI לבין מיומנויות של הדרכה בנושא אתרים מודרניים. אתם יכולים להריץ ביקורות ביצועים בזמן אמת, לבדוק עצי נגישות ולתעד יומני מסוף, ואז להחיל באופן אוטומטי תיקונים מדויקים של קוד אינטרנט מודרני.
מידע נוסף

רוצה ללמוד להוסיף תוכן?

יש לכם רעיונות לשיפור ההנחיות בנושא אתרים מודרניים? רוצים לדעת איך אפשר להוסיף תוכן?
מידע נוסף