Consignes pour l'attribution de texte Lite avec ancrage

Cette page fournit les exigences et les consignes d'attribution pour afficher le contenu Grounding Lite dans vos applications.

Afficher l'attribution Google Maps

Vous devez respecter les exigences d'attribution de Google Maps lorsque vous affichez du contenu de Grounding Lite dans votre application ou sur votre site Web. Vous n'avez pas besoin d'ajouter d'attribution supplémentaire si le Contenu est affiché sur une carte Google où l'attribution est déjà visible.

Logo Google Maps et attribution textuelle

Dans la mesure du possible, l'attribution doit prendre la forme du logo Google Maps. Dans les cas où l'espace est limité, le texte Google Maps est acceptable. Les utilisateurs finaux doivent toujours pouvoir identifier clairement les contenus fournis par Google Maps.

À gauche : attribution du logo Google Maps, à droite : attribution du texte Google Maps

Attribution du logo

Suivez ces exigences pour utiliser le logo Google Maps dans votre application ou sur votre site Web.

Variantes acceptables pour l'attribution du logo Google Maps

Télécharger les logos Google Maps

Utilisez les fichiers officiels du logo Google Maps. Téléchargez les logos ci-dessous et suivez les consignes de cette section.

Télécharger les ressources d'attribution Google Maps

Lorsque vous utilisez le logo Google Maps, suivez ces consignes.

• Ne modifiez en aucun cas le logo.
• Conservez les proportions du logo pour éviter toute déformation.
• Utilisez le logo avec contour sur un arrière-plan chargé, comme une carte ou une image.
• Utilisez le logo sans contour sur un arrière-plan uni, comme une couleur unie ou un dégradé subtil.

Spécifications concernant la taille du logo

Respectez les caractéristiques de taille suivantes pour le logo Google Maps :

• Hauteur minimale du logo : 16 dp
• Hauteur maximale du logo : 19 dp
• Espace vide minimal du logo : 10 dp à gauche, à droite et en haut, 5 dp en bas

Pour en savoir plus sur les dp, consultez Densité de pixels sur le site Web Material Design.

Logo Google Maps montrant l'espace libre minimal et la plage de tailles acceptables

Accessibilité du logo

Respectez les exigences d'accessibilité suivantes pour le logo Google Maps :

• Maintenez un contraste accessible entre le logo et l'arrière-plan.
• Incluez un libellé d'accessibilité avec le texte Google Maps.

Variantes inacceptables et problèmes d'accessibilité pour l'attribution du logo Google Maps

Attribution de texte

Si la taille de votre interface ne permet pas d'utiliser le logo Google Maps, vous pouvez écrire Google Maps en texte. Suivez les instructions ci-dessous :

Variantes acceptables de l'attribution de texte Google Maps

• Ne modifiez en aucun cas le texte Google Maps :
  • Ne modifiez pas la casse de Google Maps.
  • N'affichez pas Google Maps sur plusieurs lignes.
  • Ne localisez pas Google Maps dans une autre langue.
  • Empêchez les navigateurs de traduire Google Maps en utilisant l'attribut HTML translate="no".

Variantes inacceptables de l'attribution textuelle Google Maps

• Mettez en forme le texte Google Maps comme décrit dans le tableau suivant :

  Exigences de mise en forme du texte dans Google Maps
  Propriété	Style
  Famille de polices	Roboto. Le chargement de la police est facultatif.
  Famille de polices de remplacement	Toute police de corps sans serif déjà utilisée dans votre produit ou "Sans-Serif" pour appeler la police système par défaut
  Style de police	Normale
  Épaisseur de la police	400
  Couleur de la police	Blanc, noir (#1F1F1F) ou gris (#5E5E5E). Maintenez un contraste accessible(4.5:1) par rapport à l'arrière-plan.
  Taille de police	Taille de police minimale : 12 sp Taille de police maximale : 16 sp Pour en savoir plus sur les sp, consultez Unités de taille de police sur le site Web Material Design.
  L'espacement entre les lettres	Normale

Exemple d'élément CSS

Le code CSS suivant affiche Google Maps avec la typographie et la couleur appropriées sur un arrière-plan clair ou blanc.

@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;
}