Як зробити банер на сайті

  1. Банер, як зробити самому
  2. Як вставити банер на сайт

Вітаю всіх на Prosmo3.ru. Продовжуємо допрацьовувати свій сайт, сьогодні познайомимося з поняттям банера, дізнаємося як зробити банер на сайті, як встановити його на сайт. Розповім вам про основні розміри банерів використовуваних рекламодавцями.
Вітаю всіх на Prosmo3

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

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

Тому сьогодні я постараюся повністю освятити питання - Що таке банер? Банер це графічне зображення різних форматів (розмірів), що використовуються для рекламування товарів або послуг.

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

  1. Статична картинка, чи не змінна з часом.
  2. Динамічна картинка у вигляді мультиплікації або анімації.

Що статичний, що анімаційний банер для сайту, при натисканні на нього мишкою, перенесе вас на рекламований сайт, сторінку або товар. Звичайно ж Ctr (кількість натискань на банер поділене на кількість переглядів) буде тим вище, чим якісніше, красивіше, креативніше буде виконаний банер. На сьогоднішній день використовують 2 технології створення банерів:

  • З використанням Flash (банер флеш) технологій.
  • З використанням Gif малюнків при анімованому банері.

Також банери для сайту можуть містити тільки картинку з текстом або просто текст без анімації. Просто текст напевно роблять тільки невдахи, жарт звичайно ж)). Якщо говорити про розмір банера то найбільш поширені, в порядку убування, серед рекламодавців:

  • Банер 468х60 - найпоширеніший в інтернеті розмір.
  • Розмір 100х100.
  • Розмір 250х250.
  • Розмір 728х90.
  • Розмір 234х60.

Існують ще велика кількість різних розмірів банерів, але вони менш поширені.

Банер, як зробити самому

Щоб дізнатися, як створити банер, необхідно знати, як використовувати графічні редактори або спеціальні програми по створенню банерів. Якщо ви не фахівець і не розбираєтеся в програмах нібито Photoshop, то навряд чи у вас вийде хороший і привабливий банер. У таких випадках можу дати тільки два ради: або вчіться, як заповідав Ленін, або замовляйте банери у професіоналів. Останніх можна знайти на фріланс сайтах або різних форумах, нібито сёрча.

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

Рекомендую вам збільшити розмір створюваного зображення в 10 разів, тобто якщо ви хочете зробити банер розміром 468х60, то створюй новий файл зробіть розмір 4680х600, вам набагато легше буде працювати з таким форматом. Згодом після закінчення роботи ви можете зменшити банер до потрібного, встановленого размера.Сохраніть створений файл необхідно з розширенням .JPG

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

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

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

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

Тепер залишилася справа за малим, встановіть час наприклад 0,1 секунду для кожної картинки, отриманий результат ви можете програти в плеєрі і подивитися, що у вас вийшло. Для додання плавності, натисніть кнопку створити проміжні кадри (між кнопкою плеєра і кнопкою створенні копії анімації).

А в останньому кадрі анімації, також натиснувши на кнопку створення проміжних кадрів, вкажіть, що це перший кадр. Якщо вас все влаштовує зберігаємо, вибравши в меню, збереження для web і пристроїв, банер в форматі .Gif (вкладка повинна мати назву оптимізація) і милуємося красою нового банера). Банер-приклад (зразок), який вийшов у мене:

Банер-приклад (зразок), який вийшов у мене:

Звичайно ж, це найпростіший банер GIF, який можна придумати, я лише показав вам принцип - як зробити банер на сайті. (Дізнатися як зробити гіперпосилання , Читайте тут.) Створений банер, необхідно перенести в корінь вашого сайту, або в спеціально створену папку. Сподіваюся, пояснив правильно і вам все зрозуміло.

Як вставити банер на сайт

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

<a href="http://сайт_куда_направляет_баннер/" target="_blank"> <img src = "http: //путь_к_баннеру.gif" alt = "опис"> </a>

Зазвичай банер вставляють або в сайдбар, як ви можете бачити у мене справа, або в шапку. Також банер можна вставити і в саму статтю. Для того щоб вставити банер в сайдбар, вам необхідно зайти в адмін панель вашого сайту, вибрати там Зовнішній вигляд -> Віджети, і перетягнути направо звичайний текстовий віджет, туди прописуємо вищенаведений код.

Для вставки банера до статті вам необхідно відредагувати файл Single.php, і знайти там код виведення поста, у мене він прописаний так:

<Div id = "post - <? Php the_ID ();?>" Class = "article">

Після цього коду, у мене йде код виведення заголовка статті, якщо вставити відразу після нього, то ваш банер буде вгорі всіх статей.

Якщо ви хочете, щоб банер виводився в самому низу вашої статті, то вставляйте код виведення банера в самому низу файлу Single.php, не бійтеся експериментувати, якщо не до кінця розумієте куди вставляти код, вставили в одне місце - подивилися, якщо не там видалили і переставили в інше.

І так, методом проб і помилок ви підберете підходяще місце, теж саме стосується і виведення банера в шапці. Для цього вставляйте код у файл header.php.

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

Всім дякую!

Не забудьте подивитися відео як зробити банер на сайті!

Тому сьогодні я постараюся повністю освятити питання - Що таке банер?
Php the_ID ();?

Дополнительная информация

rss
Карта