Чтобы заказать вёрстку макета с Figma в HTML, оставьте заявку или позвоните нам.
Редактор Figma имеет ряд особенностей, которые иногда затрудняют процесс вёрстки, а это сказывается на стоимости работ для вас. Поэтому мы даём рекомендации к макетам. Советуем передать их вашему дизайнеру (Также вы можете скачать рекомендации в виде файла внизу страницы):
1. Допустимая ширина макета — до 1920 пикселей. Стандартная ширина контента составляет 1170 пикселей.
2. Представьте планшетную версию (700-1000 пикселей шириной) и мобильную (320-700 пикселей шириной).
3. Пользуйтесь сетками. Это избавляет от необходимости измерять расстояние между элементами.
4. Идеально, если элементы интерфейса кратны модулям сетки. Или хотя бы приближены к этому.
5. Не выходите за пределы предпоследних боковых направляющих, работая с сеткой.
6. Ширина текстовых блоков должна быть вписана в колонки. Также и отступы — делайте их равными или осознанными, а не «на глазок».
7. В любом случае расстояния между объектами должны представлять собой целые значения в пикселях.
8. Целыми должны быть и кегли шрифтов, и отступы.
9. Текстовая информация должна быть текстом. Причём максимально подходящим, а не просто шаблонным наполнением.
10. Используйте Grow Vertically для текстовых блоков.
11. Используемые шрифты прикладывайте в папке Fonts вместе с исходниками. Желательно, используйте не более 3 видов шрифтов.
12. Давайте информативные названия группам и фреймам.
13. Состояния кнопок, такие как клик, наведение или посещённая страница, располагайте в разных слоях.
14. Используйте Layer Styles.
15. Удалите лишние слои.
16. Растровые изображения должны быть максимально качественными, так как на разных экранах отличается плотность пикселей.
17. Векторную графику предоставляйте в формате SVG в папке SVG.