Как делать  анимированные баннеры.

Приветствую вас, уважаемые читатели блога Vorabota.ru! Если в сети встречается сайт или блог, на котором нет рекламы, у многих (особенно начинающих Web мастеров, которые решили создать самостоятельно сайт) возникает закономерное подозрение. Подозрение не к ресурсу (сайту или блогу), а к его создателю. «На чем же он (создатель сайта) зарабатывает»?

Заниматься рассуждением, кто и как зарабатывает на своем сайте, в этом материале я не буду. Просто сейчас редко можно встретить сайт, на котором нет рекламного баннера. И «лить воду» на тему, что такое баннеры Баннер – преобладающий формат рекламы в интернете. Имеет вид графического изображения аналог рекламному модулю в прессе. Представляет собой статическое изображение в формате PNG или JPG, а также анимированное, в формате GIF., и какую они играют роль в заработке Web мастера, тоже не буду. «Баннеры были, есть и будут»! И пусть каждый самостоятельно решает, стоит ли ему устанавливать баннер на свой сайт или размещать его где-то еще, к примеру, в соц.сетях. В этом материале хочу просто поделиться с вами тем, как можно сделать баннер самостоятельно любому (если, конечно, это ему надо) пользователю.

Ведь для создания несложного баннера совсем не обязательно знать и уметь пользоваться какой-то «супер-программой» для работы с изображениями. Достаточно воспользоваться бесплатным онлайн сервисом на котором есть возможность быстро сделать несложный, но вполне привлекательный рекламный баннер. Даже тем, кто «дружит» с различными программами для работы с изображениями, «побаловаться» на таком онлайн сервисе будет не лишним. Возможно, и пригодиться.

Бесплатный онлайн сервис Banner Fans для создания баннеров.

Пожалуй, из большого количества бесплатных онлайн сервисов, на которых можно делать баннеры, этот ресурс (на мой взгляд) вполне достоин внимания. Из достоинств этого сервиса хочу отметить его приемлемую скорость и поддержку кириллицы (русский шрифт). И, чтобы на нем быстро освоиться, предлагаю пройти путь изготовления несложного баннера на примере. Не буду описывать каждую кнопку панели инструментов этого сервиса. Может получиться много «воды». А изучить все инструменты и функции этого сервиса в дальнейшем не должно составить труда.

Итак, переходим по ссылке на онлайн сервис Banner Fans. . Можете не регистрироваться. Регистрация нужна лишь в том случае, если вы собираетесь сохранять сделанные баннеры не только на свой компьютер, но и хранить на сервисе. В верхнем правом углу устанавливаем язык Russian. Хотя и «кривой», но будет вполне понятный перевод.

В верхней части рабочей области отражается окно макета баннера, а в нижней панель инструментов.

1. Макет:

- Размер баннера: 300 px – 50 px (размер моего баннера)

- Фоновый режим: градиент цвета

- Цвет градиентов: первый – 8a8aff, второй – 186EAE (если кликнуть по квадратику, можно выбрать цвет)

- Режим градиента: Круг 2.

- Нажимаем кнопку «Изменить баннер» в центре нижней части панели инструментов, чтобы увидеть результат изменений.

1-этап создания баннера

2. Текст:

- Ваш текст: Линия 1: «Бесплатные онлайн сервисы»

- Шрифт: Palatino Linotype Bold (чтобы выбрать кириллицу, нужно щелкнуть на название выбранного шрифта и в открывшемся окне, в верхнем правом углу выбрать Stock)

- Размер: 14 px

- Цвет: ffffff (оставил по умолчанию)

- Вращение: 0° (оставил по умолчанию)

- Нажимаем кнопку «Изменить баннер»

2-этап создания баннера

- Выравниваем текст: наводим курсор мышки на строку текста > захватываем крестиком строку нажатием правой кнопки мыши и делаем перемещение

3-этап создания баннера

- Нажимаем кнопку «Изменить баннер»

4-этап создания баннера

3. Воздействие:

Тень • Расстояние • Цвет • Яркость • Текст плана •Наброски цветов

Эти эффекты назначаются для каждой линии текста отдельно.

Линия 1: В данном примере оставил без изменений по умолчанию

Линия 2: Проделываю тот же путь (пункты 2 и 3), манипулируя шрифтом.

4. Пограничная:

- Выбор стиля границ: (если простым языком, то это – рамка баннера) В данном примере оставил None по умолчанию.

5. После завершения редактирования перехожу на вкладку Формат - Выбираю нужный мне формат PNG (можно выбрать JPG или GIF) и сохраняю к себе на компьютер, нажав на «Скачать баннер».

Для пользователей и начинающих Web мастеров, которые «далеки» от HTML языка программирования, есть удобная функция:

- Получить код

Получить код

В верхней части открывшегося окна заменяете адрес онлайн сервиса на ссылку нужной вам страницы и обновляете код. Очень удобная функция, особенно для тех, кто размещает свои реферальные ссылки на различных досках объявлений, форумах и соц.сетях. Скопировали нужный вам вариант кода и вставляйте там, где поддерживается функция HTML. В своем примере я вставил ссылку на страницу группы «Найди свой бесплатный онлайн сервис».

Найди свой бесплатный онлайн сервис

