Google では、すべてのユーザーにとって、美しく、アクセスしやすく、高速で、安全なウェブサイトを構築できるよう、クロスブラウザ対応のウェブサイトを作成したいと考えています。このサイトには、Chrome チームのメンバーや外部の専門家が作成した、移行を支援するコンテンツが揃っています。
web.dev について
オンデマンド セッションと学習コンテンツをチェックして、作業の効率化、迅速なリリース、インスピレーションの源として Google と Chrome が行っていることをご確認ください。
今すぐ見る
サイトの Interaction to Next Paint（INP）のパフォーマンスの測定と最適化を始めましょう。3 月 12 日に Core Web Vitals 指標として正式に採用されました。
詳細

改良点

Google I/O 2023 で、Google はベースラインを発表しました。このイニシアチブの詳細と、このイニシアチブが重要である理由をご確認ください。
ベースラインの詳細
2024 年 4 月に安定版およびベータ版のウェブブラウザでリリースされた興味深い機能をいくつかご紹介します。
最新機種を見る
Google のデベロッパー アドボケイトである Una Kravets と Adam Argyle は、CSS の複雑な側面を、このポッドキャストのわかりやすいエピソードに喜んで語っています。
今すぐ聴く

CSS と UI のデザイン

仕事に役立つ最新のヒントや手法を今すぐ学びましょう。
ユーザーの好みに合わせてフォントを調整して、ユーザーがコンテンツをできるだけ読みやすくします。
すべての主要なエンジンで、新しい CSS の色空間と関数がサポートされるようになりました。デザインに彩りを与える方法をご覧ください。
ソースマップによりウェブ デバッグ エクスペリエンスを向上させます。
Subgrid は、3 つの主要なエンジンすべてで相互運用できるようになりました。使用方法を確認しましょう。

Core Web Vitals

Core Web Vitals などの指標を把握することで、より高速なウェブサイトやアプリを作成できます。
Core Web Vitals の詳細
3 月 12 日より、Interaction to Next Paint が Core Web Vitals として正式に採用され、First Input Delay に代わるものとなります。
Interaction to Next Paint 指標を最適化する方法について説明します。
2023 年のウェブの状況に基づいて、ウェブサイトの Core Web Vitals のパフォーマンスを最適化するためのベスト プラクティスのコレクションです。
Web Vitals 拡張機能で、ウェブに関する主な指標の問題の根本原因を特定できるように、詳細なデバッグ情報が表示されるようになりました。

プログレッシブ ウェブアプリ

優れたウェブ エクスペリエンスを構築します。
PWA の詳細
最新のプログレッシブ ウェブアプリ開発のあらゆる側面を網羅するコースです。
変換ストリームが Safari、Firefox、Chrome でサポートされ、ついにゴールデン タイムに突入する準備が整いました。
クリップボード パターン、ファイル パターン、高度なアプリパターンなど、優れたアプリのための新しいパターンの豊富なコレクションをご確認ください。
Chrome デベロッパー サイトで、Capabilities API をご覧ください。

誰でもアクセス可能

障がいのある方（恒久的、一時的、状況的など）がサイトをアクセスしやすくする方法をご確認ください。
ユーザー補助の詳細
新しいコースは、ユーザー補助に関するトピックの入り口とリファレンスとして最適です。
デザインのアクセシビリティの高い色のコントラストをテストおよび検証するための 3 つのツールと手法の概要。
このチュートリアルでは、ウェブサイトのアクセス可能なメイン ナビゲーションを作成する方法について説明します。セマンティック HTML、ユーザー補助、ARIA 属性の使用がメリットよりデメリットとなる場合がある仕組みについて学習します。
デジタル アクセシビリティを専門とするソフトウェア エンジニアである Melanie のインタビューをご覧ください。

お支払いと ID

支払いに関する最新の手法とベスト プラクティスを確認し、ユーザーがサイトやアプリに安全にログインできるようにしましょう。
アイデンティティに関するその他の情報
パスキーにより、ユーザー アカウントの安全性、シンプルさ、使いやすさが向上します。
既存のパスワード ユーザーにも対応しながら、パスキーを使用するログイン エクスペリエンスを構築します。
ウェブ決済とその仕組みの詳細をご覧ください。
ユーザーが住所や支払いフォームをすばやく簡単に入力できるようにすることで、コンバージョン数を最大化できます。

デベロッパー向けニュースレター

最新のニュース、テクニック、情報をメールでお届けします。