Сервис для
сео - оптимизаторов

Найди ошибки на сайте
Ошибки мешают продвижению сайта
Исправь ошибки на сайте
Сайт без ошибок продвигать легче
Получи новых клиентов
Новые клиенты принесут больше прибыль

Создание рекламного баннера Flash от начала до конца

  1. Создание невидимой кнопки
  2. Оптимизация вашего флэш-фильма для предыдущих версий Flash Player
  3. Создание гиперссылки с помощью ActionScript
  4. Создание контента

В этом углубленном учебном пособии вы узнаете, как сделать типичный рекламный баннер Flash размером 468 x 60 от начала до конца, с подробным объяснением каждого шага. Вы узнаете, как:

  • сделать невидимую кнопку, которая действует как ссылка
  • оптимизировать свой баннер для предыдущих версий Flash Player
  • изучите основы о событиях и обработчиках событий во Flash
  • какие требования вы можете ожидать от своего клиента

1 Откройте новый шаблон рекламного баннера 468 x 60 во Flash: выберите « Файл»> «Новый» , затем перейдите на вкладку « Шаблоны » и выберите « Реклама» , затем 468 × 60 (Баннер) и нажмите «ОК». Теперь, первое, что мы сделаем, это сделаем кнопку, чтобы люди, заинтересованные в этом баннере, могли щелкнуть по нему, чтобы перенести их на предполагаемый сайт.

2 Дважды щелкните слой с именем content (Flash автоматически присваивает ему это имя) и введите кнопку , затем нажмите клавишу ВВОД .

2 Дважды щелкните слой с именем content (Flash автоматически присваивает ему это имя) и введите кнопку , затем нажмите клавишу ВВОД

Создание невидимой кнопки

3 С помощью Rectangle Tool (R) нарисуйте прямоугольник без рамок на сцене, размеры и цвет не важны.

4 Откройте панель «Выравнивание», нажав сочетание клавиш CTRL + K или выбрав « Окно»> «Выровнять» . Выберите прямоугольник на сцене, щелкнув по нему с помощью инструмента «Выделение» (V) . Теперь на панели Align включите опцию «To stage» (см. «1» на изображении ниже). Теперь нажмите кнопку «Соответствие ширине и высоте» (см. «2» на изображении ниже). Это сделает размеры прямоугольника такими же, как размеры сцены, то есть размеры нашего рекламного баннера Flash. Затем нажмите кнопку «Выровнять по горизонтали» (см. «3» на изображении ниже). Это будет центрировать наш прямоугольник горизонтально на сцене. После этого выровняйте прямоугольник по вертикали, нажав кнопку «Выровнять по центру» (см. «4» на изображении ниже). Это было легко и весело. Панель «Выровнять» во Flash действительно помогает сократить работу, которую в противном случае пришлось бы выполнять вручную. Мы получили наш прямоугольник того же размера, что и сцена, и точно перекрывая сцену. Поэтому, когда пользователи нажимают, они не могут пропустить это вообще. Давайте сделаем символ кнопки сейчас.

5 С еще выделенным прямоугольником нажмите F8 или выберите « Модификация»> «Преобразовать в символ» . Откроется диалоговое окно «Преобразовать в символ». Как Тип , выберите кнопку. Назовите это рекламной кнопкой или как хотите. Нажмите ОК. Нашу вновь созданную кнопку можно найти в библиотеке ( CTRL + L или F11 ). Чтобы пользователи могли нажимать кнопку, она должна располагаться поверх любого другого содержимого нашего баннера. Кроме того, из-за этого он должен быть невидимым, чтобы содержимое было видно под ним. Давай сделаем это.

6 Дважды щелкните по кнопке на сцене. Теперь мы внутри символа кнопки. Вы можете видеть, что у него есть собственная специальная временная шкала, состоящая из четырех кадров: вверх , вниз , вниз и удар . Они для фреймов соответствуют четырем состояниям кнопок:

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

