розділи: Інформатика

Сучасний період розвитку суспільства характеризується сильним впливом на нього комп'ютерних технологій, які проникають в усі сфери людської діяльності, забезпечують поширення інформаційних потоків в суспільстві, утворюючи глобальний інформаційний простір.

З кожним днем ​​збільшується кількість людей, які приходять до висновку, що створення власного сайту є необхідністю. Сам Інтернет стає більш доступним, тисячі людей щодня заходять на різні сайти. Аудиторія Інтернету з кожним днем ​​збільшується.

Що таке хороший сайт? Він повинен бути, по-перше, з добре продуманою дизайнерською ідеєю, тобто красивим, не схожим на всі інші сайти. По-друге, простота в навігації, по-третє, сайт повинен бути "живим" і постійно оновлюватися. Це все найголовніші складові. Але найважливіше - це зручність і простота в знаходженні шуканого. При створенні сайту необхідно враховувати наявність банерів і відповідно вибудовувати дизайн.

Для того, щоб користувачі дізналися про сайт (компанії, товари, послуги) рекламодавця, останній розміщує на популярних і тематичних сайтах або в розсилках своє рекламне звернення. Реалізується рекламне звернення по-різному, найпоширенішим носієм залишається банер.

Як відомо, свої персональні web-сторінки створюють не тільки художники і дизайнери, але і самі різні, іноді не обтяжені художнім смаком, люди. Не всі вони "у близьких стосунках" з програмами-малювалки типу CorelDraw, багато, може бути, в школі зі скрипом отримували четвертки по предмету, пишномовно іменується "образотворче мистецтво", і до сих пір водять мишею по килимку приблизно так само, як курка лапою.

Але гідно оформити свій сайт, зустрічають-то по одягу, все ж хочеться кожному. Не кажучи вже про те, що рекламний банер, щоб впоратися із завданням залучення нових і нових відвідувачів, повинен, перш за все, непогано (помітно й маняще!) Виглядати.

Що ж робити? Все дуже просто: щоб зробити привабливий, більш того, анімований (мультиплікаційний) банер, зовсім не обов'язково бути художником. Нижче представлені кілька способів створення свого банера.

Історична довідка

Коли зародилася банерна реклама, сказати складно. Вона з'явилася, коли стала розвиватися комерція в Мережі. Потрібно було рекламувати свої послуги в Мережі власникам сайтів. Та й самі сайти потребували рекламі.

Енциклопедія Wikipedia стверджує, що перший графічний рекламний модуль в Інтернеті, на який можна було клікнути для переходу до інформації рекламодавця, був проданий в 1993 році на сайті Global Network Navigator, що належав американському комп'ютерному видавництву O'Reilly. Однак днем ​​народження банера слід вважати 25 жовтня 1994 коли на сайті Hotwired (належав самому відомому американському журналу про технології Wired) був розміщений банер AT & T, який виглядав жахливо, але був чимось особливим. Розмір банера - 468х60 - згодом став найвідомішим стандартом в Інтернет - рекламі, хоча і був витіснений більшими форматами 10 років по тому.

На малюнку нижче зображений банер, який може бути вважається найпершим в Інтернет. Він з'явився в 1994 році.

Що таке банер?

Банер (від англ. Banner - прапор, транспарант, розтяжка) - це статична картинка або нескладна мультиплікація (анімована картинка), що розміщується на веб-сторінках в рекламних цілях. Зазвичай ця картинка є посиланням, по якій можна перейти на рекламований сайт або на сторінку, яка містить більш розгорнуту інформацію про рекламований товар (ця дія називається "перехід по банеру" або "клік").

Банери бувають статичні і анімовані.

1. статичний банер
являє собою яскраве статичне зображення (формати: * .jpg, * .gif).
2. анімований банер
може розроблятися на основі технології Flash або в форматі GIF.

Анімований GIF-банер

являє собою набір змінюють один одного статичних зображень (кадрів) з інтервалом в декілька секунд. Зазвичай складається з 3-5 кадрів. Недоліками GIF-банера є значне "обважнення" банера зі збільшенням числа кадрів і відсутність можливості створення складних анімаційних ефектів.

Flash-банер

- найсучасніша технологія, яка дозволяє в невеликому за обсягом банері використовувати анімацію, складні візуальні ефекти, звук і відео, а також реагувати на поведінку користувача. Надає дизайнерові широкі можливості для реалізації своїх ідей.

Можливі ситуації, коли у користувача на комп'ютері не встановлено флеш-плеєр версії, необхідної для роботи створеного нами баннери. В такому випадку ми пропонуємо наступне рішення: замість flash-банера у користувача буде відображатися статичний банер або анімований gif-банер - так звана "заглушка".

Виготовлення банерів і стандартні розміри банерів.

• банери 468x60 пікселів;
• банери 120х60, 150х60, 140х 60 - як видно з розмірів, є варіантами банера 468х60;
• банер 120х240 пікселів - варіант вертикального банера;
• банер 100х100 пікселів - квадратик, досить широко використовується в інтернет рекламі;
• банери 88х31, 88х40, 81х63 - ці кнопочки для лічильників, рейтингів, для обміну посилань між сайтами.

Рідше використовуються інші розміри банерів, однак важливо, щоб розмір банера в середньому не перевищував 15 Кб. Однак дотримуватися такої межі в розмірі досить складно, використовуючи формат flash.

