Совет 1: Как сделать анимированный баннер

Яркая и привлекательная визуальная реклама в интернете – залог того, что ваш товар или вашу услугу заметят и оценят по достоинству. Качественный и красивый баннер необходим, если вы хотите эффективно продвигать свои услуги и сайты в сети – размещать баннер вы сможете на любом ресурсе, как платно, так и бесплатно, и сделать такой баннер совсем не трудно, если у вас есть Adobe Photoshop. Анимированный баннер смотрится гораздо интереснее статичного, и для анимации готового изображения вы можете использовать простую программу Ulead Gif Animator.
Инструкция
1
Откройте Adobe Photoshop и определите размер будущего баннера – например, вы можете сделать баннер стандартного формата 468х60 пикселей. Подберите подходящие изображения или логотипы, которые вы включите в баннер, цвета и шрифты.
2
Определите, что именно вы напишете на баннере, и какие его элементы будут анимированными. Создайте новый документ нужного размера с прозрачной или белой заливкой, а затем разместите на поверхности нового файла выбранные вами изображения и иллюстрации, помещая каждый графический элемент на новый слой. Окружите баннер тонкой рамкой. Таким образом создайте один из кадров будущей анимации.
3
Теперь сделайте слои первого кадра невидимыми, кликнув на каждом из слоев на значок с глазом и приступайте к созданию второго кадра. Сделайте нужное количество кадров, на каждом из которых будет меняться местоположение графических элементов, а также текст. К примеру, в первый кадр вы можете включить первую часть рекламного текста, а во второй – вторую часть.
4
В последний кадр включите адрес сайта и контактную информацию. Распределите кадры по слоям, а затем, скрывая ненужные слои для каждого конкретного кадра, сохраните их поочередно в формате GIF в отдельную папку. К примеру, в качестве первого кадра сохраните фон баннера, в качестве второго – фон с логотипом, в качестве третьего – логотип с подписью и так далее. У вас может получиться пять или более кадров – из всех этих изображений в формате GIF вы должны собрать несложную анимацию.
5
Для этого откройте программу Ulead GIF Animator и выберите опцию «Мастер анимации». Укажите размер вашего баннера и в следующем шаге загрузите в программу все созданные вами кадры, нажав кнопку «Добавить изображение».
6
Установите подходящую скорость смены кадров и время задержки каждого из них, а затем установите порядок появления кадров в анимации. При необходимости продублируйте некоторые кадры, создав копии.
7
Нажмите кнопку предпросмотра, чтобы посмотреть, как готовая анимация будет выглядеть в сети. Если вас все устраивает, сохраните баннер в формате GIF и опубликуйте его в сети.

Совет 2: Как сделать анимированный гиф

Анимированные файлы в формате gif чаще всего используются в баннерах. Баннер это небольшое изображение, содержащее рекламную информацию и ссылку на рекламируемую страницу. Они просто необходимы для продвижения собственного сайта, для этого разместите их на сайтах друзей. Баннер можно сделать и самому.
Вам понадобится
  • - компьютер с доступом в интернет;
  • - Adobe Photoshop;
  • - Ulead GIF Animator.
Инструкция
1
Подготовьте кадры для баннера, чтобы создать анимацию в формате gif. Используйте для этого программу Adobe Photoshop. Определитесь, какого размера должна быть ваша анимация, и с тем, какой сценарий будет у баннера, что будет в нем двигаться и как. Продумайте проект, прежде чем создать анимированный гиф.
2
Запустите программу Adobe Photoshop, создайте новый файл с размерами 468 на 60. Добавьте необходимую графику, разместите всю информацию в видимой части файла, выровняйте. Каждый элемент изображения расположите на отдельном слое. Слои, в свою очередь, группируйте в папки для удобства. После создания кадров, сделайте кадры, которые предстоит анимировать.
3
Скройте все слои, кроме нижнего, сохраните фон баннера в формате gif. Далее сохраните файл с логотипом (аналогично сделайте все остальные слои невидимыми). И так поступите со всеми слоями последовательно. В результате вы получите 5 статических гиф-файлов, из которых нужно будет смонтировать анимированный файл в формате gif.
4
Запустите программу Ulead GIF Animator, чтобы создать анимированный gif-баннер. Запустите «Мастер анимации» (из меню Файл). Выберите необходимый размер баннера, нажмите «Далее». В следующем шаге добавьте созданные ранее кадры будущей анимации. Нажмите кнопку «Добавить изображение», зажмите Shift, выделите все нужные файлы за один раз, добавьте их в мастер. Выберите необходимую скорость, с которой будут сменяться кадры. Нажмите «Далее». Работа Мастера закончена.
5
Установите кадры в необходимой последовательности, выставьте время задержки для каждого кадра, выберите его свойства, вызывая контекстное меню на нем. Измените время показа баннера, щелкните по кадру, в верхнем поле впишите время. Сделайте предварительный просмотр будущего файла, для того выберите вкладку «Предосмотр». Сохраните файл в формате GIF.
Видео по теме

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