7 Чтобы получить невидимую кнопку, все, что нам нужно сделать, это перетащить ключевой кадр состояния Up в состояние Hit и оставить его там. Это оно! Если у вас есть проблемы с этим - если вы щелкаете мышью, а просто выбираете при перетаскивании мышью, вам нужно сделать следующее: щелкните по ключевому кадру « Вверх» и отпустите кнопку мыши, не тяните в это время. Теперь нажмите на него еще раз и перетащите ключевой кадр в состояние Hit . Теперь у нас есть невидимая кнопка.

Теперь у нас есть невидимая кнопка

Нажмите на ссылку «Сцена 1» чуть выше временной шкалы или дважды щелкните в любом месте за пределами кнопки, чтобы вернуться на сцену. Вы заметите, что наша кнопка теперь окрашена в голубой цвет. Вот так Flash отмечает невидимые кнопки на сцене. Если вы нажмете CTRL + ENTER или Control> Test Movie сейчас, вы увидите пустой фильм. Но если вы наведите курсор мыши на кнопку (невидимую), вы заметите, что курсор изменится со стрелки на руку. Теперь нам нужно сделать нашу кнопку кликабельной - поставить ссылку на нее.

Кстати, если вы еще не сохранили документ, сделайте это сейчас . Приобретите эту привычку, чтобы сэкономить много работы и нервов, если отключится питание или произойдет сбой вашей системы.

8 Если ваша кнопка не выбрана, выберите ее сейчас. Чтобы убедиться, проверьте панель «Свойства» под сценой - она ​​должна показывать значок кнопки в левом верхнем углу, а рядом с ней должна быть надпись «Кнопка». Теперь нажмите F9 или нажмите « Окно»> «Действия». Панель действий откроется.

Убедитесь, что в левом верхнем углу панели «Действия» написана «Действия - кнопка». Если нет, это означает, что вы не выбрали кнопку, и ваш ActionScript завершит работу на основной временной шкале, а не на кнопке! И это вызовет проблемы - баннер не будет функционировать. Когда все будет готово, давайте начнем писать строки ActionScript.

Оптимизация вашего флэш-фильма для предыдущих версий Flash Player

Но! Но но НО. Всегда есть но. Одна очень важная вещь: баннеры, которые вы создадите для своих клиентов, должны охватить широкую аудиторию. Таким образом, вам придется настроить Flash-баннеры для более низких версий Flash-плеера. Вы НЕ МОЖЕТЕ продолжать, просто предполагая: «Ну, наверное, у всех к настоящему времени установлен новейший Flash Player 8. Это так круто и мощно, так зачем кому-то иметь старую версию? » . Такое мышление НЕПРАВИЛЬНО, да, потому что пользователи НЕ ДУМАЮТ, как мы, люди, разбирающиеся в Интернете (веб-дизайнеры, разработчики, программисты и т. Д.). Установка новой версии Flash Player не так проста для среднего пользователя. Зачем? Основная причина - лень. Люди, которые работают в Интернете, ленивы (то есть ленивы во время серфинга). Если на сайте нет большого интереса или ценности, а сайты требуют установки плагина, многие люди закроют эту страницу и зайдут в другие места.

В Интернете много сайтов, похожих на ваш или вашего клиента. Сохраняйте свою базу пользователей и расширяйте ее, будьте добры к ним. Это значит БЫТЬ ПОЛЬЗОВАТЕЛЕМ. Это верно, является ли ваш сайт Flash или HTML.

Вторая причина заключается в том, что клиент или сайт, на котором ваш клиент размещает свой Flash-баннер, потребуют от вас сделать объявление в более старом формате. Из этого правила почти нет исключений. Вы должны будете выполнить их запрос, в противном случае они обязательно вернут ту рекламную рекламу, которая была сделана на Flash, если они обнаружат, что вы не выполнили их указания. Хорошо, мы разобрались с этим. Но как это сделать? Легко.

