Доброго времени суток! Сегодня поделюсь секретом как сделать баннер для сайта в онлайн режиме, причем совершенно бесплатно. Постоянные читатели, думаю замечают что на моем блоге иногда появляются новые объявления. Рекламные иллюстрации делаю в разных интернет сервисах и посредством стандартного ПО.
Основные способы для создания бесплатных баннеров:
- Microsoft PowerPoint
- Bannerovich.ru
- Canva.com
Это наиболее простые и понятные инструменты. Кто-то делает объявления в программе Фотошоп, но чтобы ей овладеть потребуется не один день.
Создание баннера для сайта тремя инструментами
Ниже рассмотрим процесс создания рекламной иллюстрации с помощью приведенного выше софта.
Изготовление баннера в PowerPoint
Если программы нет, то скачайте и установите ее на компьютер. После этого откройте и создайте новый чистый слайд.
Показываю, как выполнила заказ с фриланса. Дизайн баннеров игровой тематики
Версия программы 2016 года, если у вас другая, то ничего страшного. Суть остается прежней.
Теперь на этот слайд требуется нанести текст, фон, рисунок или что-то одно. Все зависит от фантазии создателя! Изображение можно найти в интернете или на сервисе pixabay.com. Цветовой дизайн делаем обычной заливкой. Обо всем этом по порядку.
Готовое изображение методом перетаскивания помещаем на слайд. Следует делать выбор картинки опираясь на нужный размер. Параметры берем на глаз, а потом подгоняем.
Теперь для редактуры текста переходим на главную страницу программы и настраиваем так как нам нужно. Что бы сделать полу прозрачное затемнение надписи, нажмите на нее левой кнопкой мыши. Затем кликните правой и выберите “Формат фигуры”.
Такой баннер у меня получился! А у вас?
Чтобы получить нужные размеры, края изображения можно сдвигать в стороны. Для измерения и сохранения используем программу которая делает скриншоты. Об их разновидностях можно почитать в статье: как сделать скриншот экрана на компьютере.
⚡️ КАК СДЕЛАТЬ БАННЕР В ФОТОШОПЕ / PHOTOSHOP
Таким образом создать баннер в Microsoft PowerPoint можно за несколько минут.
Создаем рекламную иллюстрацию в Bannerovich.ru
Шаг № 1.
Пройдите регистрацию в сервисе: http://bannerovich.ru. Но можно этого не делать, а просто создал скриншот своего творения. Регистрация дает возможность вставлять код баннера на сайт. То есть никаким изображением его грузить не нужно.
Шаг №2.
На главной нажмите «Создать Баннер»
После этого откроется меню, где нужно прописать определенные размеры будущей рекламы! Сделать баннер для сайта самостоятельно с этим сервисом можно без всяких проблем!
После того как вы определились с размерами снова нажимайте «сделать баннер»!
Выйдет страница, где все интуитивно понятно и просто. В правой колонке можете видеть ряд инструментов. Можно сделать фон, прописать текст, вставить картинку и др.
Таким образом, за пару минут можно изготовить превосходную рекламную иллюстрацию!
Буквально за 5 минут вы можете изготовить качественный профессиональный баннер! И это онлайн совершенно бесплатно!
Делаем баннер в сервисе Canva.com
Бесплатно в онлайне изготовить рекламное изображение можно с помощью проекта Canva.com. Так же благодаря ему можно создавать:
- Плакаты.
- Делать публикации в Фейсбук.
- Клепать логотипы.
- Выполнять публикации в инстаграм.
- Выполнять фон для FaceBook.
- Флаеры.
- Открытки.
- Изображения в социальные сети размером 800 на 800 px.
- Документы формата А4.
- Изготавливать инфо графику.
- Делать визитные карточки.
- Создавать миниатюры для Ютуба.
- Резюме.
- Фото коллажи.
- Буклеты.
- Фон на рабочий стол.
- Изготовить баннер на свой блог.
- Обложки для книг.
- Сертификаты.
- Обложки на диски.
И это еще не весь список возможностей сервиса.
Теперь же перейдем к созданию бесплатного баннера.
Шаг №1.
Первым делом проходим регистрацию в проекте. Для этого посетите главную страницу сервиса. Выберите для чего нужны функции этого сайта. Это своеобразный опрос.
Далее выберите как желаете зарегистрироваться через почту, Google или Facebook.
В дальнейшем вход можно осуществлять через Фейсбук или Google. После регистрации через эмейл придет письмо со ссылкой. Нужно будет перейти по ней для подтверждения своего профиля.
Шаг №2.
Находясь внутри своего профиля на главной странице определитесь с размером или просто выберите то что нужно.
Или просто прописываем нужные параметры. Размеры идут в пикселях, сантиметрах и миллиметрах.
После нажатия на кнопку “Создать дизайн” произойдет перемещение во внутрь аккаунта.
Проект предлагает взять готовый дизайн баннеров. Нам остается лишь поменять текст. Но можно и придумать свой с нуля. Так же имеется возможность загрузить свое изображение.
Для примера я использую уже готовое фоновое изображение. Нажимаю фон и выходят разнообразные картинки. Кликаем левой клавишей мыши на понравившуюся. На некоторых иллюстрация будет защита. Чтобы ее снять придется немного доплатить.
Шаг №3.
Теперь перемещаемся в меню текст и собственно его прописываем. Можно выбрать шаблонный или стандартный.
Иногда требуется на изображение нанести дополнительную картинку. В проекте “Канва” такая возможность есть. Для этого перейдите в меню элементы и выберите нужны. Чтобы ускорить поиск в строке “Найти” пропишите что надо.
Соглашусь что у меня не получился не очень хороший баннер, но для примера думаю пойдет.
Теперь добавляем ссылку. Для этого обращаем внимание на правый верхний угол. Она привязывается к тексту. Поэтому лучше написать призыв к действию.
Алгоритм привязывания ссылки:
- Кликаем на текст.
- Нажимаем на многоточие в верхнем правом углу.
- Выбираем символ ссылки.
- Выполняем ее вставку.
- Жмем применить!
Остается выполнить сохранение баннера. Для этого переходим в раздел “Опубликовать”.
Вариантов в данном меню масса, вплоть до вставки кода. Выберите нужный вам. После нажатия кнопки “Скачать” предлагается выбрать формат и прозрачность фона.
Сколько стоит сделать баннер для сайта?
Пользуясь данными сервисами вы можете самостоятельно изготовить графические объявления бесплатно. Но не у каждого имеется время и талант. Поэтому баннеры можно заказать на бирже фриланса. Расценки у каждого исполнителя свои, но на пример на бирже Kwork можно заказать пачку баннеров за 500 рублей!
Как сделать баннер кликабельным для сайта?
На проекте Canva вставить ссылку достаточно просто. Но как быть если изготовили картинку со всеми надписями и без ссылки?
В этом случае поможет следующий код:
Надписи в коде заменяете на свои и пользуетесь на здоровье.
На этом моя статья на тему как сделать баннер на сайт онлайн, подошла к концу! Я надеюсь информация была полезной. Пусть созданные творения принесут радость не только вам, но и тем кто будет по ним кликать! Удачи и всего доброго!
Читайте так же:
Источник: webmixnet.ru
Как сделать свой баннер бесплатно
В интернете существует большое количество уроков, обучающих созданию баннеров, однако часто в них требуются углубленные знания различных емких программ, достаточно сложных для начинающего web-мастера. Если же вы хотите сделать красочный баннер быстро и несложным способом, вам поможет в этом стандартный графический редактор Paint, который входит в сборку ОС Windows.
Статьи по теме:
- Как сделать свой баннер бесплатно
- Что такое баннер
- Как сделать превью картинки
- Как сделать растягивающийся сайт
Вам понадобится
- стандартная программа Paint, программа Gif Animator
Инструкция
На панели «Пуск» выберите пункт «Все программы», затем «Стандартные». Кликните программу Paint, чтобы она открылась.
Чтобы баннер получился интересным и эффектным, вы можете заранее скачать несколько вариантов изображений по нужной для вас теме. Выберите наиболее подходящую из них, которая будет представлять рекламу вашей продукции или услуги.
Чтобы загрузить выбранную картинку в редактор Paint, нажмите на значок в левом верхнем углу, затем выберите пункт «Открыть».
В открывшейся вкладке обзора файлов найдите выбранное изображение, выделите его и нажмите «Открыть» (или просто дважды кликните по нему).
Выделите главный информационный элемент вашего изображения: «Изображение» — «Выделить» — «Прямоугольная область» (или с помощью курсора).
Задайте выделенному элементу нужную форму, двигая квадратики выделения курсором. Например, вы можете немного сдвинуть изображение вправо, чтобы освободить свободное пространство для надписи с левой стороны будущего баннера.
Чтобы обрезать выделенную область, нажмите «Изображение» — «Обрезать».
Измените размер изображения: «Изображение» — «Изменить размер».
В окне изменения размера задайте нужный размер в пикселях в ширину и в высоту. Для задания произвольных параметров уберите галочку напротив пункта «Сохранять пропорции».
Нажмите на на значок в левом верхнем углу — «Сохранить как» — «Изображение в формате GIF».
В открывшемся окне в строке «Тип файла» будет установлен формат GIF (*gif). Задайте имя файла и сохраните его, нажав «Сохранить».
Чтобы вставить на баннер текстовую информацию, активизируйте инструмент «Текст».
На панели инструмента ввода текста выберите нужные размер, шрифт, цвет, тип и расположение шрифта. Растяните рамку для ввода текста на нужные длину и ширину и введите текст.
Можно добавить на баннер какие-либо дополнительные элементы. Или, например, оформить его в рамочку: «Фигуры» — «Прямоугольник» — выбрать толщину и цвет рамки — курсором мыши растянуть рамку по краям изображения. Затем снова сохраните файл, но под другим именем.
Теперь нужно создать еще один файл с другим текстом. Откройте первый сохраненный файл (без текстовой информации) и нанесите на него новый текст и прочие элементы описанным выше образом. Как вариант, просто сотрите ластиком предыдущий текст, чтобы внести новый (если фон белый). Если фон другого цвета, кликните его пипеткой и закрасьте этим цветом текст. Готовый баннер сохраните, как описано выше.
Итак, у вас есть под рукой два одинаковых файла с разным текстом. Это будут два слоя, которые нужно объединить, чтобы текст баннера постоянно изменялся. Эту операцию можно легко сделать в небольшой программе для создания анимированных GIF’ов MS GIF Animator.
Установив программу на компьютер, откройте ее двойным кликом.
В панели инструментов Gif Animator нажмите значок Open/«Открыть» (или Ctrl+O), в поле «Папка» выберите свою папку с созданными GIF-файлами. Затем двойным щелчком мыши выберите файл, который станет вторым слоем вашего баннера, чтобы другой файл (первый слой) лег сверху, т.к. в этой программе анимация создается в обратном порядке.
Откройте первый слой инструментом добавления Insert/«+» (или Ctrl+I).
Сгруппируйте слои инструментом Select All/«Выделить все» (или Ctrl+L) .
Перейдите во вкладку Animation и поставьте галочку напротив пунктов Repeat forever («Всегда повторять») и Looping («Выполнение цикла»).
Во вкладке Image установите скорость кадров — к примеру, 1/80, оптимально.
Нажмите инструмент Preview (или Ctrl+R), чтобы просмотреть результат.
Сохраните баннер с помощью инструмента сохранения Save (или Ctrl+S). Ваш баннер готов, теперь его можно размещать.
Обратите внимание
Чтобы избежать большого веса баннера, лучше ограничиться 2-4 слоями.
Полезный совет
Анимация текста происходит способом замены слоев, поэтому аналогичные действия можно применить и к основному фону.
- Как сделать баннер онлайн бесплатно
Совет полезен?
Статьи по теме:
- Как загрузить баннер на сайт
- Как сделать анимированную иконку
- Как сделать листовку, баннер, флаер или визитку в фотошопе
Добавить комментарий к статье
Похожие советы
- Как сделать баннер кликабельным
- Размеры баннеров: какой выбрать?
- Как создать инфографику
Источник: www.kakprosto.ru
15 дизайнерских приемов — как сделать баннер, за который не будет стыдно
Сегодня мы рассмотрим 15 дизайнерских приемов для создания баннеров, за которые не будет стыдно. Для примеров мы взяли победителей 2015 года по версии Webby Awards.
В интернете много шумихи по поводу баннеров. Они уже отжили свое? Кликает ли кто нибудь на них? Может, они уже мертвы? А вдруг появилась лучшая альтернатива баннерам? И хотя правда то, что по баннерам стали меньше кликать, это еще не конец популярного рекламного формата.
Даже если вы не можете измерить эффективность рекламы, вы не будете возражать, что она все равно влияет на выбор пользователя в пользу того или иного продукта или сервиса. Сегодня мы рассмотрим 15 дизайнерских приемов для создания баннеров, за которые не будет стыдно. Для примеров мы взяли победителей 2015 года по версии Webby Awards.
1. Придерживайтесь стандартных размеров
Баннерная реклама не относится к типу продукта один «размер для всего». Вы должны исходить из тех спецификаций, которые нужны для ресурса, на котором вы планируете размещать рекламу, а большинство сайтов используют набор стандартных размеров. (Это также касается и email-рассылок) На Google Adwords, одном из крупнейших серверов баннерной рекламы в интернете, можно узнать про наиболее популярные размеры. Ниже размеры, которые вы должны выбрать в первую очередь:
- 728×90 px — полноразмерный баннер (часто показывается вверху или внизу страницы)
- 300×250 px — встроенный прямоугольник (преимущественно показывается в правой части сайта или вставляется в текст)
- 300×600 px — блок на половину страницы
- 320×100 px — мобильный баннер
2. Придерживайтесь последовательности
Каждый баннер должен содержать в себе три элемента: брендинг (логотип), сообщение и поощрение для клика. Загвоздка в том, что у вас не сильно много места для всего этого.
Создайте простую последовательность элементов. Сообщение должно быть кратким — от двух до 10 слов в идеале. Что вы предлагаете и почему люди должны этого хотеть. После этого добавьте логотип или какой-то другой идентификатор. Он должен быть читабельным и не слишком большим.
В заключение добавьте причину для клика. Может, у вас сейчас распродажа? Код купона? Подписка на почту?
Каждая из этих составляющих должна быть композиционно размещена согласно базовым принципам дизайна по размеру, пространству, весу и цвету, чтобы вести внимание пользователя от элемента к элементу.
3. Один баннер равняется одному сообщению
Рекламные баннеры не должны быть нескончаемой каруселью сообщений. И, хотя вы можете использовать приемы типа анимированных гифок, чтобы показывать по несколько сообщений в одном баннере, это не всегда лучшее решение.
Сначала начните из концепции, которая работает, как статичная картинка. И только потом вы можете попробовать добавить фишки или дополнительную функциональность. Движущиеся элементы не должны быть единственной вещью, которую видят люди. Ваше сообщение, посыл должны быть самыми главными на экране.
4. Помните о том, где будет размещен баннер
Где вы планируете размещать баннеры после того, как сделаете сам креатив? Если вы используете сервисы подобные Google, у вас будет не сильно много возможностей контролировать размещение. Но если вы хотите разместить их на определенных вебсайтах, в приложениях или email рассылках, вам нужно будет изучить их и принять во внимание их дизайн, прежде чем делать свои баннеры.
Используйте цвета, которые сильно контрастируют с дизайном и фоном площадки. Это поможет вам выделиться на общем фоне. Берите четкие цвета и шрифты, которые хорошо читаются. Даже если тематика вашего баннера пересекается с продуктовой линейкой сайта, на котором размещена реклама, выбирайте сильные, кардинально отличающиеся визуальные решения — для того, чтобы вызвать максимальную реакцию.
5. Используйте призыв к действию
Какая самая главная задача баннера? Правильно — на него должны кликнуть. Используйте призыв к действию (Call to Action) в каждом баннере, который вы делаете. Подскажите пользователю, что ему нужно делать дальше.
Пользователь может подписаться на список рассылки, перейти на сайт, получить скидку и т.д. Но вы должны убедить его сделать это. В таких случаях отлично срабатывает прямая инструкция, в лоб — ведь люди не хотят много думать.
6. Забудьте про Flash
Сейчас об этом можно уже даже и не говорить, но все равно, на всякий случай — не позволяйте никому уговорить вас на создание флешовых баннеров. Вы тратите время, усилия и деньги.
Используйте вместо этого HTML5. Если вам нужно сконвертировать какие то свои старые креативы и вдохнуть в них новую жизнь, у Google есть небольшой урок, который поможет это сделать.
7. Используйте кнопки
Иногда бывает сложно воспринимать информацию — все мы когда-то с этим сталкивались. В таких случаях спасают простые инструкции. И хотя большинство пользователей знают, что они могут кликнуть на баннер, иногда наличие кнопки подталкивает их к этому действию. (Да, понятно, что кликабельна вся площадь баннера, но кнопка — это отличный визуальный сигнал).
Так что — вставляйте кнопки. Не нужно особо изощряться с их оформлением. Простые сообщения типа «купить сейчас» или «узнать больше» могут сделать очень многое для того, чтобы превратить просмотр баннера в клик и последующую конверсию.
8. Сфокусируйтесь на шрифтах
Чем меньше площадь, с которой вы работаете, тем важнее значение выбора шрифтов. Баннерная реклама в большинстве случаев очень ограничена в размерах и жестко конкурирует с другими элементами сайта. Так что используйте четкие шрифты, которые легко читать.
- Делайте большие заголовки. Используйте жирные, немного необычные или цветные шрифты, чтобы привлечь внимание пользователей.
- Отдавайте предпочтение шрифтам без засечек (sans serif). Вы можете использовать два размера или два начертания жирного — один для основного текста, а другой для кнопок или призыва к действию. Просто убедитесь, что они легко читаются.
9. Используйте простую анимацию
Одним из наибольших трендов в баннерной рекламе является простая анимация. Например, забавный персонаж, который пробегает через баннер, или милая девушка, которая кивнет или подморгнет вам с экрана.
Чего точно не надо делать, так это ярко-желтые или оранжевые мигающие экраны из баннеров прошлого. Вам не нужны светящиеся неоновые тексты, чтобы привлекать внимание пользователей.