Как же Вас учить созданию баннеров без пояснения самого слова «баннер».
Баннером в Интернете называют изображение(графический файл в определенном формате) или блок текста.
Для чего же нужен баннер?С самим понятием «баннер» мы уже разобрались.
Теперь рассмотрим для чего он нам нужен и как его применить.
Баннер можно применить для привлечения посетителей на свой сайт и таким образом будет больше шансов продать какой-нибудь товар.
Представьте, что вы создали сайт, который продает один или несколько товаров(продающий сайт).
Если вы создали продающий сайт, он должен продавать, а для продажи нужны покупатели.
Покупателями должны быть посетители вашего сайта.
Но где же «взять» посетителей?
Посетителей можно привлечь разными способами.
Рассмотрим основные способы привлечения посетителей к себе на сайт.
Продвижение сайта в поисковых системах
Размещение графического баннера с переходом на свой сайт на других сайтах
Выше перечислены основные способы привлечения посетителей на свой сайт. Все эти способы дают хороший результат. Поскольку данная книга посвящена созданию баннеров, мы остановимся на третьем способе - размещении своего баннера на других сайтах.
Но старайтесь не писать ложную информацию, ведь вы создаете баннер не для обмана. Верно?
Если вы будете писать только правдивую информацию и вашими товарами будут довольны покупатели, они запомнят адрес вашего сайта и будут ждать новых товаров.
Таким образом, они будут вам доверять.
Теперь сами подумайте: нужно ли обманывать людей?
Думаю вы выбрали правильный ответ и стремитесь только к хорошему.
Что нужно писать в баннере?Допустим ваш сайт предоставляет интересные игры для компьютера. В этом случае можно написать так: «Только интересные игры для ПК».
Как видете я подчеркнул слово «интересные», поскольку это слово вызывает преимущество данного баннера перед другими, такими как: «Игры для ПК».
Рассмотрим другой случай. Допустим, на сегодняшний день вы хотите сделать подарок посетителям сайта. Подарок заключается в бесплатном расспространении популярной игры. Условие: покупка любой другой игры сегодня. Таким образом, при покупке любой игры сегодня, вторую игру посетитель получает бесплатно. Предположим игра называется «Fire». В таком случае можно написать так:
«Игра Fire бесплатно! Только сегодня! Спеши приобрести!»
Рассмотрим типы графических баннеров.
Графические баннеры могут быть статичными и анимированными.
Статичный баннер - это неанимированный графический баннер с гиперссылкой на другую веб-страницу.
Создается в разных графических форматах: bmp, png, gif, jpeg и др.
Статичный баннер проще создать, чем анимированный, но результата от него меньше.
Анимированный баннер - это анимация, которая состоит из отдельных кадров. Смена кадров происходит через заданое время.
Используются анимированные баннеры в формате GIF и FLASH.
GIF-анимированные баннеры способствуют хорошему результату в рекламе.
Причина проста! Если вы уже замечали, анимированные баннеры сложно не заметить на веб-странице.
Они могут мигать фоном, надписью и т. п.
Создать анимированный баннер сложнее, но результат от него будет гораздо лучшим.
О flash-анмированных баннерах более детальную информацию вы можете узнать из других источников.
Преимущества и недостатки.Статичный баннер имеет меньший размер файла, это способствует быстрой загрузки баннера.
Это можно отнести к преимуществу статичного баннера.
Недостаток статичного баннера заключается в меньшей результативности.
По статистике по графическим статичным баннерам меньше кликают, чем по анимированным.
Преимуществом анимированного баннера является его хорошая результативность.
Причину этого вы уже знаете!
Недостатком анимированного баннера является большой размер файла(по сравнению с статичным).
При нажатии на баннер пользователь может перейти на страницу подробного описания того, что рекламировалось.
Например, может быть баннер в виде обложки какого-то товара и при нажатии на него вы можете ознакомится с этим товаром более подробно.
Такими товарами могут быть электронные книги, программы, разные игры и т. п.
Переход на другую веб-страницу при нажатии на баннер осуществляется с помощью гиперссылки.
Например:
В данном примере, при нажатии на картинку с именем «banner.gif» осуществляется переход на страницу c именем «next.htm» , «next.htm»-это имя файла веб-страници, которая будет открываться.
Здесь я расскажу Вам, что такое баннер, а также про несколько способов, а вернее программ, для их создания.
Скачать исходники для статьи можно ниже
Баннер - графическое изображение рекламного характера.
Бывают 3-ри вида баннеров
Статичные баннеры – это одиночное графическое изображение, без движения, содержащие дополнительные элементы.
Анимированные,динамичные GIF баннеры – представляет собой последовательность растровых кадров, которые сменяют друг друга.
Flash баннеры или Java – создаются баннеры по программе Adobe Flash. В отличие от традиционных, использующих растровую графику, эти баннеры используют векторную графику, что позволяет делать анимационные эффекты при небольшом размере баннера. Кроме того, Flash-баннеры предоставляют возможность использования звуковых эффектов, что повышает эффективность баннера как рекламного носителя по сравнению с традиционным. Эффекты во Flash-баннере имеют намного более впечатляющий вид. Изнутри баннер строится по принципу слоев. На каждом из слоев может быть реализована независимая компьютерная анимация. Использование векторной графики дает возможность реализовывать в баннере целые мультипликационные сюжеты. Так же технология Flash предусматривает возможность создания интерактивного баннера.
Сегодня в сети появились генераторы баннеров причем среди них много бесплатных, которые позволяют создать баннер в интернете.
Но самые хорошие и красивые баннер конечно же создаются через программы, наиболее популярные Adobe Photoshop и Adobe Flash .
Начнем с программы Photoshop (для изучения этой программы и ее возможностей я посоветую вам изучить сайт с бесплатными уроками по нему http://www.photoshop-master.ru
Создание анимированного и флеш баннера через Онлайн генератор баннеров.
http://www.lact.ru/banner – онлайн мастерская анимационных баннеров (причем у этого ресурса есть еще интересные виджеты, посмотрите сами: http://www.lact.ru/poleznoe/interesnyie-vidzhetyi).
Очень большой функционал , много готовых шаблонов , которых можно отредактировать, русский интерфейс, и все бесплатно .
Здесь все просто, пройдемся по полям конструктора:
1-ое поле: выбор формата – длинное (горизонтальное) или боковое (квадратное или вертикальное).
2-ое поле: состоит из трех текстовых полей, здесь вы должны ввести текст и цвет этого текста, который будет находится на баннере.
3-е поле: это графическое поле, в нем можно поменять фон баннера, и картинки которые находятся на баннере.
4-е поле: музыка, здесь вы можете выбрать мелодии, которые будут играть при показе баннера или загрузить свои мелодии.
5-е поле: это размер баннера, здесь предлагается несколько вариантов или же можете вставить свой вариант.
7-е поле: это сам баннер, как он будет выглядеть, рядом стоит кнопка “Поехали”, на которую нужно нажимать, чтобы обновить баннер.
8-ое поле: код для вставки, нажимаем на кнопку ” Получить код” и в окошечке видим код, который нужно вставить на ваш сайт, ну например можете вставить этот код в Виджеты, для этого в панеле управления вашего сайта в левом меню выбираете “Внешний вид” потом “Виджеты”, потом находите виджет “Текст” переносите его в свой Сайдбар и вставляете в виджет код кнопки, нажимаете сохранить, все готово.
Есть на этом сайте множество готовых шаблонов, которые можно редактировать, для этого в верхнем меню выбираем: “Галерея примеров” и кликаем на понравившийся нам баннер и начинаем его редактировать.
Данный конструктор для создания баннеров можно поставить себе на сайт.
Создание анимационного баннера через Adobe Photoshop.
http://www.photoshop-master.ru/lessons.php?rub=8&id=309
http://www.photoshop-master.ru/lessons.php?rub=8&id=1412
по созданию следующего баннера:
Популярность любого сайта зависит от его раскрученности в интернете. Посещаемость определяется не только позициями в поисковых системах, но и рекламными кампаниями. Одним из самых популярных видов рекламы, зародившимся еще задолго до появления интернета, стал баннер – графический плакат с каким-то изображением. Всемирная паутина позаимствовала эту идею, и теперь баннеры часто встречаются на виртуальных просторах сети – веб-сайтах.
Баннер – один из самых распространенных видов рекламы, но для запуска рекламной компании его еще нужно создать. О том, как сделать обычный или анимированный баннер для сайта в режиме онлайн (с помощью сайтов-конструкторов) или с помощью программ, и пойдет речь в этой статье.
Баннер (англ. banner – знамя) – графическое изображение рекламного характера. В сфере Интернет баннер является особым форматом рекламы, содержащим гиперссылку на рекламируемый сайт.
Заблуждение – считать единственной задачей баннера привлечение пользователей. У баннерной рекламы есть и другая роль – сформировать узнаваемый бренд, создать ему положительный имидж. И отличным примером этого служат интернет-баннеры популярных операторов сотовой связи. Во многих видах рекламы используются их логотипы, которые активно раскручиваются рекламой. Но больший вклад в это дело вносят именно баннеры.
Использование баннеров очень полезно для рекламы каких-либо платных товаров или услуг, что поможет владельцу интернет-магазина .
1.1 Форматы баннеров
Прежде всего, возникает вопрос о геометрических размерах баннера. Ведь его размещение планируется на различных сайтах интернета. Вообще-то можно использовать любой размер на свое усмотрение, а затем находить площадки, которые согласятся такой баннер разместить. Однако стандартизация помогает в значительной мере упростить это дело. Например, многие веб-ресурсы изначально содержат статические области, предназначенные для баннерной рекламы (определенных размеров).
Чаще всего в интернете используются следующие стандартные размеры баннеров (сетка взята из рекламной кампании Google Adsense):
Примечание: размеры (горизонтальный Х вертикальный) указаны в пикселях (px).
Посмотреть, как выглядят баннеры данных форматов, можно .
1.2 Виды баннеров
Помимо формата следует учитывать и еще одну особенность. Баннер, по способу его реализации, относят к одному из трех видов:
- Статичный баннер – самый простой вариант. В этом случае баннер представляет собой одну статическую картинку (неменяющееся изображение). Преимущества – простота реализации, небольшой вес файла. Недостаток – минимум выразительности; такие баннеры, как правило, менее эффективные, нежели их другие виды.
- Анимированный баннер представляет собой несколько изображений, поочередно меняющихся во времени. Формат подобного файла – «.gif». Преимущества – высокая эффективность, неплохая выразительность. Недостаток – довольно большой вес баннера по сравнению с предыдущим вариантом.
- Флеш-баннер (Java-баннер) – самый сложный по степени реализации вариант. Создается по технологии Adobe Flash. Благодаря своим особенностям (использование векторной графики вместо растовой) значительно уменьшается объем файла, но появляются дополнительные возможности (звуковые эффекты, плавное изменение кадров и т.д.). Некоторые баннеры дают возможность совершать интерактивные действия (нажимать кнопки на баннере, играть в мини-игры и т.д.). А рекламная внутри и не видна пользователю. По сути, данный баннер представляет собой программу. Преимущества – высочайшая эффективность, отличная выразительность, небольшой размер файла. Недостаток – дополнительные требования к сайтам (необходима поддержка Java) и браузерам (может не работать на старых версиях браузеров, не поддерживающих Flash-анимацию).
2. Как сделать баннер онлайн
Одним из способов сделать анимированный баннер онлайн является сервис bannerfans.com. Его преимущество состоит в том, что функционал создания баннера превосходит аналогичные ресурсы. Есть возможность смены языка (русский поддерживается).
Прежде чем начинать создавать баннер, можно скачать несколько подходящих шаблонов, на основе которых и будет конструироваться макет. Дело в том, что очень сложно создавать красивые баннеры самостоятельно, не будучи web-дизайнером. А шаблоны вполне готовы к использованию, на них нужно будет лишь добавить текст (и, возможно, подредактировать цветовую гамму).
Несколько красивых шаблонов баннеров можно взять . А для работы в фотошопе можно воспользоваться этими .
С помощью данного сервиса можно создавать не только баннеры, а и логотипы, фавиконы и, возможно, собственные уникальные для сайта.
Теперь о том, как создать баннер для сайта с помощью Bannerfans . Делается это за 5 шагов.
2.1 Шаг первый: создание макета
Итак, сначала нужно перейти в онлайн-конструктор баннеров – вот ссылка . Переключив язык интерфейса на русский (правый верхний угол сайта), выберите закладку «Макет » (первая область на скрине ). Здесь создается фон для будущего баннера.
После этого необходимо выбрать размер изображения (свой, фиксированный или шаблонный). Если вы воспользуетесь шаблоном, то выбирайте первый пункт (вторая область ).
Теперь можно выбирать фон изображения (третья область ). Вы можете загрузить свое изображение, для чего нужно выбрать третий пункт. Если же шаблона у вас нет, выбирайте первый пункт (сплошной цвет) или второй (заливка градиентом). На скрине показан вариант с градиентом.
В четвертой области выбирается начальный цвет градиента и конечный.
В пятой области выбирается тип (режим) градиента.
2.2 Шаг второй: создание надписи
На этом этапе можно создавать до 6 различных надписей. Но сначала нужно перейти на вкладку «Текст ». На скрине ниже область разделена на семь частей.
Первая область – превью, где можно посмотреть, как будет выглядеть баннер. Эта область примечательна тем, что прямо на ней можно «двигать» надписи, меняя их положение на фоне. К недостатку сервиса по созданию баннеров следует отнести то, что все изменения, которые вы будете вносить, происходят не в онлайн-режиме (для этого приходится нажимать на кнопку «Изменить баннер »).
Вторая область – непосредственно надписи. Можно создавать до 6 различных вариантов. Но длину надписи следует делать такой, чтобы она поместилась на фоне баннера.
Третья область – выбор шрифта надписи. Тут следует быть осторожным – выбор огромен, но не все шрифты поддерживают кириллицу.
Четвертая область – размер шрифта.
Пятая область – цвет надписи. Доступен довольно большой выбор.
Шестая область – наклон надписи (относительно горизонтали).
Седьмая область – кнопка «изменить баннер». Используется для отображения внесенных изменений.
На этом этапе можно создавать эффекты, приводящие к появлению теней от надписей. Это помогает создавать баннеры более выразительными. Для начала нужно перейти на вкладку «Воздействие ».
Тень – выбор положения тени (справа, слева, сверху, снизу и т.д.)
Расстояние – удаленность тени от основной надписи.
Цвет – выбор цвета тени (по умолчанию выбран серый).
Яркость – выбор яркости тени.
Текст плана – выбор толщины рамки надписи (при создании, текст обводится дополнительным цветом, что делает надпись объемной).
Наброски цветов – выбор цвета рамки.
Этот этап очень простой. Здесь можно сделать при необходимости рамку для своего будущего баннера.
На скрине ниже показаны варианты рамки (отсутсвует, сплошная, пунктирная, двойная сплошная и двойная пунктирная).
Под рамками находятся другие настройки – цвет, размер, удаленность от границ фона и яркость линии.
2.5 Шаг пятый: сохранение баннера
Заключительный этап. Осталось только выбрать формат, в котором будет сохранено изображение, а затем скачать готовый баннер.
. PNG – формат, гарантирующий высокое качество изображения, но и размер его будет большим.
. GIF – самый «легкий» формат. Невысокое качество, но и малый размер файла.
. JPG – что-то среднее между двумя предыдущими вариантами.
3. Программы для создания баннера
Существует множество программ, позволяющих самостоятельно создать простенькие анимированные баннеры для сайта. Все их рассматривать смысла нет, но одну следует разобрать подробнее.
3.1 Easy GIF Animator
Очень удобной программой для создания баннеров является Easy GIF Animator, которую можно скачать бесплатно по этой ссылке (около 4 Мб). Хотя сама программа платная (стоимость около 30$), все же первые 20 запусков бесплатны (ознакомительные). Программа создает незамысловатые анимированные GIF-баннеры для сайта.
Установив программу и запустив ее, выберите пункт «Создать анимированный баннер ».
После этого появится окно для создания фонового изображения. Можно указать стандартный размер баннера из предложенных программой, а можно указать нестандартный – свой собственный (благодаря чему можно даже создать свой анимированный ). Также есть возможность определить размеры шаблона баннера для его дальнейшей обработки.
В следующем окне определяются параметры цветовой гаммы баннера. Можно загрузить свой шаблон, а можно выбрать простой цвет или градиент.
Далее идет окно создания надписей. Тексты (не более 3 штук) будут следовать один за другим с выбранной задержкой. Для надписи можно выбрать шрифт, размер и цвет. Также указывается выравнивание и эффекты появления/исчезания текстов.
Это последний шаг создания анимированного баннера для сайта с помощью данной программы. Баннер, конечно, получается простенький, но для начала и это подойдет. Вот, что может получиться в итоге:
3.2 Другие программы для создания баннеров
- Banner Maker Pro – еще одна небольшая программа (около 6 Мб), которая дает возможность создавать анимированные несложные баннеры, мини-логотипы или кнопки. Очень проста и удобна в использовании, но ее возможности ограничены.