Контрольный список для разработки дизайна
Оптимизируйте свои подборки
Сохраняйте и классифицируйте контент в соответствии со своими настройками.
Следующие рекомендации помогут вам избежать распространённых ошибок при создании или редактировании стиля карты. Google также рекомендует проконсультироваться с графическим дизайнером для сборки и проверки вашего дизайна.
Убедитесь, что цветовой контраст достаточен : он помогает сохранить читаемость текста и выделить отдельные объекты карты. Подробнее см. в разделе Выбор контрастных цветов заливки и обводки .
Проверьте различные уровни масштабирования : проверьте, что элементы стиля хорошо выглядят при различных уровнях масштабирования.
Избегайте цветовых сочетаний, которые могут быть проблематичными для пользователей с дальтонизмом : убедитесь, что ваш дизайн удобен для людей с дальтонизмом.
Проверьте ночной режим : для мобильных устройств убедитесь, что ваш дизайн поддерживает ночной режим.
Выбирайте контрастные цвета заливки и обводки
Убедитесь, что между цветами заливки и обводки существует достаточный контраст, чтобы объекты вашей карты можно было отличить от фона и похожих объектов карты.
Многоугольники для линии : выбирайте контрастные цвета, чтобы показать детали на линии. Например, тропы обозначены пунктирными линиями, и если цвета недостаточно контрастны, линия будет выглядеть сплошной. Автомагистрали обозначены по внешним краям, поэтому без контраста они могут выглядеть сплошными и поэтому их можно спутать с другими типами дорог.
Полигоны для фигуры : Контраст помогает увидеть границы между полигонами, которые находятся рядом друг с другом.
Обводка и заливка текста : для текста обводка — это цвет контура, который помогает сделать текст более читаемым на фоне. Если цвет обводки слишком похож на цвет заливки, шрифты могут выглядеть размытыми или нерезкими.
Если не указано иное, контент на этой странице предоставляется по лицензии Creative Commons "С указанием авторства 4.0", а примеры кода – по лицензии Apache 2.0. Подробнее об этом написано в правилах сайта. Java – это зарегистрированный товарный знак корпорации Oracle и ее аффилированных лиц.
Последнее обновление: 2025-08-29 UTC.
[null,null,["Последнее обновление: 2025-08-29 UTC."],[],[],null,["# Design checklist\n\nSelect 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-----------------------------------------\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."]]
