Площадки с фонами, иконками и графикой для лендинга
У нас часто спрашивают о том, где можно найти крутой фон для лендинга, как подобрать нешаблонные клипарты и так далее. Мы составили список самых популярных стоков и сервисов c графикой для landing page.
Безусловно, лучше всего отрисовывать и создавать все с нуля, но мы-то понимаем, что это:
- Задачка далеко не для каждого специалиста;
- Дорого и не всегда вписывается в бюджет;
- Требует много сил дизайнера.
Огромные затраты времени, на которые не всегда готова пойти студия и заказчик.
Фотографии и фоны для лендинга
Вот несколько бесплатных сервисов, на которых можно найти качественные фотографии и фоны для landing page.
1. New Old Stock Photos
Мы любим этот сервис, поскольку в нем есть большое количество качественных и совершенно бесплатных фотографий в винтажном стиле. Они собраны из источников по всему миру и, что ценно, не вызывают проблем с правообладателями.
2. Gratiso Photography
Многие стоки предлагают достаточно дорогие снимки и при этом не обновляют каталог месяцами. Платить за качественные фото — это нормально, но когда выбор ограничен, снимки «затаскиваются», и их ценность падает. Этот сервис отличается тем, что коллекции пополняются еженедельно, а изображения бесплатные.
3.Refe Photos
100% бесплатный сток, в котором нет ограничений по целям использования. Также можно подписаться на обновления. Но есть и недостаток: многие фото сделаны на телефон и не отличаются высоким качеством.
4. Wellcome Images
Еще один неплохой сток, который включает большую и хорошо структурированную коллекцию снимков в разных тематиках. Искать легко, контент достаточно качественный.
5. Pixabay
В отличие от многих конкурентов, тут есть русский язык в интерфейсе. Удобно искать фотографии и весь контент полностью бесплатный. Правда, много шаблонных изображений, которые Вы наверняка видели на лендингах.
6. Picjumbo
Неплохой сток, в котором каждый день появляются новые изображения в разных категориях.
Выбор большой, а все снимки бесплатные.
Платные картинки для лендинга
Есть несколько платных ресурсов, на которых можно найти качественные фоны, иконки и графику для лендинг пейдж.
7. Shutterstock
Один из самых популярных сервисов с каталогом стоковых фотографий. Огромная база снимков как от зарубежных, так и от наших фотографов, дизайнеров, любителей. Дополнительное преимущество в том, что онлайн-ресурс русифицированный.
8. Getty Images
Неплохой сток, который наравне с платным контентом предлагает бесплатные изображения. Очень удобная навигация по тегам, разделам и так далее. Есть как современные, так и винтажные снимки.
9. Imagesource
Сток с большим выбором и удобным предпросмотром фотографий.
10. Lori
Этот сток хочется выделить отдельно, поскольку в нем все фотографии на 100% легальные и содержат славянские лица, пейзажи. Использование такого контента для сайтов будет куда более уместным, чем улыбающиеся афроамериканцы и виды Лос Анджелеса.
11. Corbisimages
Неплохой ресурс с большим каталогом фотографий и удобным простым поиском. Не все фотографии с авторскими знаками, а там, где они есть — они расположены в углу, а не по центру.
12. SXC
Хороший сток, но чтобы просматривать фотографии в нормальном разрешении, Вам придется зарегистрироваться.
13. Фотодженика
Фотосток из России, в котором достаточно большая база изображений, которые подойдут для веб-дизайна в наших широтах. Снимки качественные, в хорошем разрешении.
14. Unsplash
Один из немногих ресурсов, который предлагает бесплатную рассылку. Раз в 10 дней подписчики получают на почту архив качественных фото, которые можно либо сохранить на ПК, либо загрузить на Dropbox.
15. Little Visuals
Тут действует аналогичная схема: подписчик получает 7 свежих фото еженедельно.
16. Deathto Stock Photos
Похожая ситуация, с одной поправкой: чаще фотографии присылают для личного использования, а не для бизнеса.
17. Flickr и Tumblr
Сервисы, где можно найти бесплатные картинки, причем, самые свежие. Их можно публиковать на основе требований Creative Commons 3.0.
Где найти иконки для landing page
Иконки для лендинга найти, пожалуй, в несколько раз сложнее, чем фото или картинки. Ниже несколько стоков, в которых можно найти качественные клипарты в разных стилях и тематиках.
18. The Noun Project
Постоянно пополняемая база, в которой на данный момент более 25 000 иконок. К сожалению, за скачивания нужно платить. Тарифные планы есть начиная с 10 скачиваний ежемесячно.
19. Icon Monstr
А вот тут все бесплатно. Иконок меньше (порядка 2000 сетов), но поиск удобный и скачивать можно без ограничений.
20. Icon Sweets
Более 1000 иконок в «чистом» стиле. Если Вам нравится Apple, то такие клипарты точно придутся кстати.
21. Icon Finder
Неплохой поисковичок, который позволяет подбирать клипарты по категориям и ключевым словам. В общей сложности иконок для landing page там более 340 000.
Графика и текстуры для landing page
22. Creative Market
Тысячи работ от дизайнеров со всех уголков планеты. Кроме платного контента предостаточно бесплатных материалов. Кстати, выгружать можно и собственные работы, в том числе, за денежку. Если работа крутая, то ее будут скачивать и покупать.
23. Graphic Burger
Каталог бесплатных элементов дизайна. Выбор не очень большой, но зато работы действительно стоящие.
24. The Pattern Library
Ежедневно пополняющаяся площадка с текстурами для дизайнеров. Контент бесплатный, есть из чего выбрать.
25. Subtle Patterns
Бесшовные текстуры, которые оптимально подходят для адаптивных сайтов. Выбор не очень широкий (порядка 350 вариантов), но с этим тоже можно работать.
Мы привыкли писать по существу, и теперь, когда Ваш дизайнер пожалуется, что не может найти фон для лендинга или какую-нибудь графику — кидайте ему ссылку на эту статью.
Вы можете заказать лендинг пейдж в агентстве интернет-маркетинга RetsCorp.
Оценок: 1 545 (средняя 5 из 5)
Площадки с фонами, иконками и графикой для лендинга {descr}
- Главная
- Площадки с фонами, иконками и графикой для лендинга
50 бесплатных ресурсов с графикой для ваших лендингов
На просторах интернета существует масса ресурсов с бесплатными материалами для дизайна посадочных страниц. Речь идет о шрифтах, шаблонах и макетах, векторных иллюстрациях, стоковых фотографиях, иконках и даже видеороликах — обо всех основных ресурсах, которые могут понадобиться вам в ваших проектах. При этом халява вовсе не означает плохое качество.
В этой статье мы подобрали для вас перечень бесплатных ресурсов с графикой высокого качества, чтобы вы могли приступить к созданию лендинга как можно скорее.
Все эти сайты актуальны на июнь 2020 года. Если вы из будущего, то некоторые ссылки могут не работать, также мог измениться и дизайн самих ресурсов.
Содержание статьи
Бесплатные стоковые изображения
1. Pexels
2. StockSnap
3. Landing Stock
4. Photo Creator
5. Nappy
Бесплатные векторные иллюстрации
6. Drawkit
7. Humaaans
8. UnDraw
9. Open Peeps
10. Lukasz Adam Free Illustrations
Бесплатные иконки
11. Noun Project
12. Ionicons
13. Simple Icons
14. Icons
15. Animaticons
Бесплатные шрифты
16. Google Fonts
17. Use & Modify
18. Fontfabric
19. Dafont
20. Font Squirrel
Бесплатные стоковые видео
21. Coverr
22. Mixkit
23. Videezy
24. Life of Vids
25. Videvo
Бесплатные инструменты графического дизайна
26. Crello
28. Gravit Designer
29. Inkscape
30. Pencil
Бесплатные инструменты для создания макетов
31.
Shotsnapp
32. Screely
33. Screenpeek
34. MockupsJar
35. Mockup World
Бесплатные инструменты для редактирования изображений
36. Remove
37. Social Sizes
38. Fotor
39. Pixel Editor X
Бесплатные инструменты для создания скриншотов
40. Collabshot
41. Giphy Capture
42. ScreenToGif
43. ShareX
44. Snappy
45. Lightshot
Вдохновение для дизайнеров
46. Behance
47. Dribbble
49. Microcopy Inspirations
50. InspoFinds
Вместо заключения
Бесплатные стоковые изображения
Считается, что стоковые фотографии на лендингах выглядят ненастоящими, неестественными — и, как результат, не внушают доверия посетителям.
Однако ничего плохого в изображении, которое вы купили (или скачали) в Интернете, на самом деле нет, а фотостоки могут стать ценным инструментом для экономии рабочего времени и ресурсов вашей компании. Самое главное — придерживаться определенных правил при выборе подобных фотографий, ну и конечно, не забывать о тестировании.
1. Pexels
2. StockSnap
На StockSnap имеется огромный выбор высококачественных бесплатных стоковых фотографий из самых разных категорий. Здесь вы всегда найдете то, что вам нужно. Денежное вознаграждение не требуется, но всегда приветствуется.
3. Landing Stock
Landing Stock — это нишевый сайт с бесплатными стоковыми фотографиями для специально для посадочных страниц. Созданный лондонским продуктовым дизайнером Крейгом Барбером (Craig Barber), Landing Stock содержит только высококачественные и минималистичные фотографии, которые хорошо кадрируются и оставляют достаточно места для текста на ваших лендингах.
4. Photo Creator
Хотите получить фото, которого больше ни у кого нет? Photo Creator позволяет миксовать различные стоковые фотографии для создания собственного уникального изображения. Комбинируйте объекты, людей, фоны и даже собственные изображения, используя быстрый и простой интерфейс.
5. Nappy
Если ваша задача как создателя лендинга — охватить как можно более широкие слои населения, особенно если вы позиционируетесь на международном рынке, то вас может заинтересовать данный фотосток. Nappy — относительный новичок среди бесплатных фотобанков, содержащий «красивые высококачественные фотографии темнокожих людей».
Читайте также: 23 сайта для поиска оригинальных бесплатных изображений
Бесплатные векторные иллюстрации
Векторные изображения (в отличие от их аналогов в формате JPG или PNG) допускают увеличение без потери качества. Поэтому, когда вы используете такие изображения, вы можете быть уверены в удобстве вашего лендинга для посетителей.
Кроме того, элементы векторной графики «весят» меньше, чем их аналоги в других форматах. Это позволяет сократить время загрузки страницы и тем самым уменьшить отток пользователей.
6. Drawkit
DrawKit — это коллекция бесплатных, настраиваемых и распространяемых под лицензией MIT векторных иллюстраций в формате SVG в двух стилях для использования на вашем лендинге, приложении или ином проекте.
7. Humaaans
В Humaaans Пабло Стэнли (Pablo Stanley) создал нечто совершенно особенное: модульные векторные иллюстрации людей, которые можно смешивать, вращать и перемещать для создания своих собственных дизайнов. Все, что вы сделаете здесь, бесплатно для коммерческого и личного использования.
8. UnDraw
UnDraw — это постоянно обновляемый дизайн-проект Катерины Лимпитсуни (Katerina Limpitsouni), содержащий «иллюстрации с открытым исходным кодом для любых ваших идей». Здесь представлены красивые изображения в формате SVG, которые вы можете использовать совершенно бесплатно и без указания авторства.
9. Open Peeps
Нужно что-то более рисованное? Тогда обратите внимание на библиотеку иллюстраций в стиле «от руки» Open Peeps. Векторная графика в форматах SVG и PNG с открытым исходным кодом доступна для Sketch, Figma, Studio и XD. При желании можно сделать пожертвование.
10. Lukasz Adam Free Illustrations
Лукаш Адам (Lukasz Adam) — независимый веб-дизайнер, создавший множество высококачественных векторных иллюстраций и иконок для бесплатного использования. Их можно использовать как для личных, так и для коммерческих проектов.
Читайте также: 10 трендов веб-дизайна на 2020 год
Бесплатные иконки
Неважно, для какого продукта вы используете иконки — лендинга, сайта, мобильного или ПК приложения — главное, делать это с умом.
Наверняка вам приходилось заходить на ресурс со множеством иконок, из которых понятными оказывалась в лучшем случае половина. Если вы используете иконки для навигации на посадочной странице, старайтесь выбирать интуитивные и узнаваемые изображения, чтобы не путать своих клиентов.
11. Noun Project
Основанный Софьей Поляковой (Sofya Polyakov), Эдвардом Боатманом (Edward Boatman) и Скоттом Томасом (Scott Thomas), сайт The Noun Project содержит более 2 000 000 тщательно отобранных иконок, доступных для бесплатного использования.
12. Ionicons
Ionicons — это премиальные иконки для использования на лендингах, а также в iOS, Android и десктопных приложениях. Созданные командой Ionic Framework, все они бесплатны и имеют открытый исходный код.
13. Simple Icons
Созданный Дэном Личем (Dan Leech), Simple Icons предоставляет бесплатные иконки популярных брендов в формате SVG.
14. Icons
Этот ресурс предоставляет целую библиотеку бесплатных иконок в форматах PNG и SVG. Помимо того, что сайт имеет русский интерфейс, его создатели также всегда следят за тенденциями. Так, недавно они сделали раздел «Иконки на тему COVID-9» для тех из компаний, которые ищут новые пути для маркетинга во время пандемии.
15. Animaticons
Animaticons — это набор анимированных настраиваемых иконок высокого разрешения в формате GIF. Все они небольшого размера, совместимы с основными браузерами, почтовыми сервисами и смартфонами, и не требуют специальных плагинов или библиотек.
Читайте также: 11 бесплатных наборов иконок для дизайнеров
Бесплатные шрифты
Есть миллион вещей, которые следует учитывать при создании идеального лендинга: подобрать изображения, цветовую гамму, написать цепляющий заголовок. Но есть одна вещь, которую часто недооценивают — это шрифт. Не стоит делать эту же ошибку.
Правильный выбор шрифта может оказать существенное влияние на окончательный внешний вид вашей страницы.
16. Google Fonts
Интуитивно понятная и надежная библиотека веб-шрифтов с открытым исходным кодом, позволяющая дизайнерам использовать их по своему усмотрению. Все они созданы по высоким стандартам, которых можно ожидать от такого веб-гиганта, как Google.
Кстати, вам больше не нужно открывать сервис Google Fonts для получения сторонних шрифтов, ведь теперь шрифты подключаются прямо из редактора лендингов LPgenerator.
17. Use & Modify
Use & Modify — персональная подборка «классных, панковских, профессиональных, неполных и странных шрифтов» с открытым исходным кодом, которые можно бесплатно использовать и модифицировать.
18. Fontfabric
Fontfabric — это мастерская цифрового типа, создающая продающие шрифты и заказную типографику для различных брендов. Кроме того, здесь имеется выбор шрифтов для бесплатной загрузки и использования.
19. Dafont
Dafont — это огромный архив шрифтов, доступных для бесплатного скачивания. И хотя сайт имеет довольно устаревший дизайн, все искупается его функциональностью. На Dafont есть возможность поиска по алфавиту, стилю, автору или популярности — вы обязательно найдете то, что вам нужно.
20. Font Squirrel
Еще один обширный архив бесплатных шрифтов, в том числе для коммерческого использования.
Читайте также: Как выбрать правильный шрифт для своего лендинга?
Бесплатные стоковые видео
Помимо стоковых изображений, в интернете можно найти аналогичные бесплатные хранилища для видеороликов. И хотя стоковые видео весят, чем фотографии, они позволяют выделиться и создать более красочную презентацию вашего продукта.
Если у вас есть продукт или услуга, которые могут вызвать эмоциональный отклик у посетителей, используйте видео, создающее эмпатию и вызывающее эмоциональное возбуждение — тогда люди охотнее кликнут по СТА.
21. Coverr
Coverr — это источник красивых стоковых видеороликов, которые можно бесплатно скачивать для коммерческого и некоммерческого использования без указания авторства.
22. Mixkit
Mixkit — это галерея тщательно отобранных высококачественных видео и анимации, созданных одними из самых талантливых авторов в мире, с лицензией на бесплатное использование.
23. Videezy
Одно из крупнейших видеосообществ Videezy содержит стоковые видеоролики в форматах HD и 4K.
Большая часть коллекции доступна для бесплатного скачивания и использования, но также имеются и некоторые платные опции, если вы захотите расширить свой поиск.
24. Life of Vids
Life of Vids предлагает бесплатные видео для веб-дизайнеров, режиссеров, рекламодателей, агентств и всех желающих. Вы можете создавать зацикленные видео с большинством из них. Все они доступны для использования как в личных, так и в коммерческих целях.
25. Videvo
Videvo предлагает массу видеороликов для бесплатного использования в личных и в коммерческих целях. При использовании видеоклипов с лицензией Creative Commons 3.0 следует указывать авторство.
Читайте также: Как видео и gif-анимация повышают конверсию лендинга?
Бесплатные инструменты графического дизайна
И все же, когда речь заходит о продвижении оффера, оригинальность точно не помешает. Вы пытаетесь привлечь больше потенциальных клиентов на лендинг из соцсетей, хотите создать качественную вирусную инфографику или разместить рекламу?
На сегодняшний день в свободном доступе находится целый ряд простых, но при этом эффективных инструментов, которые позволят вам почувствовать себя профессиональным дизайнером.
26. Crello
Crello — «бесплатный онлайн-редактор видео, изображений и анимации для соцсетей и веба». Вам даже не нужны навыки дизайна, чтобы начать использовать его. Crello предоставляет огромный выбор из более чем 5000 готовых анимированных шаблонов. Кроме того, сайт доступен на русском языке.
27. Canva
Простой для использования в браузере, сервис Canva — удивительно мощный и гибкий инструмент графического дизайна с русскоязычным интерфейсом. И хотя это не Photoshop, он способен выполнять множество базовых дизайнерских задач довольно эффективно с помощью функции перетаскивания.
28. Gravit Designer
Gravit Designer — это полнофункциональное приложение для векторного графического дизайна, доступное на всех платформах. Бесплатная версия поставляется с 500 МБ облачного хранилища.
29. Inkscape
Inkscape — это высококачественный профессиональный инструмент для работы с векторной графикой, доступный для Windows, Mac OS X и GNU / Linux.
Является свободным и открытым программным обеспечением. Есть русский интерфейс.
30. Pencil
Pencil — бесплатная альтернатива Adobe XD. Это мощный инструмент с открытым исходным кодом, позволяющий создавать прототипы для веб-приложений, мобильных и десктопных приложений. Доступен для всех платформ.
Читайте также: Визуальный маркетинг: 25 инструментов для работы с графикой
Бесплатные инструменты для создания макетов
Инструменты по созданию макетов и прототипов могут быть очень полезны при разработке лендингов или приложений, чтобы показать клиенту, как будет выглядеть окончательный дизайн.
С помощью перечисленных ниже инструментов вы сможете быстро создать эскиз своего проекта и более эффективно общаться с клиентами.
31. Shotsnapp
Создавайте свои собственные макеты изображений устройств для дизайна приложений или мобильных лендингов в считанные секунды с помощью бесплатного инструмента Shotsnapp. Выберите устройство, добавьте изображение вашего дизайна или скриншот, внесите необходимые изменения, и скачайте изображение макета.
32. Screely
Screely позволяет мгновенно превратить снимок экрана в макет без использования Sketch и Photoshop. Просто загрузите свое изображение, а приложение сделает за вас все остальное.
33. Screenpeek
Скопируйте и вставьте URL своего лендинга или сайта в Screenpeek, и всего за 10 секунд он создаст привлекательный макет. Это приложение, созданное Хансом Пейджелом (Hans Pagel) и Филиппом Куном (Philipp Kuhn), бесплатно только для макетов iPhone.
34. MockupsJar
Еще один замечательный веб-сайт, где вы можете создавать реалистичные макеты для своих сайтов, приложений и многого другого без использования Photoshop и плагинов. Все организовано по категориям, таким, как, например, «Macbook» и «упаковка».
35. Mockup World
Mockup World — крупнейший источник бесплатных фотореалистичных макетов. Эти легко настраиваемые файлы PSD со всего мира готовы для использования в ваших проектах, демонстрациях приложений и презентациях.
Читайте также: Что делать, если ваш лендинг шаблон не конвертирует?
Бесплатные инструменты для редактирования изображений
Не только дизайнеры, но и маркетологи в ходе своей работы с контентом постоянно взаимодействует с фотографиями, видео, GIF-файлами, инфографикой и т. д. Надеемся, что ваш труд смогут значительно упростить следующие инструменты для редактирования изображений.
36. Remove
Нужно удалить фон на изображении? Этот бесплатный инструмент поможет вам сделать это очень быстро, всего за один клик. Сайт доступен на русском языке.
37. Social Sizes
Social Sizes, созданный Питером Ассенторпом (Peter Assentorp), обеспечивает дизайнеров лучшими размерами изображений и видео для социальных сетей. Шаблоны для Sketch, Adobe XD и Photoshop включены и доступны для бесплатного скачивания.
38. Fotor
Fotor — это не только графический дизайнер, но и фоторедактор со множеством функций: обрезка, вращение, выравнивание, изменение размера и добавление эффектов к любому изображению — и все это в окне браузера.
Также здесь можно создавать фотоколлажи.
39. Pixel Editor X
Pixel Editor давно известен как базовый, но надежный фоторедактор, доступный для бесплатного использования в браузере. Недавно вышла новая версия — Pixel Editor X. Она имеет больше инструментов для редактирования и интегрируется с Dropbox. Доступен интерфейс на русском языке.
Читайте также: 7 лучших бесплатных альтернатив Adobe Photoshop
Бесплатные инструменты для создания скриншотов
40. Collabshot
Это веб- и десктопное приложение позволяет быстро делать скриншоты и обмениваться URL-адресами с коллегами, а также совместно создавать рисунки и наброски в онлайн режиме.
41. Giphy Capture
Это бесплатное приложение для Mac позволяет легко захватывать часть экрана и экспортировать ее в файлы GIF и MP4. Также всего за пару кликов возможна запись экрана в формате GIF до 30 секунд.
42. ScreenToGif
Это бесплатное приложение для Windows с открытым кодом обеспечивает запись экрана, вебкамеры и скетчборда со встроенным редактором.
Доступно на русском языке.
ShareX — это легкий, бесплатный инструмент с открытым исходным кодом для захвата экрана и совместного использования файлов, активно развивающийся благодаря сообществу уже на протяжении 11 лет.
44. Snappy
Snappy — это профессиональное приложение для создания и совместной работы над снапшотами для iPhone, iPad и Mac. (Версия для Windows «скоро выйдет», можно подписаться на новости, чтобы узнать о выходе первым).
45. Lightshot
Еще одно бесплатное приложение для Mac и Windows, а также браузеров Chrome, Firefox, IE и Opera, Lightshot позволяет вам захватывать любую часть экрана, загружать ее на их сервер и получать короткую ссылку. Вы также можете добавлять на скриншоты линии, стрелки и текстовые аннотации.
Читайте также: Оптимизация изображений как важная составляющая CRO-процесса
Вдохновение для дизайнеров
Попытка создать отличный дизайн лендинга зачастую требует много времени и заставляет совершить больше проб и ошибок, чем на самом деле нужно.
А ведь все упирается в поиск правильного источника вдохновения.
Конечно, вы можете создать что-то прекрасное из своего воображения, но намного легче что-то сделать из уже имеющейся работы, не так ли?
46. Behance
Behance, часть семьи Adobe, является популярной онлайн-платформой для демонстрации и поиска творческих работ, включая искусство, иллюстрацию, графический дизайн, дизайн пользовательского интерфейса и анимацию.
47. Dribbble
Dribbble — это еще одно популярное и успешное онлайн-сообщество для демонстрации творчества. В то время как Behance представляет в основном завершенные работы, Dribbble специализируется на меньших «снапшотах» работы в процессе выполнения.
48. Httpster
Httpster — это вдохновляющий ресурс, демонстрирующий дизайны сайтов со всего мира. Акцент сделан не на кричащих элементах, а на подходе к дизайну «меньше — значит больше».
49. Microcopy Inspirations
На этом часто недооцененном ресурсе вы найдете тщательные отобранные примеры страницы ошибки 404, текстов рассылок и интернет-магазинов.
50. InspoFinds
На этом красивом сайте, оформленном в минималистичном стиле, представлены одни из самых лучших творческих идей. InspoFinds — настоящий банкет из проектов брендинга, дизайна упаковки и редакторских функций, предлагает поддержку тем, кого они представляют, и вдохновение для остального творческого сообщества.
Читайте также: 21 руководства по стилю для визуального вдохновения
Вместо заключения
Если вы молодая компания или стартап, в случае наличия хотя бы небольшого бюджета или навыков в графическом дизайне, фотографии и видеосъемке, предлагаем вам изучить следующие статьи нашего блога:
- 8 способов создать безупречные фото для лендинга
- Как создавать объясняющие и промовидео: инструкция
- Создание инфографики в Canva за 15 минут
- Обзор популярных онлайн сервисов для создания логотипа
- 5 принципов гештальт-психологии для создания запоминающихся изображений
Если же вы твердо решили ограничиться чужими работами, то выбирайте релевантные для вашей ниши изображения, так как от этого зависит доверие к вашему лендингу.
Просматривать и покупать подходящие картинки одного из ведущих фотобанков, Fotolia, можно не выходя из личного редактора LPgenerator. Встроенная Галерея содержит более 50 миллионов изображений, векторов и иллюстраций. Ежедневное обновление и профессиональный отбор позволят вам найти именно то, что нужно, ведь качественные изображения — важный фактор, напрямую влияющий на показатели лендинга.
Высоких вам конверсий!
По материалам: creativeboom.com Изображение: freepik.com
08-06-2020
советов по веб-дизайну: как использовать значки на целевой странице | by Icons8
В эпоху сканирования и просмотра контента жизненно важно привлечь внимание потенциального клиента. Даже если у вас есть хороший продукт или услуга и отличный экземпляр, без должной презентации он рискует быть пропущенным потенциальным клиентом.
Команда разработчиков инновационного конструктора веб-сайтов Tilda постоянно исследует лучшие практики дизайна веб-страниц, чтобы применить их в нашем продукте.
Вместе с Icons8 мы решили поделиться способами применения иконок на лендингах, чтобы сделать ваше предложение визуально выдающимся.
В статье полно примеров. Мы предоставляем ссылки на все из них, так что вы можете посмотреть на реальные страницы, получить значки из примеров и даже попробовать их легко и бесплатно с помощью конструктора целевых страниц.
Итак, приступим!
Структурированная информация легче читается и запоминается, поэтому списки являются частью языка дизайна веб-страниц HTML. Мы используем и видим списки каждый день: функции, услуги, преимущества, почему выбирают нас, как это работает, планы и варианты.
Самый простой способ эффективно использовать пространство веб-страницы — распределить элементы по горизонтали. Вот пример:
IBM Watson целевая страницаОднако без визуальных привязок и отсутствия контраста посетитель просматривает этот список. Если дизайнер не тратил время на оформление этого блока, почему читатель должен тратить свое время на потребление этой информации? Это так важно?
Давайте сравним 2 способа, и вы сможете сказать, какой из них более запоминающийся и дружелюбный.
Структурный блок фактов без иконок:
Или структурный блок фактов с иконками:
Как видите визуальное представление информации более привлекательно, поэтому Apple использует его.
Нижний колонтитул на целевой странице iPhone XСделайте ненумерованные списки красивыми
Очевидный способ сделать список красивым — поставить галочку:0015 Шаблон целевой страницы от Tilda
Выделите функции
Если вам трудно подобрать метафоры для ваших товаров, простое выделение жирным шрифтом поможет.
A Базовая целевая страница Шаблон без изображений выглядит лучше, чем простой упорядоченный текстовый список.Чтобы получить числовые значки, найдите «цифру 4» или «4 в кружке» на Icons8.
Даже если вы можете расставить элементы по порядку, подумайте о том, чтобы выделить элементы с помощью горизонтального списка.
Целевая страница тура на Tilda использует большие точки и горизонтальные элементы вместо простого списка.
Если вы не хотите возиться с созданием круга в любом графическом редакторе, просто найдите «заполненный круг» на Icons8 и легко перекрасьте его.
Придайте эмоциональный оттенок преимуществам
Визуальная метафора привлекает внимание посетителя и помогает понять смысл вашего сообщения.
Блок преимуществ на лендинге Тильды шаблонДайте визуальные синонимы услугам
Один из стандартных блоков услуг в Tilda PublishingБыстро редизайн сайта консалтинговой компании мирового уровня.
Вот раздел страницы до редизайна:
Booz Allen Hamilton Страница экспертизыА вот переработанная версия с иконками. Мы будем использовать значки в стиле Windows 10. Какой из них вам нравится больше?
Переработанный сервисный блок для Booz Allen HamiltonПримените фирменный цвет к вашим значкам
Сделайте дополнительный шаг и раскрасьте значки для вашей целевой страницы следующим образом:
Xero целевая страница Intercom целевая страница чата Strip1 партнерская программа Icons8 имеет несколько цветовых схем для любой иконки.
Диалог Colorization позволяет изменить любой цвет многоцветных значков. Иконки8 различных цветовых стилей для иконки в правом столбце. Диалоговое окно модуля перекрашивания Icons8, где вы можете изменить несколько цветов значка. Добавьте веса значкам с фоновой формой
Иногда в вашем списке преимуществ не так много слов, но не волнуйтесь, просто добавьте фоновую форму к каждому значку, чтобы сделать их жирными и последовательными.
Тильда Целевая страница квартир ШаблонShopify использует круглые формы, чтобы объединить различные формы значков на своей домашней странице:
Используйте гибкую настройку фона в Icons8 в соответствии с вашим стилем.
Визуальный якорь раздела
Если рассматривать разделы страницы как большую часть нашего предложения, становится ясно, что эти части на самом деле являются списками, так почему бы не привлечь внимание посетителя с помощью значков для каждого раздела?
A целевая страница веб-службы раздел шаблона использует значок вложения A целевая страница вакансии использует Значки с номерами кружки В качестве разделения разделитель Значок местоположения Используется в Страница конференции .
) на лендинге кофейни Оригинальный разделитель
Все новое – это хорошо забытое старое 😉 Первоначально использованный в книжном дизайне, текстовые разрывы сейчас встречаются нечасто, наверное, только в лонгридах:
«Разрывы текста — те места, где автор хочет вставить пробел, но не новую главу или раздел — многие авторы используют их, и они часто создают проблемы для макета книги» (8 решений дилеммы разрыва текста). )
Тем не менее, разделитель частей является одним из вариантов форматирования Medium:
И у Tilda Publishing их целый ряд:
По сути, любая простая форма в материальном стиле (заполненная и плоская), например, 3 точки или звездочки, лист или звезда могут быть разделителями частей.
Уточните тарифные планы с помощью метафор
Тарифные планы — очень популярный тип блока на целевых страницах. Очень важно четко донести цену до потенциального клиента, поэтому компании используют иконки для лучшего разделения тарифных планов.
«Нельзя утомлять людей покупкой вашего продукта» (Дэвид Огилви, рекламный магнат)
Создавайте привлекательные главные изображения
Если контент-маркетинг является королем, вы хотите, чтобы ваши статьи выделялись, потому что иногда статья является целевой страницей.
Изображение героя в Realtimeboard запись в блоге состоит из иконок Sprout Social используют иконки почти во всех превью статей Auth0 выбрали минималистичный способ иллюстрации для своих статей — одна иконка Heap Analytics использует значки в превью некоторых сообщений блога, чтобы показать тип контента вашего контента для социальных сетей рассмотрите Cosmic Pedro от Icons8 или Emoji Pics Composer от Amplifr.
Создавайте осмысленные интерактивные кнопки
Кнопки являются важной частью любого блока призыва к действию на целевых страницах. Многие маркетологи предпочитают четкие большие кнопки призыва к действию, не отвлекающие внимание. Скорее всего, у вас много кнопок на целевой странице, и лучше бы они были разными и чтобы было понятно, что происходит после нажатия на них.
Простая стрелка означает еще одну страницу с дополнительными сведениями.
Даже с чистыми сделанными на заказ фотографиями Square использует значки, чтобы проиллюстрировать значение ссылок в списке целевых страниц.
Среди множества CTA-блоков и форм на Тильде есть кнопка с иконками для популярных случаев, таких как загрузка файла или просмотр видео.
Значки типов файлов могут использоваться для указания того, какой тип файла получит пользователь или какой тип медиаконтента будет показан по ссылке.
Быстрые книги На целевой странице используется значок воспроизведения в кружке для кнопки просмотра видеоПолучение положительного отзыва
Для любого продукта или услуги обратная связь с клиентом является сигналом, если бизнес делает что-то правильно или неправильно.
Сбор отзывов клиентов может быть непростым, но вы должны попросить оценить работу/новостную рассылку/статью/продукт. Вот как это делает Medium с помощью кнопки аплодисментов:
По данным Hubspot, получить комментарий гораздо сложнее, чем поставить лайк.
Но даже кнопка «Нравится» достойна внимания дизайнера. Вы бы предпочли нажать на кнопку со значком или без него?
С помощью блока голосования Тильды вы можете настраивать изображения и использовать значки обратной связи из библиотеки Icons8:
Сделайте обычный вид привлекательным
Иконки добавят вкус любому сухому контенту.
Страница карьеры Airbnb Целевая страница Dropbox Блок контактов в Шаблон целевой страницы кафе от TildaИногда логотип не нужен, но страница с ним выглядит солидно. Многие малые предприятия или субпродукты крупных брендов имеют простой логотип для дифференциации и просто для ясности.
Baremetrics использует значки геометрических форм для каждой большой функции в своем продукте Тильда целевая страница летнего лагеря шаблон использует значок палатки на обложке 9000 создание привлекательных страниц может не требоваться усилий, если у вас есть хоть немного вдохновения и пара хороших инструментов:- Библиотека значков с поиском и настройками значков, например Icons8
- Конструктор веб-страниц с хорошей библиотекой блоков, например Tilda Publishing
Попробуйте применить кейсы из статьи на текущей или следующей целевой странице, измерьте конверсию и расскажите о результатах!
Находите это полезным? Поделитесь с теми, кто может использовать его тоже.
Первоначально опубликовано на Блог Icons8 — ознакомьтесь с другими историями дизайна от нашей команды.
Дизайн иконок целевых страниц, темы, шаблоны и загружаемые графические элементы на Dribbble
Посмотреть ✨ РепроКоннект ✨
✨ РепроКоннект ✨
Посмотреть 🥳 CommandBar
🥳 CommandBar
Посмотреть портфолио Design Exploration
Исследование дизайна портфолио
Посмотреть атомный ребрендинг
Атомный ребрендинг
Просмотр DemoLab — веб-сайт
DemoLab — Веб-сайт
Веб-сайт View Space (карта пользовательского интерфейса)
Космический сайт (UI карта)
Посмотреть аксиому 🌍
Аксиома 🌍
Посмотреть веб-дизайн Ninox
Веб-дизайн Ninox
Посмотреть 🌀
Посмотреть 🔥 Incident.
io🔥 Incident.io
Посмотреть веб-сайт KiCon 2.0
Веб-сайт KiCon 2.0
Посмотреть Invoker 🟣🔵
Инвокер 🟣🔵
View Space — первый полностью цифровой банк в Грузии
Space – первый полностью цифровой банк в Грузии
Посмотреть целевую страницу: Flowbase.
