適切な
画像候補。
基本的な画像メタデータと配信に関する問いを併せて確認する、プライベートなブラウザ内のみの取り込みです。メタデータとローカル寸法を超えてファイルをアップロード、保持、最適化、検査することはありません。
これを使って: 画像の配置、レスポンシブ候補、アクセシブルな代替テキスト、配信に伴うトレードオフについての議論を準備するために使用してください。
確認する 出発点。
ローカル画像を選択して、ブラウザが報告する基本的なメタデータと寸法を表示してください。SIU は選択されたファイルをアップロード、送信、保持、最適化、または保存しません。
ローカル画像を選択 — 画像が選択されていません。アップロードや保存は行われていません。
ここからは 何も出ません。
選択した画像は名前、ブラウザが報告する MIME タイプ、バイトサイズ、最終更新時刻、ローカルで読み取れる寸法を表示します。
プレビューは生成されません。ローカルのメタデータがレビューに有用な場合のみ画像を選択してください。
次の 既知のステップに取り組む。
- ローカル画像を1つ選択します。ブラウザは名前、MIME、バイトサイズ、最終更新タイムスタンプ、および（読み取れる場合）ピクセル寸法をメモリ上でのみ読み取ります。
- 寸法を意図したレンダリング幅とデバイスの密度に照らして関連付け、ページが複数の画像候補やアートディレクションを必要とするかを判断します。
- マークアップの文脈を確認してください：意味のある代替テキスト、適切な場合の宣言された寸法、レスポンシブなソース選択、読み込み優先度はそれぞれ別の判断事項です。
- オリジナルのソース資産はチームが定めた資産管理およびライセンス手続きに従って保持してください。このページは派生ファイルを作成しません。
チームで承認されたブラウザとパフォーマンスツールを使い、想定するブレークポイントでレンダリングされたページを検査してください。
代替テキストと実際のレスポンシブマークアップをコードレビューで確認してください。
改善を主張する前に実環境での配信を計測してください。
ソースノート、 借用された確実性ではありません。
計画の根拠: web.dev の Responsive images ガイダンス と MDN File API ドキュメント
- web.dev — Responsive images ↗web.dev は画像のバイト数が重要になり得ることを説明し、レスポンシブ候補、srcset、sizes、picture の使い分けを示しています。
- MDN — Using files from web applications ↗MDN はユーザーが選択した File オブジェクトと、ローカルで利用可能な name、type、size のメタデータについて文書化しています。
作成者： SIU Enablement 編集草案；ソースに限定された運用ガイダンス。 レビュー者： デザイン、アクセシビリティ、パフォーマンス、権利担当者が配信コンテキストで画像をレビューします。 再検証： 配置、レスポンシブルール、アセットのソース、配信プロバイダが変更されたときに再検証してください。