На странице группы, как и в моем блоге, можно задавать вопросы и делать предложения. А вступившие в группу могут публиковать свои материалы о бесплатных онлан сервисах. На этом примере видно, как, используя бесплатный онлайн сервис Banner Fans, я сделал простенький баннер. Как говорится, «Все гениальное просто, зачем изобретать велосипед». Но многие согласятся с тем, что динамические баннеры намного эффективнее выполняют рекламную роль. И для того чтобы этот баннер анимировать, заставить «дрыгаться», перейдем на другой не менее полезный бесплатный онлан сервис gifovina.

Анимируем баннер на онлайн сервисе Gifovina

Для того чтобы анимировать изображение, в нашем случае баннер, достаточно всего два файла с разными картинками. Но для примера, я подготовил несколько изображений в сервисе Banner Fans, предварительно сохранив их в формате GIF (это для того чтобы полученный в дальнейшем анимированный баннер имел небольшой вес). Итак, для создания анимированного баннера переходим на сервис gifovina

Так же, как и на онлайн сервисе Banner Fans, регистрироваться не обязательно. На этом ресурсе сможет разобраться даже ребенок. Загружайте заранее подготовленные файлы. Делайте несложные настройки и нажимайте кнопку «Готово». Если вас не устраивает результат, можно вернуться обратно для редактирования закрыв окно. Если все вас устраивает можете скачать себе на компьютер или поделиться ссылкой.

Из моих заранее подготовленных изображений получилась вот такая «штукенция».

Найди свой бесплатный онлайн сервис

Вот так, уважаемые читатели, используя два абсолютно бесплатных онлайн сервиса, можно делать баннеры без особых знаний графических программ.

На этом хочу закончить показывать свои «художества» и надеюсь увидеть от вас комментарии. Также предлагаю подписаться на обновления блога (чтобы не пропустить, что-нибудь интересненькое) и присоединиться к группе «Найди свой бесплатный онлайн сервис».

Желаю всем удачи и творческих успехов в изготовлении собственных рекламных баннеров. До новых встреч на страницах блога Vorabota.ru

 

Получайте новости блога VoRabota.ru

Вас это может заинтересовать:

Кнопки для сайта в онлайн генераторах Сooltext и Dabuttonfactory

Создание кнопки для сайта в онлайн генераторах…

Чтобы сделать красивые кнопки для своего сайта, совсем необязательно знать сложные графические программы. Есть удобные сервисы, где процесс создания кнопок упрощен до…
Kak skachat video s saita

Как скачивать видео с Ютуб, ВК, Одноклассников и…

Вы решили скачать понравившийся видеоролик из интернета к себе на компьютер? Без проблем! Достаточно воспользоваться простым в использовании и удобным сервисом для…
Как сделать свой новый курсор для мыши.

Как сделать новый курсор для мыши [изменить его…

Удобство использования оригинального курсора мышки на компьютере или сайте каждый может оценить сам. Его можно сделать самому, применив немного фантазии. К примеру, из…
Иконка для сайта, как сделать иконку Favicon

Иконка для сайта или как сделать Favicon ico…

Фавикон – это небольшая картинка, которая появляется в Яндексе при выдаче результатов поиска. Она привлекает внимание к сайту и провоцирует пользователей переходить…
Проверка изображений на уникальность

Проверка изображений на уникальность онлайн…

Не секрет, что уникальными должны быть не только тексты, но и изображения. Иначе поисковые роботы будут плохо относиться к вашему сайту. Есть очень удобный онлайн…

Комментарии  

Promoman
# 0 Promoman
Думаю, что баннеры лучше все таки делать во Flash. Гиф анимация очень тяжеловесна и не может обеспечить высокого качества анимации.
Ответить Ответить с цитатой Цитировать
Лена
# 0 Лена
Flash-то Flash... достоинств у него много. Но вот меня, например, "достали" постоянные просьбы Flash-плеера об установке обновлений. Недавно я его все-таки удалила. Теперь, вместо баннеров на Flash, я вижу аккуратные и вполне симпатичные серые окошки ;-)
Ответить Ответить с цитатой Цитировать
ольга
# 0 ольга
Вот это хорошее предложение! Спасибо за этот онлайн - сервис. В будущем пригодиться я думаю.
Ответить Ответить с цитатой Цитировать
Инна
# 0 Инна
Хорошая полезная статья.
Хотела сделать баннер давно, но с на скока не разобрала все тонкости.
Теперь с вашей подсказки думаю довести дело до конца.
Спасибо.
Ответить Ответить с цитатой Цитировать
LadyLama
# 0 LadyLama
Хорошая статья! Очень пригодилась сегодня! Срочно понадобился баннер 100х100, а почти все бесплатные сервисы предлагают прямоугольные... Такая удача! Благодарю!
Ответить Ответить с цитатой Цитировать
Слава
# 0 Слава
Спасибо, пригодится! Практика показывает, что по статичным баннерам почти не кликают. А рекламодатели почему-то предлагают именно их. Попробую что-нибудь смастрячить, может, лучше будет))
Ответить Ответить с цитатой Цитировать
НАТАЛЬЯ
# 0 НАТАЛЬЯ
ДОБРЫЙ ВЕЧЕР!У МЕНЯ ВМЕСТО БУКВ ПОЛУЧИЛИСЬ ПРЯМОУГОЛЬНИКИ,ПОЧЕМУ?
Ответить Ответить с цитатой Цитировать

Добавить комментарий

©2011-Vorabota.ru - Заметки о бесплатных программах и онлайн сервисах для пользователей и начинающих Web мастеров.