Design-Checkliste
Mit Sammlungen den Überblick behalten
Sie können Inhalte basierend auf Ihren Einstellungen speichern und kategorisieren.
Die folgenden Richtlinien können helfen, häufige Designfehler beim Erstellen oder Bearbeiten von Kartenstilen zu vermeiden. Google empfiehlt, auch einen Grafikdesigner zurate zu ziehen, der Ihr Design zusammenstellt und prüft.
Einen Farbkontrast festlegen, der groß genug ist: Durch den Kontrast bleibt der Text lesbar und Kartenelemente lassen sich leichter unterscheiden. Weitere Informationen hierzu finden Sie im Artikel Kontrastierende Füll- und Strichfarben auswählen.
Verschiedene Zoomstufen ausprobieren: Vergewissern Sie sich mithilfe von Tests, dass Ihre Kartenelemente bei verschiedenen Zoomstufen gut dargestellt werden.
Farbkombinationen vermeiden, die farbenblinden Nutzern Probleme bereiten können:
Das Design muss auch für farbenblinde Nutzer geeignet sein.
Nachtmodus prüfen: Auf Mobilgeräten muss das Design mit dem Nachtmodus kompatibel sein.
Kontrastierende Füll- und Strichfarben auswählen
Der Kontrast zwischen Füll- und Strichfarben muss groß genug sein, dass sich die Kartenelemente vom Hintergrund und von ähnlichen Kartenelementen unterscheiden lassen.
Polygone für eine Linie: Wählen Sie kontrastierende Farben aus, um das Detail auf einer Linie sichtbar zu machen. Beispielsweise werden Wege und Pfade durch gepunktete Linien dargestellt und wenn die Farben nicht kontrastreich genug sind, sehen diese Linien wie durchgehende Linien aus. Bundesstraßen sind an den äußeren Rändern umrissen und die Linien können bei fehlendem Kontrast wie durchgehende Linien aussehen und somit mit anderen Straßentypen verwechselt werden.
Polygone für eine Form: Durch den Kontrast können Sie die Ränder zwischen Polygonen sehen, die nebeneinander liegen.
Textstrich und -füllung: Bei Text ist der Strich die Umrissfarbe, die dafür sorgt, dass Text besser vor Hintergrundfarben gelesen werden kann. Falls die Strichfarbe der Füllfarbe zu ähnlich ist, können Ihre Schriftarten verschwommen oder unscharf erscheinen.
Sofern nicht anders angegeben, sind die Inhalte dieser Seite unter der Creative Commons Attribution 4.0 License und Codebeispiele unter der Apache 2.0 License lizenziert. Weitere Informationen finden Sie in den Websiterichtlinien von Google Developers. Java ist eine eingetragene Marke von Oracle und/oder seinen Partnern.
Zuletzt aktualisiert: 2025-08-27 (UTC).
[null,null,["Zuletzt aktualisiert: 2025-08-27 (UTC)."],[],[],null,["Select platform: [Android](/maps/documentation/android-sdk/cloud-customization/design-resources \"View this page for the Android platform docs.\") [iOS](/maps/documentation/ios-sdk/cloud-customization/design-resources \"View this page for the iOS platform docs.\") [JavaScript](/maps/documentation/javascript/cloud-customization/design-resources \"View this page for the JavaScript platform docs.\") [Web Service](/maps/documentation/maps-static/cloud-customization/design-resources \"View this page for the Web Service platform docs.\")\n\n\u003cbr /\u003e\n\nThe following guidelines address common design\npitfalls when creating or editing a map style. Google recommends\nyou also consult with a graphic designer to assemble and review your design.\n\n- **Make sure there is enough color contrast** : Contrast helps keep the text\n readable and helps distinguish certain map features. For details, see\n [Choose contrasting fill and stroke colors](#contrast).\n\n- **Check different zoom levels**: Test that your style elements look good at\n different zoom levels.\n\n- **Avoid color combinations known to be problematic for colorblind users**:\n Make sure your design is usable for people who are colorblind.\n\n- **Check Night mode**: For mobile designs, make sure your design works with\n Night mode.\n\nChoose contrasting fill and stroke colors\n\nMake sure there is enough contrast between fill and stroke colors to make sure\nyour map features are distinguishable from the background and from similar map\nfeatures.\n\n- **Polygons for a line**: Choose colors that contrast to show the detail on\n a line. For example, trails are dotted lines, and if the colors don't\n have enough contrast, it looks like a solid line. Highways are outlined on\n the outer edges, so without contrast, they may look solid, and therefore\n could be confused with other road types.\n\n- **Polygons for a shape**: Contrast helps you see the borders between\n polygons that are next to each other.\n\n- **Text stroke and fill**: For text, the stroke is your outline color, which\n helps to make the text readable against background colors. If the stroke\n color is too similar to the fill color, your fonts may also appear blurry or\n out of focus."]]
