Выберите из списка навыков по современным веб-технологиям тот, который соответствует вашему текущему этапу в цикле веб-разработки, от первоначального оформления до окончательной реализации мер безопасности.
Основные веб-дисциплины
Оркестраторы помогут вам сфокусировать и оптимизировать вашу работу в соответствии с конкретными веб-дисциплинами.
accessibility
/modern-web-guidance accessibility
Он служит центральным руководством по аудиту, позволяя оценивать, исправлять и внедрять эффективные модели обеспечения доступности во всем приложении.
Посмотреть навык обеспечения accessibility на GitHub
performance
/modern-web-guidance performance
Помогает оптимизировать основные веб-показатели , сократить задержки при загрузке страниц и повысить скорость отклика на пользовательский ввод.
Посмотреть описание навыка повышения performance на GitHub
user-experience
/modern-web-guidance user-experience
Этот набор инструментов для создания пользовательского интерфейса позволяет быстро внедрять адаптивные элементы, плавные переходы и современные стили.
Посмотреть навык user-experience на GitHub
Веб-технологии
Эти базовые навыки являются необходимыми строительными блоками для любого современного приложения, гарантируя, что ваш проект начнется с применения современных передовых методов, учитывающих семантическую структуру HTML, скорость и совместимость.
html
/modern-web-guidance html
Практические рекомендации по современной архитектуре HTML, семантике, нативным интерактивным API (диалоги, всплывающие окна, подробные описания), управлению фокусом и приоритезации ресурсов. Используйте это руководство при структурировании веб-документов, реализации нативных наложений или оптимизации порядка загрузки ресурсов.
Посмотреть навык html на GitHub
css
/modern-web-guidance css
Практические рекомендации по современной архитектуре, макетам и производительности CSS. Используйте это руководство при создании стилей, управлении системами дизайна или оптимизации веб-рендеринга.
Посмотреть навык css на GitHub
css-layout
/modern-web-guidance css-layout
Современные CSS-методы компоновки, такие как flexbox, grid, subgrid, container queries, anchor positioning и intrinsic sizing. Используйте этот навык при проектировании адаптивных компонентов пользовательского интерфейса или макетов страниц.
Посмотреть навык css-layout на GitHub
forms
/modern-web-guidance forms
Рекомендации по созданию доступных, безопасных и удобных веб-форм. Используйте это руководство при создании или изменении форм, полей ввода и процессов отправки.
Посмотреть навык работы forms на GitHub
cpp-on-the-web
/modern-web-guidance cpp-on-the-web
Компиляция C и C++ для современного веба с использованием WebAssembly. Этот навык пригодится, когда потребуется портировать код C++, создавать библиотеки C++ с помощью Emscripten или настраивать высокопроизводительные компоненты C++ в браузере.
Посмотреть навык cpp-on-the-web на GitHub
Возможности браузера (с возможностью выбора)
Эти навыки помогут вам разрабатывать расширения для Chrome, соответствующие современным стандартам, таким как Manifest V3, и упростят публикацию в Chrome Web Store, помогая подготовить метаданные, политику конфиденциальности и обоснование разрешений. Включение этих навыков является необязательным и не включено по умолчанию.
chrome-extensions
/modern-web-guidance chrome-extensions
Создавайте безопасные и соответствующие требованиям расширения Chrome в рамках Manifest V3, избегая распространенных проблем жизненного цикла сервис-воркеров и песочницы. Для включения этой функции необходимо указать навык chrome-extensions :
npx skills add GoogleChrome/modern-web-guidance --skill chrome-extensions
Посмотреть навык chrome-extensions на GitHub
Безопасность, доверие и идентичность
Эти навыки направлены на повышение доверия пользователей за счет защиты приложений от уязвимостей на стороне клиента, таких как XSS, посредством защитных HTTP-заголовков и изоляции источника. Разработчики также могут создавать потоки аутентификации с использованием паролей, минимизировать отслеживание третьими лицами и использовать эти навыки для переноса библиотек C/C++ в модули WebAssembly.
security
/modern-web-guidance security
Рекомендации по превентивной безопасности для веб-разработчиков (XSS, CSP, Cookies, междоменная изоляция). Используйте этот навык для безопасного проведения аудита, тестирования и развертывания политик безопасности.
Посмотреть навык security на GitHub
passkeys
/modern-web-guidance passkeys
Комплексное руководство и сквозные принципы внедрения WebAuthn и Passkeys в веб-приложениях. Используйте это руководство при регистрации, аутентификации, управлении или повторной аутентификации с помощью ключей доступа.
Посмотреть навык passkeys на GitHub
privacy
/modern-web-guidance privacy
Практические рекомендации для веб-разработчиков по внедрению принципов защиты конфиденциальности на этапе проектирования, минимизации данных, проведению аудита сторонними организациями и безопасной обработке данных. Используйте эти навыки при проектировании приложений, интеграции сторонних сервисов, обработке пользовательских данных или настройке заголовков безопасности.
Посмотреть навык обеспечения privacy на GitHub
Агентные системы
Эти навыки помогают преодолеть разрыв между вашим веб-приложением и рабочими процессами ИИ с помощью WebMCP. Предоставляя доступ к функциональности браузера на стороне клиента в качестве интерактивных инструментов, вы можете давать указания агентам ИИ взаимодействовать напрямую с функциями приложения.
webmcp
/modern-web-guidance webmcp
Реализовать WebMCP для предоставления клиентской функциональности браузера в качестве интерактивных инструментов для агентов искусственного интеллекта.
Посмотреть навык webmcp на GitHub
Следующие шаги
Теперь, когда вы разобрались с Modern Web Guidance, попробуйте сами! Ознакомьтесь с функциями и сценариями использования , поддерживаемыми Modern Web Guidance, и попробуйте несколько примеров запросов , чтобы начать работу.