С помощью пошагового руководства в презентации вы можете создать забавный скрипт с убегающей кнопкой в "песочнице" Planker. В конце текст скрипта приводится полностью.
пятница, 30 марта 2018 г.
вторник, 27 марта 2018 г.
Обработка событий в JavaScript
Пройдите курс "Знакомство с JavaScript" на сайте HtmlAcademy
Откройте (или создайте) html-страницу и поместите в нее следующий код:
Откройте (или создайте) html-страницу и поместите в нее следующий код:
<html>
<head>
<title>Заголовок документа</title>
<link rel="stylesheet" type="text/css" href="style.css">
<script language="javascript">
document.write("Моя первая страница.");
</script>
</head>
<body>
</body>
</html>
Откройте эту страницу в браузере, она выглядит так:
Давайте разберемся, как это работает. Браузер читает нашу html-страницу, видит оператор для выполнения document.write("Моя первая страница."); и выполняет его. Рассмотрим из чего состоит сам оператор (инструкция):
При интерпретации html-страницы браузер создает объекты javascript. Они хранятся в виде иерархической структуры, отражая структуру документа, например:
На самом верхнем уровне находится объект window, представляющий окно браузера и являющийся "родителем" всех остальных объектов. Расположенные ниже могут иметь свои подчиненные объекты. Так объект document(текущая страница) может иметь дочерний объект form (форма) и т.д.
Все объекты имеют методы (отделяются от объекта точкой), например:
- document.write позволяет писать текст в текущую страницу,
- window.open открывает новое окно браузера.
Также объекты имеют свойства, например:
- document.bgcolor содержит значение фонового цвета текущей страницы,
- document.title содержит заголовок страницы.
Сценарий, который мы написали, выполнился немедленно после загрузки страницы. Однако в большинстве случаев нам нужно, чтобы сценарий выполнялся после каких-либо действий пользователя: нажатия на кнопку или ввода текста. Т.е. в ответ на пользовательское событие.
Для этого в тегах элементов страницы введены параметры обработки событий, задающие действия, выполняемые при возникновении события, связанного с элементом. Например:
<div onClick="addText();"></div>
Здесь Click - событие (щелчок по div-у), onClick - обработчик события, addText() - имя функции, которая сработает при возникновении этого события (щелчка по div-у).
Перечислим события, которые поддерживаются javascript. Запоминать их не следует, в дальнейшем можете просто обращаться к этой таблице.
Перечислим события, которые поддерживаются javascript. Запоминать их не следует, в дальнейшем можете просто обращаться к этой таблице.
Событие
|
Когда происходит
|
Обработчик события
|
Blur
|
потеря объектом фокуса
|
onBlur
|
Change
|
пользователь изменяет значение элемента
|
onChange
|
Click
|
пользователь щелкает мыщью по объекту
|
onClick
|
DblClick
|
пользователь делает двойной щелчок мышью по объекту
|
onDblClick
|
DragDrop
|
пользователь перетаскивает мышью объект
|
onDragDrop
|
Error
|
возникновение javascript-ошибки
|
onError
|
Focus
|
окно или элемент формы получает фокус
|
onFocus
|
KeyDown
|
пользователь нажимает клавишу клавиатуры
|
onKeyDown
|
KeyPress
|
пользователь удерживает нажатой клавишу клавиатуры
|
onKeyPress
|
KeyUp
|
пользователь отпускает клавишу клавиатуры
|
onKeyUp
|
Load
|
документ загружается в браузер
|
onLoad
|
MouseDown
|
пользователь нажимает кнопку мыши
|
onMouseDown
|
MouseOut
|
указатель мыши выходит за пределы элемента
|
onMouseOut
|
MouseOver
|
указатель мыши помещается над элементом
|
onMouseOver
|
MouseUp
|
пользователь отпускает кнопку мыши
|
onMouseUp
|
Move
|
пользователь перемещает окно
|
onMove
|
Reset
|
пользователь нажимает кнопку "reset" формы
|
onReset
|
Resize
|
пользователь изменяет размеры окна или элемента
|
onResize
|
Select
|
пользователь выбирает элемент формы
|
onSelect
|
Submit
|
пользователь нажимает кнопку "submit" формы
|
onSubmit
|
Unload
|
пользователь закрывает документ
|
onUnload
|
Хорошим стилем программирования является оформление действий, выполняемых при обработке событий, в виде функций.
понедельник, 26 марта 2018 г.
Объект document
Результаты практической работы "Морфей":
Заготовки к практической работе "Морфей"
Обратите внимание, что наш сценарий переопределяет цвет фона, заданный параметром BGCOLOR в операторе <BODY>:
|
Фамилия, имя
|
Оценка
|
|
Гольская
|
11
|
|
Дурнева, Лупийчук
|
7
|
|
Клемятин, Сушкевич
|
???
|
|
Лыжин, Мельник
|
11
|
|
Панченко, Малютенко
|
9
|
|
Савчук, Дубохвост
|
8
|
|
Святощук, Иванченко
|
9
|
|
Сикорский, Рой
|
8
|
|
Коваль, Палий
|
11
|
|
Хайрович, Петрова
|
???
|
|
Школьная, Олейник
|
???
|
|
Щербина. Шамаева
|
7
|
|
Юдин, Матвиенко
|
10
|
|
|
|
Заготовки к практической работе "Морфей"
Специально для работы с документами HTML в языке JavaScript имеется отдельный объект с названием document. Пользуясь его свойствами и методами, сценарий JavaScript может получить информацию о текущем документе, загруженном в окно браузера, а также управлять отображением содержимого этого документа.
Анализируя свойства объекта document, сценарий JavaScript может определить значения различных параметров документа HTML. Кроме того, сценарию доступны локальные метки, формы и связи документа как элементы соответствующих массивов, а также информация из заголовка документа.
Свойства объекта document
Ниже перечислены свойства объекта document, доступные сценарию JavaScript:
Свойство
|
Описание
|
alinkColor
|
Цвет ссылок, выбранных пользователем
|
anchors
|
Массив локальных меток, размещенных в документе. Эти метки применяются для организации ссылок внутри документа
|
applets
|
Массив объектов, соответствующих аплетам Java, расположенным в документе HTML
|
bgColor
|
Цвет фона документа
|
cookie
|
Значение cookie для текущего документа
|
fgColor
|
Цвет текста
|
forms
|
Массив, содержащий в виде объектов все формы, расположенные в документе HTML
|
images
|
Массив растровых изображений, включенных в документ
|
lastModified
|
Дата последнего изменения документа HTML
|
linkColor
|
Цвет ссылок, размещенных в документе и еще не посещенных пользователем
|
links
|
Массив, содержащий все ссылки в документе HTML
|
location
|
Полный адрес URL документа HTML
|
referrer
|
Адрес URL вызывающего документа HTML
|
title
|
Заголовок документа, заданный с помощью оператора
|
URL
|
Полный адрес URL документа HTML
|
vlinkColor
|
Цвет ссылок, размещенных в документе и уже посещенных пользователем
|
Объект document может содержать в себе другие объекты, доступные как свойства:
Свойство
|
Описание
|
anchor
|
Локальная метка, определенная в документе HTML с помощью тэга <A>
|
form
|
Форма, определяемая в документе HTML с помощью оператора <FORM>
|
history
|
Список адресов URL, посещенных пользователем
|
link
|
Текст или изображение, играющее роль гипертекстовой ссылки. Создается с помощью оператора языка HTML <A>, в котором дополнительно задаются обработчики событий onClick и onMouseOver
|
Методы объекта document
Сценарии JavaScript могут вызывать следующие пять методов, определенных в объекте document:
Метод
|
Описание
|
clear
|
Удаление содержимого документа из окна просмотра
|
close
|
Закрытие потока данных, открытого для документа методом open. В окне будут отображены все изменения содержимого документа, сделанные сценарием после открытия потока
|
open
|
Открытие выходного потока для записи в документ HTML данных типа MIME при помощи методов write и writeln
|
write
|
Запись в документ произвольной конструкции языка HTML
|
writeln
|
Аналогично предыдущему, но в конце строки добавляется символ новой строки
|
Сценарии, работающие с объектом document
Цветовое оформление документа
Большинство свойств объекта objects доступно сценарию JavaScript как для чтения, так и для записи. В данном примере попробуем динамически изменить цветовое оформление документа HTML.
Сценарий изменяет пять свойств документа HTML - цвет фона и текста, а также цвета посещенных, не посещенных и выбранных пользователем ссылок.
<HTML>
<HEAD>
<TITLE>Color Links</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
document.bgColor = "#00FF80";
document.fgColor = "#800080";
document.linkColor = "#000000";
document.alinkColor = "#FF0000";
document.vlinkColor = "#4000FF";
// -->
</SCRIPT>
</HEAD>
<BODY BGCOLOR=white>
<H1>Изменение цветового оформления</H1>
<P>Посетите эти серверы:
<P><A HREF="http://www.glasnet.ru/~frolov/index.html">Наша домашняя страница</A>
<P><A HREF="http://www.auramedia.ru">Каталог программ Auramedia</A>
<P><A HREF="http://www.microsoft.com/java/">Страница сервера Microsoft про Java</A>
<P><A HREF="#Локальный раздел">Локальный раздел</A>
<HR>
<H1><A NAME="Локальный раздел">Локальный раздел</A></H1>
<P>Этот локальный раздел вы можете просмотреть, даже если ваш компьютер не подключен к Internet
</BODY>
</HTML>
document.bgColor = "#00FF80";
Немного усложнив сценарий, можно изменять цвет фона, например, в зависимости от времени суток или от календарной даты. Например, цвет страницы по выходным дням можно сделать праздничным, а по рабочим - деловым.
Ссылки и метки в документе
Как известно, для того чтобы вставить в документ HTML ссылку или локальную метку, необходимо использовать тэг <A>. В общем виде этот оператор представлен ниже:
<A HREF=Адрес URL или локальная метка NAME="Имя локальной метки"
TARGET="Имя окна" onClick="Обработчик события: щелчок по ссылке"
onMouseOver="Обработчик события: курсор над ссылкой"> Текст ссылки </A>
Для каждой ссылки, размещенной в документе HTML, создается отдельный объект. Все такие объекты находятся в объекте документа Document как элементы массива links. Сценарий JavaScript может определить свойства каждой ссылки, расположенной в документе HTML, анализируя элементы объекта links.
Вот список этих свойств:
Свойство
|
Описание
|
hash
|
Имя локальной ссылки, если она определена в адресе URL
|
host
|
Имя узла и порт, указанные в адресе URL
|
hostname
|
Имя узла и доменное имя узла сети. Если доменное имя недоступно, вместо него указывается адрес IP
|
href
|
Полный адрес URL
|
pathname
|
Путь к объекту, указанный в адресе URL
|
port
|
Номер порта, используемого для передачи данных с сервером, указанным в данной ссылке
|
protocol
|
Строка названия протокола передачи данных (включающая символ "двоеточие"), указанного в ссылке
|
search
|
Строка запроса, указанная в адресе URL после символа "?"
|
target
|
Значение параметра TARGET, заданное в ссылке
|
length
|
Количество элементов в массиве links, то есть количество ссылок в текущем документе HTML
|
среда, 14 марта 2018 г.
Основы JavaScript
Сценарий, или скрипт – это упрощенная программа, , встроенная в HTML –документ.
Язык сценариев JavaScript был создан на основе объектно – ориентированного языка Java. Технология скриптов позволяет странице динамически реагировать на поведение пользователя, но при этом не создает нагрузку на сеть. JavaScript работает только в составе HTML – страницы, и написанный скрипт начинает работать только тогда, когда страница загружена в браузер.
Возможности JavaScript:
- Формирование страницы «на лету»
- Проверка правильности данных, введенных в форму
- Возможности пользователя управлять работой скрипта
- Создавать окна сообщений, диалоговые окна, предупреждения
- Создавать документы с расширенными возможностями навигации
Скрипты размещаются внутри тега <SCRIPT></SCRIPT>
- Операторы разделяются знаком ;
- Переменные типизировать не обязательно
- Операция равенства записывается как в С++: ==
- Несколько операций объединяются с помощью фигурных скобок {}
- Язык чувствителен к регистру, то есть различает большие и маленькие буквы
Пример простейшего скрипта, выводящего на экран текстовое сообщение:
<html>
<body><script type="text/javascript">alert(«Первый скрипт!");</script>
</body>
</html>
В скриптах используются такие операторы управления:
- FOR
- WHILE
- IF … ELSE
- ?
Для вывода используется оператор writeln().
Главная идея JavaScript – дать возможность пользователю изменять страницу в процессе просмотра. Для реализации этой идеи была предложена объектная модель документа
Суть модели – в том, что каждый элемент HTML – это объект, характеризующийся тремя показателями:
- СВОЙСТВА
- МЕТОДЫ
- СОБЫТИЯ
Синтаксис объектной модели:
- Объект.свойство
- Объект.метод (список параметров)
- Объект1.объект2.свойство
Свойства
Большинство тегов имеют атрибуты. Например, атрибут HREF тега A:
<A HREF=“KUKU.HTM”>KUKU</A>
Если рассматривать элемент<A..>…</A> ак объект, то атрибут HREF будет задавать свойство гиперссылки
DOCUMENT.LINKS[0].HREF=“KUKU.HTM”;
Методы
Методы объекта определяют функции изменения его свойств. Например, с объектом document связаны методы open() write() close()
Пример скрипта, создающего новый документ и открывающего его в новом окне:
<html><body>
<script>
id=window.open("");
id.focus();
id.document.write("hello!");
</script>
</body></html>
События
Суть программирования скриптов состоит в написании подпрограмм обработки событий, которые могут происходить с объектами.
Пример: с объектом BUTTON(задается тегом <input type=button> - кнопка формы) может произойти событие «click» - то есть на кнопку могут нажать.
В этом примере скрипта при нажатии на кнопку появляется текстовое сообщение:
<html>
<head>
<script>
function cl() {alert("Я же просил – не кликайте!");
}</script></head><body><form><INPUT TYPE=BUTTON VALUE="Не кликайте тут" OnClick="cl()";>
</form>
</body>
</html>
В JavaScript есть три метода ввода информации пользователем или вывода ее на экран.
Метод Alert
Этот метод позволяет выводить окно сообщения с кнопкой ОК.
alert("Параметр_1")
Метод Confirm
Выводит окно сообщения с кнопками ОК и Cancel. Возвращает True, если нажата кнопка ОК, и False, если нажата кнопка Cancel.
confirm ("Параметр_1")
Метод Prompt
Если нажата кнопка ОК, возвращается напечатанный в поле текст, если нажата кнопка Cancel— возвращается False.
Выводит окно сообщения и текстовое поле, предназначенное для ввода информации пользователем. Первый аргумент – текст сообщения, второй — значение по умолчанию.
Prompt("Параметр_1", “Параметр_2“)
Пример скрипта с вопросами теста:
<html>
<body>
<script>
var s, i=0;
s=confirm("2+2=4?");
if (s==true) {alert("Good!"); i++;}
else alert("No!")
</script>
</body></html>
вторник, 13 марта 2018 г.
Технология создания анимации в Adobe Flash
Технология создания анимации в Adobe Flash
Как загрузить заготовленные картинки в библиотеку?
Библиотека – это то, где хранится все, с чем вы работаете в файле. Если вы нарисуете какую-нибудь форму и превратите ее в символ и захотите ее использовать многократно, этот символ будет храниться в библиотеке. Здесь же хранятся и картинки.
Панель библиотеки находится сразу после панели «свойства».
![]() |
| Панель библиотеки |
Чтобы импортировать картинку или любой другой графический объект, обратимся к верхнему меню – Файл - Импорт и выберем один из предложенных пунктов.
- «Импортировать в рабочую область» – означает, что картинки будут импортироваться сразу на сцену.
- «Импортировать в библиотеку» – означает, что картинки будут импортироваться в библиотеку.
Как выглядит монтажный стол?
Временная шкала - основной инструмент при работе с анимацией во Flash. На ней отображается информация о слоях, о том какие кадры являются ключевыми, а какие генерирует Flash. С помощью временной шкалы можно понять, какие кадры содержат действия или метки. Она позволяет перемещать ключевые кадры и целые куски анимации. Вы очень быстро освоитесь с этим инструментом, благодаря хорошо продуманному и удобному интерфейсу. Временную шкалу очень легко найти, даже если вы впервые работаете во Flash:
Слои
В компьютерной графике этот инструмент используется очень часто. Представьте, что вы рисуете на прозрачных листах, а потом накладываете их друг на друга. То, что находится на верхних слоях, закрывает содержимое нижних слоев. Слои можно делать невидимыми и/или недоступными, чтобы облегчить редактирование сцены в целом.
Есть достаточно большое количество приемов, в которых используются слои, но во Flash без них просто нельзя обойтись по одной важной причине: в один момент времени для каждого объекта анимации нужен отдельный слой.
Кадры
Наша анимация состоит из последовательности кадров. Кадр может быть как составленным вручную, так и сгенерированным Flash. Это относится к кадрам одного слоя. Так как сцены Flash состоят обычно из нескольких слоев, то итоговые "многослойные" кадры, могут содержать, как сгенерированные, так и "самодельные" слои.
В компьютерной анимации существует понятие - ключевые кадры (keyframes). Их название говорит само за себя. Это кадры, которые Flash не вправе изменять в процессе создания анимации. Вы задаете эти ключевые кадры, а промежуточные кадры между ними выстраивает Flash. Существует два типа промежуточных кадров - кадры, построенные на основе изменения геометрии (shape tweening) или кадры, построенные на изменении символов (motion tweening). И, конечно же, кадры могут быть пустыми, т.е. ничего не содержать.
Элементарные операции с кадрами:
- Вставить пустой ключевой кадр - Insert->Blank keyframe, F7
- Ключевой кадр, повторяющий содержание предыдущего - Insert->Keyframe, F6
- Очистить ключевой кадр - Insert->Clear keyframe, Shift-F6
- Вставить обычный кадр - Insert->Frame, F5
- Удалить кадр - Insert->Remove Frames, Shift-F5
Как создать классическую анимацию движения?
1. Щелкните имя слоя, чтобы сделать его активным, и выберите пустой ключевой кадр слоя, с которого должна начинаться анимация. Это будет первый кадр классической анимации.
2. Чтобы добавить содержимое в первый кадр классической анимации, выполните одно из следующих действий.
- Создайте графический объект с помощью инструментов «Перо», «Овал», «Прямоугольник», «Карандаш» или «Кисть», а затем преобразуйте его в символ.
- Создайте экземпляр, группу или текстовый блок в рабочей области.
- Перетащите экземпляр символа с панели «Библиотека».
Примечание: Для создания анимации движения необходимо, чтобы на слое находился только один элемент.
3. Создайте второй ключевой кадр, на котором должна заканчиваться анимация, и оставьте новый ключевой кадр выбранным.
4. Чтобы изменить элемент в конечном кадре, выполните одно из следующих действий:
- Переместите элемент в новую позицию.
- Измените размер, поворот и наклон элемента.
- Измените цвет элемента (только экземпляра или текстового блока). Чтобы создать промежуточные кадры для цвета элементов, которые не являются экземплярами или текстовыми блоками, используйте анимацию формы.
- Щелкните любой кадр в диапазоне кадров анимации и выберите «Вставка» > «Классическая анимация движения».
- В диапазоне кадров анимации щелкните любой кадр правой кнопкой мыши и в контекстном меню выберите «Создать классическую анимацию движения».
Если на шаге 2 был создан графический объект, Flash автоматически преобразует объект в символ и присвоит ему имя tween1.
6. Если на шаге 4 был изменен размер элемента, выберите «Масштаб» и разделе «Анимация» инспектора свойств, чтобы анимировать изменение размера выделенного элемента.
7. Чтобы обеспечить более реалистичное ощущение движения, примените замедление/ускорение к классической анимации движения. Чтобы применить замедление к классической анимации, используйте поле «Замедление» в разделе «Анимация» инспектора свойств, чтобы указать значение замедления для каждого экземпляра классической анимации движения. В диалоговом окне «Пользовательское замедление и ускорение» можно более точно контролировать скорость классической анимации движения.
Перетащите значение в поле «Замедление» или введите значение, чтобы настроить скорость изменений между промежуточными кадрами.
- Чтобы начать классическую анимацию движения медленно и ускорить по направлению к конечному кадру анимации, введите отрицательное значение между -1 и -100.
- Чтобы начать классическую анимацию движения быстро и замедлить по направлению к конечному кадру анимации, введите положительное значение между 1 и 100.
- Чтобы выполнить более сложное изменение скорости в пределах диапазона кадров анимации, щелкните кнопку «Редактировать» рядом с полем «Замедление», чтобы открыть диалоговое окно «Пользовательское замедление и ускорение».
По умолчанию скорость изменений между промежуточными кадрами постоянна. Ускорение дает более естественный вид ускорения или замедления за счет постепенного изменения скорости изменений.
Подробнее познакомиться с процессом анимации вы можете в видео:
Подробнее познакомиться с процессом анимации вы можете в видео:
Баннерная реклама
Результаты практической работы "Баннер для сайта":
|
Фамилия, имя
|
Оценка
|
|
Билык, Олейник
|
9
|
|
Юдин, Матвиенко, Святощук
|
10
|
|
Пивовар, Коваль
|
11
|
|
Момот, Школьная
|
11
|
|
Петрова, Хайрович
|
11
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Что такое баннер
Баннер - графическое изображение рекламного характера.
Баннер может быть как статичным изображением или даже текстом, так и содержать анимированные элементы (вплоть до видео и интерактивных объектов). Как правило, может содержать гиперссылку на сайт рекламодателя или страницу с дополнительной информацией.
| Рекламный баннер на странице Яндекса |
Когда появились баннеры?
Своим появлением баннер обязан американской компании AT&T, предоставлявшей телефонные услуги. Именно эта фирма разместила на интернет-ресурсе hotwired.wired.com первый во всей истории баннер. Конечно, он был совсем простым. Имея размеры 648 на 60 пикселей, баннер, не мудрствуя лукаво, призывал кликнуть на него. Надпись на нём гласила: «Have you ever clicked your mouse right here? You will», что в переводе звучит как «Вы еще не кликали СЮДА? А придется».
| Баннер компании AT&T |
На Hotwired почти одновременно появились сразу несколько баннеров. Журналу в рамках первой кампании удалось привлечь таких крупных игроков, как MCI и Volvo. Впрочем, «привлечь» – не лучшее слово. Онлайновую рекламу клиенты получали в довесок к обычной, а часто и не знали о том, что размещаются в Интернете.
Завоевать доверие к новым медиа оказалось нелегко, хотя доля кликов по баннерам была совершенно невероятной – она достигала 78 процентов. Сейчас, через много лет, и один процент считается очень хорошим показателем.
Удивительно, но первая реклама в cети появилась всего через 12 дней после того, как был выпущен первый официальный браузер – Mosaic Netscape 0.9. Уже эту быстроту можно считать провозвестницей огромного успеха интернет-рекламы.
В свое время компании и агентства, вступающие на зыбкую почву размещения интернет-рекламы, активно обсуждали ее форму. Кто-то считал, что реклама должна быть графической, кто-то – текстовой. Интересно, что несколько лет именно текстовая реклама стала вторым дыханием для всего рынка.
В первой половине 2009 года на так называемую поисковую рекламу, представляющую собой в основном текстовые объявления, пришлось 5,1 миллиарда долларов. На дисплейную же рекламу, к которой относятся и баннеры, – лишь 3,8 миллиарда долларов. Активно растет лишь сектор видеорекламы, но он слишком мал, чтобы его было заметно на фоне 10,9 миллиарда долларов – именно столько тратят за полгода в Интернете американские рекламодатели.
Баннеры постепенно уходят со сцены. Согласно данным компании ComScore, доля американских интернетчиков, хотя бы раз в месяц кликающих по баннеру, за период с июля 2007 по март 2009 года сократилась вдвое – с 32 до 16 процентов. При этом половина из них совершает 85 процентов кликов. Таким образом, по баннерам активно щелкают только те, кто любит их всей душой.
Какими должны быть размеры баннера?
Наиболее распространёнными размерами считаются следующие:
- 88х31,
- 120х60,
- 100х100,
- 200х200,
- 250х250,
- 300х250,
- 336х280,
- 240х350,
- 240х400,
- 468х60,
- 728х90,
- 120х600,
- 160х600 (пикселей)
Классификация баннеров
Баннеры делятся по виду на:
- статичные - обычные картинки, в основном это логотипы.
- анимационные - настоящие рекламные баннеры.
Различают также:
- имиджевые
- кликовые
- информационные баннеры.
Первые, как следует из названия, формируют имидж компании, бренд, а вторые стараются привлечь потенциальных клиентов на собственную web-страницу, третьи информируют о каком-либо событии.
Баннеры могут также отличаться технологией изготовления.
Самый распространенный формат – GIF. Он подходит для неанимированных или несложных анимированных баннеров. При использовании GIF-формата размер его очень мал, и это хорошо, поскольку тогда повышается вероятность того, что пользователь загрузит баннер до конца. Баннеры формата GIF рисуются в различных растровых или векторных графических редакторах. Для этих целей используются специальные программы типа Ulead GIF Animator или Adobe ImegeReady.
| Пример GIF-баннера |
Особой популярностью несколько лет пользуются Flash – баннеры, созданные в программе Macromedia Flash. Преимущества по сравнению с GIF-баннерами:
- они могут реализовывать более сложную анимацию;
- имеют меньший размер;
- грузятся даже тогда, когда пользователь отключил в своем браузере функцию отражения графики.
Существует также третий, самый редкий стандарт, так называемый интерактивный баннер. Такие баннеры создаются с использованием технологии CGI, Java или VBS, а также элементов HTML и Flash-анимации.
Подписаться на:
Комментарии (Atom)