9 Перейдите в « Файл»> «Параметры публикации» или нажмите CTRL + SHIFT + F12, и откроется диалоговое окно « Параметры публикации ». Перейдите на вкладку « Flash » и в раскрывающемся меню « Версия» выберите «Flash Player 6» (или в зависимости от того, какой сайт требуется для вашего Flash-баннера, это был Flash Player 5 для меня долгое время, хотите верьте, хотите нет). В раскрывающемся меню версии ActionScript выберите ActionScript 1.0. Вот и все. Нажмите ОК и вернитесь на панель «Действия».

Неважно, сохраните ли вы документ в формате Flash 8, Flash MX 2004 или Flash MX (в зависимости от того, какую версию вы установили на своем компьютере). Окончательный SWF-файл будет опубликован для версии Flash Player, указанной в диалоговом окне «Параметры публикации».

Создание гиперссылки с помощью ActionScript

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

на (выпуск) {
getURL ("http://www.flashexplained.com//", "_blank");
}

Вы заметите, что как только вы наберете первое слово, а затем круглые скобки:

на (

Всплывет всплывающее меню. Это меню показывает различные события, на которые может реагировать кнопка.

Выберите релиз . Теперь я объясню, что означают различные части этого кода. Первая строка,

на (выпуск) {

содержит ключевое слово on, за которым следует событие release. Затем следует фигурная скобка {.

СОБЫТИЕ - это то, что происходит во Flash-фильме, будь то щелчок мыши, движение мыши, временная шкала, достигающая определенного кадра, запуск звука, нажатие или отпускание клавиши. Код на нашей кнопке называется HANDLER EVENT. Это означает, что он обрабатывает то, что произойдет после того, как событие вызвано (в этом случае, когда наша кнопка нажата мышью). Буквально говорится (переводится с кода на человеческий язык): когда пользователь нажимает и отпускает кнопку мыши, выполняется код, который написан между фигурными скобками. Почти у каждой программы есть события и обработчики событий. Как вы думаете, что происходит, когда вы дважды щелкаете значок в Windows или Mac OSX, или перемещаете мышь в игре, или щелкаете меню в Word, Dreamweaver, Flash? Какой-то обработчик событий выполняет некоторый код. Он открывает меню, запускает программу и т. Д. Следовательно, события похожи на «триггеры», которые запускают реакцию, если она есть в коде.

Обратите внимание на событие, которое вы выбираете. Описание событий мыши следующее:

- событие release означает, что код между фигурными скобками {} будет выполнен, когда пользователь нажал И отпустил левую кнопку мыши. Это «нормальный», «стандартный» клик. Немногие пользователи щелкают мышью и держатся за нее, если они что-то не тянут,

- если вы выбрали событие нажатия , это означает, что код будет выполнен в тот момент, когда пользователь нажимает кнопку мыши, прежде чем отпустить его. Это может шокировать некоторых пользователей, потому что они привыкли к «нормальному», то есть «отпусканию» щелчку. Мероприятие для прессы отлично подходит для флеш-игр, когда что-то должно произойти немедленно - например, космический корабль, запускающий раунд, прыжок персонажа и т. Д.,

- событие releaseOutside происходит, когда пользователь нажимает (щелкает) мышь над кнопкой, перетаскивает ее за пределы области кнопки и отпускает ее,

- событие rollOver происходит, когда мышь наведена на кнопку (не может быть проще :),

- событие rollOut происходит, когда мышь наводят на кнопку и выводят из области кнопки,

- событие dragOver происходит, когда пользователь щелкает мышью, когда над кнопкой, перетаскивает ее за пределы области кнопки и возвращает обратно над кнопкой,

- событие dragOut наступает , когда пользователь нажимает кнопку мыши над кнопкой и перетаскивает курсор за ее пределы.

Вторая строка нашего кода ActionScript,

getURL ("http://www.flashexplained.com/", "_blank");

содержит команду getURL, которая делает возможным добавление гиперссылок. Куски кода между круглыми скобками называются параметрами . Они должны быть заключены в кавычки и разделены запятой. Первый - это URL (Uniform Resource Locator, если вы всегда бродили, что означает аббревиатура), или место в Интернете, на которое указывает ваш баннер (это также может быть адрес электронной почты). Я добавил URL-адрес главной страницы моего учебного пособия, вы можете поместить все, что захотите. Второй указывает, где будет открываться ссылка: в нашем случае _blank указывает, что она откроется в новом окне браузера. Другие варианты служат, если у вас есть фреймы на ваших страницах (лично я НИКОГДА не использую фреймы), они _self, если вы хотите, чтобы ссылка открывалась в том же фрейме, что ваш Flash-баннер, _parent для открытия в родительском фрейме и _top открывается поверх все кадры, и набор кадров исчезает. Существует третий параметр, который можно использовать для отправки данных, но он выходит за рамки этого руководства.

Нажмите CTRL + ENTER, чтобы проверить ваш фильм. Нажмите на кнопку, чтобы перейти на указанный вами URL.

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

Создание контента

Теперь нам нужно добавить некоторый контент. Для целей этого урока мы сделаем что-то общее. Если вы хотите узнать, как создавать более сложные Flash-баннеры, перейдите к Флэш баннеры главная страница и вы найдете множество учебных пособий на выбор и учиться. Прежде чем перейти к следующему шагу, сохраните ваш документ Flash.

10 Создайте новый слой. Для этого выберите « Вставка»> «Временная шкала»> «Слой» или щелкните значок «Вставить слой» слева от временной шкалы (см. Изображение ниже).

Изображение ниже)

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

Теперь нам нужно изображение. Важно помнить, что нужно оптимизировать изображение в Photoshop, прежде чем импортировать его во Flash. Зачем? Поскольку на сайте ваш клиент или вы будете размещать баннер, ОБЯЗАТЕЛЬНО есть ограничение на размер файлов баннеров. Обычно это максимум 15 КБ для 468 x 60 баннеров. Поэтому убедитесь, что вы оптимизируете свой имидж. И, если вы используете изображение JPEG, НЕ делайте его прогрессивным типом JPEG. Потому что Flash не может обрабатывать эти типы JPEG. Сделайте это обычным JPEG. Если у вас нет изображения под рукой, возьмите это ниже.

11 Импортируйте изображение в документ Flash, нажав сочетание клавиш CTRL + R или выбрав « Файл»> «Импорт»> «Импортировать в рабочую область» . Откроется диалоговое окно импорта. Найдите свое изображение и нажмите ОК. Изображение появится на сцене и будет автоматически сохранено в библиотеке. Теперь вы не можете оформить должным образом из-за слоя кнопки. Скрыть слой кнопки, нажав на точку под глазом (см. Изображение ниже).

12 Выберите изображение, отцентрируйте его на сцене, нажав кнопку «Выровнять по горизонтали» и «Выровнять по центру» на панели «Выровнять».

13 Пока изображение выбрано, взгляните на панель «Свойства». Посмотрите на горизонтальные (X) и вертикальные (Y) координаты вашего изображения (см. Изображение ниже).

Изображение ниже)

Обратите внимание, что в моем случае координата X не является круглым значением. Если вы хотите, чтобы ваше изображение выглядело четким, у вас всегда должны быть круглые значения. Итак, щелкните в поле X и введите 71. Как округлить значение? Я придерживаюсь этого правила: если оно меньше 0,5, я округляю его до меньшего значения, а если оно выше или равно 0,5 до большего значения. Используйте эти же рекомендации для вашего текста во Flash. Теперь это может быть неочевидно в нашем случае, но если вы импортировали изображение GIF с, скажем, 1-пиксельной линией или чем-то похожим, вы сразу увидите разницу.

14 Заблокируйте слой «image» и создайте новый слой. Назовите этот новый слой фона и поместите его в нижней части всех слоев.

15 Нарисуйте черный прямоугольник без полей на этом новом слое и сделайте его такого же размера и положения, как наш этап, следуя методике, описанной в шаге № 4 этого урока. Заблокируйте слой. Теперь у нас черный фон.

После этого вы можете добавить любую понравившуюся вам анимацию. Я поместил еще один слой с анимацией, вы можете увидеть его ниже. Если вы не уверены, как это сделать, проверьте Анимационные уроки главная страница ,

И последнее: вам нужно будет сделать анимированный GIF или просто обычную замену JPEG для вашего баннера Flash. Это почему? Потому что у некоторых людей не установлен Flash Player. И сайт, на котором будет отображаться баннер, обязательно потребует от вас сделать GIF или JPEG и отправить их вместе с Flash-баннером, а иногда даже с исходным FLA-файлом. Теперь, используя файловый менеджер на вашем компьютере, перейдите в папку, в которой вы сохранили свой FLA-файл, и посмотрите на SWF. Посмотрите на его размер файла и убедитесь, что он не превосходит требования, установленные вашим клиентом.

Это оно! Надеюсь, вам понравился этот урок так же, как и мне. Ниже вы можете скачать сжатый исходный FLA-файл для этого урока.

Загрузите сжатый исходный файл FLA.

Оставить комментарий

Похожие

Создание анимированных GIF-файлов: Photoshop vs Flash
Примечание. Этот пост не о сравнении Photoshop и Flash (оба они являются отличными инструментами для разных целей), а просто о том, как сравнивать их при создании анимированных GIF-файлов. Давайте начнем с простой цели - создать анимированный GIF-баннер. Вот базовый дизайн: Теперь давайте добавим немного анимации, перемещая «облака» на заднем плане в бесконечном
Создание сайтов Лодзи, создание флеш страниц, позиционирование страниц.
... для частных лиц и частных компаний системы управления сайтом на сайте со стороны клиента мы создаем интернет магазины позиционирование сайта в Google покупка домена веб - хостинг Мы создаем сайты, используя PHP, HTML, JAVA SCRIPT, FLASH. Мы пишем код сайта вручную, оптимизируя его для поиска Google. Мы также проводим обновления
Как изменить ассоциации файлов в VLC Media Player
Если VLC Media Player является вашим любимым программным обеспечением для воспроизведения мультимедиа, вы бы хотели, чтобы многие, если не все мультимедийные файлы автоматически открывались с помощью VLC Media Player. Когда вы дважды щелкаете медиа-файл, вы хотите, чтобы файл открывался с помощью VLC Media Player естественным образом. Вы не всегда хотите щелкнуть правой кнопкой мыши по файлу, щелкнуть по open с помощью и затем выбрать VLC Media Player, чтобы открыть его. Это будет тратить
Создайте сложную 3D-фантастическую сцену в Blender
Создание апокалиптической научной фантастической городской сцены в 3D арт это то, что художники могут уклоняться от выполнения из-за огромной сложности предмета, 3D модели и текстуры нужны. Но с умными способами справиться с этим, это, безусловно, выполнимо. Есть много разных путей, которые вы можете выбрать для получения окончательного
FAQ - CleverVox
Создание учетной записи и первый вход в систему Портал Clever4CARE - это инструмент для управления всеми телекоммуникационными и хостинговыми услугами в вашей учетной записи - эта статья посвящена VoIP. Вы можете редактировать все настройки сервиса, от создания учетной записи, настройки SIP до установки ограничений безопасности и подключения и т. Д. Простой процесс активации, шаг за шагом: а) Создание учетной записи Создайте аккаунт,
Entropay - внесение денег для игры в покер - пополнение счета
Что такое EntroPay? Это онлайн-счет с предоплаченной картой Visa Virtual EntroPay. Вы можете оплатить его в сети, где принимаются карты Visa. Это позволяет вам совершать онлайн-платежи, не раскрывая данные вашей кредитной карты. Регистрация для открытия счета EntroPay и получения карты Visa EntroPay - это быстро и просто. Средства EntroPay Visa оплачиваются кредитной
Как максимизировать батарею вашего Kindle (и действительно получить месяц чтения)
... для чтения электронных книг Kindle, как это происходит с телефонами или планшетами. Тем не менее, строка «начисляй ежемесячно, а не ежедневно», которой может похвастаться Amazon, имеет мелкий шрифт, включающий некоторые рекомендации по энергосбережению - например, чтение только получаса в день. Мы не знаем о вас, но нам нравится читать, и полчаса в день кажется ничтожным. После того, как на нашем Kindle Paperwhite началось уменьшенное время автономной работы, мы сделали
12 Удивительных результатов теста А / Б, чтобы вы не делали предположений
[ 12 тестов ниже были использованы с разрешения WhichTestWon ] В моей последней статье критика целевых страниц для конверсии Я закончил со страницей, которая работала, но нарушала все правила. Из этого вы можете сделать вывод, что правила не имеют значения, но это не так. Иногда правила не имеют значения, но только когда вы проверили страницу, чтобы
11 советов по Excel для опытных пользователей
... версий Excel 2016, включая Mac; это были протестированные версии. Многие параметры запроса на вкладке данных Excel 2016 взяты из надстройки Power Query для Excel 2010 и 2013. у вас есть Power Query в более ранней версии Excel для Windows, многие из этих советов будут работать и для вас, хотя они могут не работать в Excel для Mac.) 1. Используйте ярлык для создания таблицы Таблицы являются одними из наиболее полезных функций в Excel для данных, которые
С развитием технологий каждый день мы все немного беспокоимся о нашей конфиденциальности. Но вы бы знали, было ли...
С развитием технологий каждый день мы все немного беспокоимся о нашей конфиденциальности. Но вы бы знали, было ли правительство следить за вами , право? Достаточно страшно, ACLU говорит правительство скользче, чем