Анимированные баннеры активно применяются в веб-дизайне, так как они способны не только дать пользователю больше информации, но и привлечь внимание. Существует несколько способов создания таких изображений.
Инструкция
1
Для создания анимированного баннера вам потребуется один из графических редакторов. Есть два пути решения задачи. Первый – использование программы для создания каждого кадра баннера в виде отдельного графического файла с последующим их объединением в один. Второй – работа в графическом редакторе, позволяющем сразу создавать анимированные изображения.
2
Если вы выбираете первый вариант, вам потребуется простой графический редактор, например, Paint или GIMP, однако вы можете использовать и любой другой, который для вас удобен.
3
Запустите программу и создайте новый файл с необходимыми значениями ширины и высоты. Нарисуйте, напишите текст или вставьте картинку, это будет являться первым кадром будущего анимированного баннера. Далее сохраните этот файл в формате .gif, после чего подобным же образом создайте второй и последующие кадры. В результате у вас должно получиться количество gif-файлов, равное числу кадров будущего баннера.
4
Воспользуйтесь программой для склеивания нескольких изображений в один файл, например, Namo GIF Animator или любой другой. Также вы можете воспользоваться веб-сервисами, предлагающими такую возможность: http://www.picasion.com/ru, http://gifsun.org/ru, http://htmlweb.ru/gif-animator.
5
Если вы выбираете второй вариант, вам потребуется графический редактор, способный самостоятельно создавать анимированные файлы, например, Adobe Photoshop, Macromedia Flash и т.п.
6
Создайте новый файл в программе Photoshop. Укажите необходимые значения ширины и высоты. Далее создайте новый слой, для чего выберите в меню «Слои» –> «Новый» –> «Слой». Создайте столько слоев, чтобы их количество соответствовало желаемому числу кадров баннера. На каждом из слоев нарисуйте (или вставьте) необходимое изображение.
7
После этого выберите в меню «Окно» –> «Анимация». Укажите для каждого из кадров желаемое время задержки. Также вы можете просмотреть, как будет выглядеть будущий баннер. Сохраните полученный файл в формате .gif.
Видео по теме

Совет 4: Как сделать flash фоном

Flash – технология, позволяющая создавать анимационные файлы. С их помощью вы можете сделать рекламный баннер либо украсить свою веб-страницу с помощью флеш-элементов, например, вставить на сайт анимированный фон.
Вам понадобится
  • - компьютер с выходом в интернет;
  • - браузер;
  • - навыки работы с HTML.
Инструкция
1
Используйте простейшие анимации для украшения веб-страницы (файлы в формате gif), также вы можете добавить на нее файл, сделанный с помощью технологии flash. В первую очередь создайте анимированную картинку в формате gif, для этого воспользуйтесь программой Adobe Photoshop.
2
Также вы можете использовать уже созданные анимированные файлы, выложенные в интернет. Их можно применить в качестве фона для веб-страницы. Добавьте изображение как фоновое в код вашего сайта с использованием параметра Background. Для этого в теге Body сделайте ссылку на файл.
3
Вставьте флеш и прозрачный фон, для этого скачайте файл Swfobject.Js, в браузере перейдите по ссылке http://blog.deconcept.com/swfobject/swfobject.js. Сохраните его на компьютер. Подключите данный файл в html-код страницы. Для этого используйте тег скрипта, к примеру: < script type="text/javascript" src= «Введите путь к скачанному файлу» swfobject.js >< /script >.
4
Далее выполните вставку флеш в веб-страницу. Для этого используйте код < div id="flash" >< «Добавьте фоновое изображение, на случай, если у пользователя отключена поддержка плагинов» div >. В теге скрипта добавьте следующее: var fl = new SWFObject(«Вставьте ссылку на флеш-файл» , "movie", "209", "267", "6"); [B]fl.addParam("wmode", "opaque");[/B] (данный параметр позволяет сделать флеш фоном.
5
Выполняйте подключение тегов именно в такой последовательности, т.е. сначала «Див», и лишь потом скрипт. Данный способ позволяет от тега , а также выйти из ситуации, когда пользователь отключает отображение плагинов и скриптов, т.к. при использовании тега при наведении курсора на флеш-файл появляется надпись «Щелкните, чтобы активировать данный элемент управления». В нашем случае такое не появится.
6
Для того чтобы подстроить размер флеш-фона к браузеру, поэкспериментируйте с параметром "100%", "100%", "8" в теге скрипта. Также можно задать параметр min-width:1000px – для отображения в «Опере» и других браузерах, и для Internet Explorer –width: 1000px. Таким образом, вы можете добавить флеш в фон страницы.
Видео по теме
Поиск
Совет полезен?
Добавить комментарий к статье
Осталось символов: 500
к
Honor 6X Premium
новая премиальная версия
узнать больше