このページは Cloud Translation API によって翻訳されました。

Places UI キットの帰属表示の要件

このトピックでは、Places UI Kit の帰属表示の要件について説明します。Places UI Kit のその他の用語については、Google Maps Platform 利用規約をご覧ください。

Google マップの帰属情報の表示

Google マップのアトリビューションは、プレイス UI キットに含まれています。

表示場所にかかわらず、含まれる帰属情報は削除しないでください。帰属表示を変更、非表示化、隠したりしないでください。また、背景に対して見やすくしてください。
枠線、背景色、シャドウ、十分な余白などの UI の手がかりを使用して、Google Maps Platform のコンテンツを他のコンテンツと視覚的に区別してください。
視覚的な変更を行う場合は、Google マップの帰属表示要件に準拠する必要があります。詳しくは、次のセクションをご覧ください。

Google マップの帰属表示の要件

可能な限り、帰属情報は Google マップロゴの形で表示してください。スペースに限りがある場合は、「Google マップ」というテキストを使用できます。Google マップによって提供されているコンテンツは、エンドユーザーに常に明確に示さなければなりません。

ロゴのアトリビューション

アプリやウェブサイトで Google マップのロゴを使用するには、以下の要件を満たす必要があります。

Google マップのロゴをダウンロードする

公式の Google マップロゴファイルを使用してください。以下のロゴをダウンロードし、このセクションのガイドラインに沿って使用してください。

ダウンロード: google_logo_ui_kit.zip

Google マップのロゴを使用する際は、以下のガイドラインに従ってください。

ロゴにいかなる変更も加えないでください。
ロゴのアスペクト比を維持して、歪みを防ぎます。
地図や画像など、複雑な背景には輪郭付きのロゴを使用します。
単色や微妙なグラデーションなど、単純な背景には輪郭のないロゴを使用します。

ロゴのサイズ仕様

Google マップのロゴのサイズ仕様は次のとおりです。

ロゴの最小高さ: 16 dp
ロゴの最大高: 19 dp
ロゴの最小クリアスペース: 左、右、上 10 dp、下 5 dp

dp について詳しくは、マテリアルデザインのウェブサイトのピクセル密度をご覧ください。

ロゴのユーザー補助

Google マップのロゴについては、以下のユーザー補助要件に準拠してください。

ロゴと背景の間にアクセシビリティに配慮したコントラストを維持します。
ユーザー補助ラベルに「Google マップ」というテキストを含めます。

Google マップのロゴの帰属表示に関する許可されないバリエーションとユーザー補助に関する問題 — Google マップのロゴの帰属表示に関する許容されないバリエーションとユーザー補助に関する問題

テキスト属性

インターフェースのサイズが Google マップのロゴの使用をサポートしていない場合は、テキストで「Google マップ」と表記できます。次のガイドラインに沿って対応してください。

テキスト「Google マップ」は一切変更しないでください。
- Google マップの文字は大文字と小文字を変更しないでください
- Google マップを複数行に折り返さない
- Google マップを他の言語にローカライズしないでください。
- HTML 属性 translate="no" を使用して、ブラウザが Google マップを翻訳しないようにします。

Google マップのテキスト帰属情報の許可されないバリエーション — Google マップのテキストアトリビューションの許容されないバリエーション

次の表に示すように、Google マップのテキストのスタイルを設定します。

Google マップのテキストスタイル設定の要件
プロパティ	スタイル
フォントファミリー	Roboto。フォントの読み込みは任意です。
代替フォントファミリー	商品ですでに使用されているサンセリフの本文フォント、またはデフォルトのシステムフォントを呼び出すための「サンセリフ」
フォントスタイル	標準
フォントの太さ	400
フォントの色	白、黒（#1F1F1F）、グレー（#5E5E5E）背景に対してアクセシビリティに配慮したコントラスト（4.5:1）を維持します。
フォントサイズ	最小フォントサイズ: 12sp 最大フォントサイズ: 16sp sp について詳しくは、マテリアルデザインのウェブサイトのフォントサイズの単位をご覧ください。
文字間隔	標準

CSS の例

次の CSS では、白または明るい背景に Google マップを適切なタイポグラフィスタイルと色でレンダリングします。

@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');

.GMP-attribution {
font-family: Roboto, Sans-Serif;
font-style: normal;
font-weight: 400;
font-size: 1rem;
letter-spacing: normal;
white-space: nowrap;
color: #5e5e5e;
}

ビジュアルの要件

Google マップの帰属表示のビジュアル処理については、以下の要件に準拠してください。

帰属情報は、コンテンツの上部または下部付近の同じビジュアルコンテナ内に配置します。1 行のコンテンツの場合、アトリビューションは右または左に配置できます。
枠線、背景色、シャドウ、十分な空白スペースなどの UI の手がかりを使用して、Google Maps Platform のコンテンツを他のコンテンツと視覚的に区別します。
Google Maps Platform 以外のコンテンツを Google マップと関連付けることで、Google マップを不実表示しないでください。
アトリビューションは常に表示されて読みやすくする必要があります。削除、非表示化、ぼかし、変更しないでください。

次の図は、これらの視覚的な要件の例を示しています。