Комментарии

Кроме мрамора и терраццо, были ли какие-то другие аспекты вашего дома, которые вы учитывали при разработке часов?
Кроме мрамора и терраццо, были ли какие-то другие аспекты вашего дома, которые вы учитывали при разработке часов? Я не могу думать о терраццо без медной инкрустации, поэтому я хотел, чтобы там были геометрические узоры дизайна и намек на металл. Я эгоистично разработал их для себя - теперь я могу посмотреть на эти материалы, которые я недавно открыл и полюбил, и носить их на своем запястье. Дизайн часов Мэнди Мур. И, наконец, будут ли эти часы сниматься в
Как сделать «быстрый депозит» с помощью сервиса EntroPay?
Как сделать «быстрый депозит» с помощью сервиса EntroPay? Функция «быстрый депозит» включает в себя платежи EntroPay. Это позволяет вам мгновенно и удобно пополнить свой счет, используя предпочитаемый вами способ оплаты. Узнайте больше о " быстрые платежи ». Каковы лимиты на депозит для услуги EntroPay? Вы можете найти свои текущие лимиты на депозит в окне «Касса». А как

Зачем?
Но как это сделать?
Как вы думаете, что происходит, когда вы дважды щелкаете значок в Windows или Mac OSX, или перемещаете мышь в игре, или щелкаете меню в Word, Dreamweaver, Flash?
Зачем?
71. Как округлить значение?
Это почему?
Но вы бы знали, было ли правительство следить за вами , право?
Кроме мрамора и терраццо, были ли какие-то другие аспекты вашего дома, которые вы учитывали при разработке часов?
Как сделать «быстрый депозит» с помощью сервиса EntroPay?
Каковы лимиты на депозит для услуги EntroPay?