Банерна реклама

Основним показником, який вимірює ефективність банерної реклами є показник CTR, який позначає відгук банера, тобто кількість кліків по ньому. Наприклад, показник CTR, рівний 5% означає, що на банер з 100 показів кликнули тільки 5 разів. Природно, що такий показник зустрічається дуже рідко.

Середнім значенням, відгуку баннера є значення в 2%. Існує кілька універсальних порад і правил, які можуть допомогти підвищити ефективність банерної реклами, зокрема відгуку баннера.

З якою метою використовують банери?

• Створення позитивного образу компанії в очах споживачів.
• Ефектне подання продукту або послуги.
• Залучення нових клієнтів.

В цілому, банер виконує всі ті ж функції, що і мультимедійна або графічна реклама, але в той же час, банерна реклама має значно більше можливостей реалізації самих різних ідей.

створення банера

Створити банер можна декількома способами:

1. Замовити створення банера в будь-якої дизайнерської компанії. 2. Намалювати самостійно в графічному редакторі. 3. Зробити самому за допомогою спеціалізованого програмного забезпечення.

Перший варіант є досить дорогим. Сьогодні найпростіший банер обійдеться мінімум в 1000 р. Звичайно, можна звернутися до веб-дизайнерам в приватному порядку і домовитися про ціну, але куди приємніше самому навчитися створювати банери. Другий варіант зажадає від вас знання комп'ютерної графіки та дизайну. Однак він є найефективнішим і творчим.

Найбільш функціональний графічний редактор для створення банерів - Adobe Photoshop. За допомогою нього можна створювати найрізноманітніші красиві і ефектні графічні банери. Обмежується цей процес тільки вашою фантазією та вмінням працювати з програмою Adobe Photoshop. Якщо Adobe Photoshop вам не під силу, є третій варіант. Він набагато простіше, однак, також підходить для створення красивих банерів, правда і поступається другому (творчому) варіанту. існують спеціальні програми для створення банерів.

Банер можна зробити за допомогою спеціалізованих програм. В Інтернеті можна знайти безліч програм для створення банерів, які значно спрощують цей процес. Вони містять вбудовані покрокові майстра, різні додаткові інструменти, шаблони і заготовки для банерів. Користувачеві не потрібно нічого малювати і редагувати, а досить слідувати підказкам програми і вводити в необхідні поля необхідні дані, текст, вибирати колір фону банера, додавати малюнки і т.д.

Урок створення анімаційного банера з програмою Adobe Photoshop

У цьому Фотошоп уроці будемо створювати анімаційний банер для сайту.

1. Створіть новий документ потрібних вам розмірів. Розміри нашого банера будуть 380х50 px.

2. Додайте на ваш документ фонову картинку, яка буде статичною.

3. Напишіть текст.

Якщо текст складається з декількох рядків, то напишіть кожну строчку на новому шарі.

4. Встаньте на перший текстовий шар.
Клікніть в палітрі шарів на кнопочку "Додати маску шару"
Візьміть інструмент , Виділіть текст.

Потім натисніть Ctrl + Alt + D, щоб зробити легку растушевку, встановіть значення 2 px.
Тепер встановіть чорний колір, візьміть Заливання і залийте виділення при активній масці. Виділення повинно виявитися білим.
Ctrl + D - зніміть виділення.

Ті ж самі дії повторіть з іншими текстовими шарами.

Ось як буде виглядати ваша палітра шарів.

Знайдіть зображення подібне моїм олівців - вони будуть відкривати слова.

Перейдіть в Image Ready.

Для першого кадру закрийте глазики у текстових шарів і перемістіть олівці в те місце, де починається перша фраза. У мене це "Відео-уроки ..."

Натисніть на кнопочку "Дублювати кадр"

Тепер перемістіть олівці в кінець фрази. Перейдіть в палітру шарів, відкрийте око навпроти першого текстового шару і приберіть значок скріплення між шаром і маскою.

Клацніть по масці, щоб зробити її активною.

Поверніться в документ і правою стрілкою на клавіатурі стягніть маску з тексту, поки він повністю не відкриється.

Намагайтеся в цьому уроці для переміщення користуватися саме стрілками !!!

Натисніть на кнопочку "Розмножити" і в віконці встановіть кількість кадрів 10 шт.

Дублюйте останній кадр і сховайте шар з олівцями.

А тепер повторюємо всі вищеописані дії ще для двох текстових шарів. Відкриваємо олівці, переносимо на початок фрази, приховуємо перший текстовий шар, потім відкриваємо другий і т.д.
Якщо що забули, дивіться вище.

У мене в підсумку вийшло 38 кадрів. Час по 0,1 сек

Тепер Файл - Зберегти оптимізований як ..., збережіть у форматі GIF.

Ось, що у мене вийшло (трохи скорочений варіант):

Що не слід робити в банерах:

1. Не треба вставляти в банер размазанность зображення (псує баннер).
2. Чи не робити шрифт більше 50.
3. Коли використовуєте великий шрифт не слід застосовувати Bold Style (виділення жирним).
4. Флеш банер не повинен Маргай або ще якимось, який буде дратувати відвідувача.
5. Розмір флеш банера не повинен перевищувати 50 Кб, інакше на повільному модемі занадто довго буде вантажиться.
6. Не вставляйте в банер безглуздий текст.

5.05.2013