Совет 1: Как создать gif баннер

Популярным средством рекламы для продвижения сайта в сети интернет являются баннеры – небольшие графические изображения с элементами анимации, которые обеспечивают переход на сайт рекламодателя или страницу с дополнительной информацией.
Вам понадобится
  • - графический редактор;
  • - GIF аниматор.
Инструкция
1
Создайте новый файл для рисунка в графическом редакторе: “Файл”→”Новый”.
2
Установите параметры изображения: размер, разрешение и цветовой режим.
3
Разместите изображение в открывшемся слое, установите цвет фона, введите текст. При размещении текста автоматически создается отдельный слой.
4
Измените положение слоя на фрагменте, выбрав нужный слой и удерживая нажатой левую клавишу мыши. Сделайте верхний слой активным, кликнув по нем на панели слоев в правой части экрана левой клавишей мыши.
5
Слейте воедино активный слой с нижним: “Слой”→”Слить с нижним”.
6
Создайте еще два кадра по аналогичной схеме.
7
Сохраните полученные изображения: “Файл”→”Сохранить для Web”. Чтобы правильно сохранить кадры, активируйте один слой, оставляя остальные невидимыми. Затем, по аналогичной схеме, сохраните оставшиеся слои. Установите для файлов необходимые настройки в меню Settings.
8
Последовательно склейте кадры баннера в GIF аниматоре. Для этой цели воспользуйтесь, например, программой Ulead GIF Animator 5.0. Откройте вкладку “Файл”→”Мастер анимации”.
9
Пропишите размеры баннера в открывшейся форме и загрузите сохраненные рисунки баннера кнопкой “Добавить изображение”. Чтобы задать период чередования кадров во фрейме, выставьте временную задержку.
10
Выберите в редакторе закладку Optimize и оптимизируйте изображение. Выставьте необходимое количество цветов и сохраните готовый баннер.

Совет 2: Как бесплатно создать баннер для сайта

Нередко вебмастера для привлечения посетителей на свой ресурс либо в целях рекламы какой-либо услуги или товара применяют систему баннеров. И для того чтобы ею воспользоваться, не обязательно обращаться в специальные интернет-фирмы, занимающиеся созданием рекламных материалов.
Вам понадобится
  • - Adobe Photoshop.
Инструкция
1
Чтобы создать баннер собственноручно, загрузите и установите любую версию Adobe Photoshop. Затем запустите установленный графический редактор. Создайте новый файл и задайте ему будущие размеры. Они зависят от ориентации баннера: горизонтальной или вертикальной. Затем придайте новому файлу фон. Для этого воспользуйтесь инструментом «Заливка» или «Градиент», также возможна установка определенной текстуры, загруженной из интернета. После настройки фона воспользуйтесь инструментом «Текст». Впишите необходимую информацию в текстовое поле, задайте ей определенный стиль, шрифт, цвет и т.д.
2
Выбирая между простым и анимированным баннером, выбирайте второй вариант. Он привлекает намного больше внимания. Чтобы создать анимированный эффект, выберите опцию «Окно» и нажмите на кнопку «Анимация» в выпадающем меню. Меняйте с помощью раскадровки длительность кадров по очереди. Самым лучшим количеством кадров будет восемь-десять дублей. После того как вы определитесь с количеством слайдов анимации, переходите к настройкам второго кадра.
3
Чтобы менять структуру текста в процессе анимации, нажмите на баннер правой кнопкой мыши, выберите опцию «Деформировать текст» или же любой другой инструмент на ваше усмотрение. Затем переходите к настройкам третьего кадра и т.д. Чтобы сделать анимацию немного интересней, меняйте степень изгиба линий, их толщину, размер текста, добавляйте эффект свечения и т.д.. Только когда вы отредактировали все кадры и создали анимацию, нажмите на кнопку «Запуск воспроизведения анимации» и внимательно изучите полученный результат.
4
Чтобы воспользоваться баннером на веб-сайте, необходимо сконвертировать его в Web-формат. Затем сохраните файл в GIF. После этого данный графический файл разместите на необходимые веб-ресурсы, не забыв присвоить ссылку изображению для того, чтобы при клике на него происходил переход на рекламируемый материал.

Совет 3: Как сделать мигающий баннер

Анимированный баннер – одно из основных средств продвижения интернет-рекламы. В большинстве случаев баннеры размещаются на сайтах сторонних компаний, при нажатии на них реализуется переход на рекламируемый ресурс. Изготовление простого мигающего баннера, состоящего из трех-четырех фреймов, занимает несколько минут.
Вам понадобится
  • - установить на свой компьютер программу Adobe Photoshop.
Инструкция
1
Создайте в Adobe Photoshop новый документ заданной ширины и высоты (File-New). Наиболее распространены баннеры, имеющие следующие размеры в пикселях: 468х60, 125х125, 120х90, 100х100, 120х60, 88х31. Установите в полях Width и Height значения 100. Откройте в Adobe Photoshop любую картинку, например, аватарку, и скопируйте ее изображение на ваш документ. Таким образом, первый кадр вашего баннера создан.
2
Нажав вместе клавиши Ctrl и J, создайте второй слой вашего документа. Включите отображение второго слоя и отключите отображение первого нажатием глазика напротив соответствующего слоя. Нажмите комбинацию клавиш Ctrl и L и, двигая ползунки, затемните второй слой.
3
Создайте из полученных двух кадров анимированную картинку. Для этого откройте анимационное окно (Window-Animation). В нем высветится полностью все ваше изображение, состоящее из двух кадров, которое будет совпадать с затемненным кадром. Установите для него время показа, например, 0,5 с. С помощью «глазика» выберите первый слой и отключите второй. Нажмите кнопку Duplicates selected frames на вкладке Animation (Frames). Второй кадр появится в анимационном окне. Выберите для него время показа 0,2 с.
4
Сохраните полученный файл в формате GIF (File-Save for Web and Devices…). Выберите необходимые значения из списка Preset для определения качества изображения. Учитывайте, что в режиме No Dither изображению придается мягкость в нечетких линиях.
5
Проверьте, как мигает ваш баннер при нажатии кнопки Play Animation. При необходимости перед сохранением анимационной картинки отрегулируйте время показа каждого кадра.
Обратите внимание
Сохраняйте баннер только в формате gif. При его сохранении в любом другом формате эффект анимации не будет достигнут.
Полезный совет
Для уменьшения размера баннера при его сохранении на вкладке Optimized выбирайте режим GIF32 или GIF64, которые позволяют уменьшить размер при небольшой потере качества.
Видео по теме
Обратите внимание
Проследите за тем, чтобы размер готового к размещению оптимизированного изображения средних размеров не превышал 15 Kb – это уменьшит скорость загрузки Web - страниц. Таблицы стандартных размеров для GIF- анимации отыщите в интернете.
Полезный совет
До начала разработки представьте максимально подробно внешний вид, цветовую гамму и движение элементов баннера. Это значительно ускорит прорисовку кадров.
Поиск
Совет полезен?
Добавить комментарий к статье
Осталось символов: 500
к
Honor 6X Premium
новая премиальная версия
узнать больше