Кручу, верчу, баннеры делаю, пагу раскручиваю...

Xakep, номер #036, стр. 036-026-3


Так вот. Кадров теперь два, и уже можно посмотреть анимацию: жми кнопку Play Animation. Мигает? Мигает. Если не мигает, тыкай в нужный тебе кадр, смотри на его увеличенное изображение и выясни, какие слои (Layers) для него включены/выключены. Дублируй второй кадр в Animation, включай для него вторую строфу стиха в Layers. Хочется отметить, что в ImageReady для каждого кадра мы можем менять только свойство слоя, а не его содержимое. Можно менять видимость слоя, прозрачность, свойства наложения - но если тебе захочется что-нибудь поменять в одном слое, то эти изменения произойдут во всех кадрах анимации. Опять дублируй второй кадр - который пустой. Модным методом тащ-щи и бросай дубликат второго кадра (он успел пронумероваться как третий) в конец очереди. Он стал четвертым. Опять можешь проиграть свою анимацию. Можешь доделывать свой стишок. Не находишь, что все мелькает? Что человек просто не успеет ничего прочитать? Вооот. Для этого под каждым кадром есть выпадающее меню, в котором нужно выставить время, на которое этот кадр зависнет, представая перед зрителем во всей своей неспешности. Обычно человеку хватает секунды на то, чтобы прочитать строку. Соответственно, ставим по секунде на каждый из четырех кадров с текстом и по 0,1 секунды на перебивочку между строчками.

Если тебе не нужно зацикливание анимации, а ты хочешь, чтобы баннер остановился на последней надписи, - выбери под первым кадром Once вместо Forever. Play... Stop... Все довольны. Рекомендую сохранить этот необжатый вариант и потестировать в разных браузерах, потому что возможны варианты в скорости мелькания в разных бродилках.

Работай с оптимизмом

Начинаем оптимизировать. Переходим во вкладку Optimized - это там, где большое изображение, и обращаем внимание на вкладку Optimize, где менюшки слева (Window -> Show Optimize). Теперь это наша рабочая область. В нижней части окошка Optimize в status bar ты видишь размер в байтах, который при нынешних настройках обжима тебе предлагает ImageReady. Нам с нашим баннером 468Х60 надо стремиться уложиться в 15 Кбайт (или в 15360 байт); соответственно можно выбрать, в какой единице измерения нам высвечивать размер - кликнув на Status bar и выбрав в выпавшем меню нужный вариант. Первым делом предложим программистам Adobe показать, что не зря они едят свои гамбургеры и пьют свою кока-колу. В окошке Optimize в правом верхнем углу есть треугольничек, который ведет к меню. В нем нужно выбрать пункт Optimize to File Size. В окошке выставить 15 Кил и наслаждаться работой этой железки. Если ты остался доволен проделанной работой, то File -> Save Optimized и переходи к следующему баннеру. А что, ты не знал, что количество иногда переходит в качество? Сделай четыре штучки, посравнивай, выбери парочку наиболее удачных - и вперед, к размещению!

Ну, а если твой баннер стал похож на старую дедушкину фотографию в младенчестве, да еще и вымоченную в грязной лужице, то слухай сюды. Что сделали эти программисты?

Они не нашли ничего умней, чем подобрать тебе размер файла простым уменьшением количества цветов. Разумеется, прога сократила их до двух коричневых. Что же делать? В таких случаях я обычно начинаю со шрифта. Отключаем у всех надписей анти-алиасинг. То есть сглаживание. Это находится во вкладке Type, нижний правый лист-бокс. Вместо Crisp выставить None. Да, текст стал каким-то покоцанным, но зато глянь на размер файла! Убрав анти-алиасинг со всех текстов баннера, мы экономим драгоценные цвета, которые уходили на сглаженные контуры шрифта. В следующий раз, разрабатывая дизайн баннера, помни, что почти наверняка придется убирать сглаживание и лучше сразу подбирать шрифты, которые замечательно и прикольно выглядят и безо всякого анти-алиасинга. Например, могу рекомендовать Sуvenet 7, Hooge 05_55 или Sofahrom, также подойдет старая добрая Verdana или Tahoma.

Назад на стр. 036-026-2  Содержание  Вперед на стр. 036-026-4