|
|
|
|
Как написать правильный код для баннера. Автор: Андрей Краснокутский Дата: 2010-04-24 Размещаем баннер на других сайтах.В прошлых наших статьях про баннеры, мы с Вами разобрались с понятием: "Что такое Баннер для сайта". Здесь мы узнали какие бывают баннеры (размеры баннеров) для чего вообще нужны баннеры, форматы баннеров и в каких случаях и где применяются баннеры разных форматов. Следующий наш материал "Как сделать простой не анимированный баннер" был посвящен созданию графической части баннера, т.е. созданию самой картинки баннера. В результате у нас получилась вот такая симпатичная кнопка, размером 88х31 пикселей:
Эта кнопка и будет баннером Вашего сайта. Хотя Вы можете сделать баннер любого, нужного Вам размера. Но это только графическая составляющая баннера, т.е. просто картинка, которая подгружается на сайт. Наша задача сделать из этого баннера (картинки) ссылку, нажав на которую, посетитель будет попадать на Ваш сайт. Значит, нам нужно еще написать для этого соответствующий код. Этот код Вы будете раздавать всем желающим для размещения на своих сайтах, каталогах и т.д. Давайте этим и займемся. Итак, картинку баннера мы создали. Давайте теперь назовем этот графический файл, например я назвал и сохранил эту картинку (графический файл) под именем: 88х31.gif . Соответственно имя файла 88х31, формат сохранения файла gif. Закачиваем этот файл к себе на сайт. Обычно для графических файлов на сайте создают отдельную папку, где и хранят все изображения для сайта. У меня это папка называется img. Сокращенно от английского images (изображения). Вы можете создать папку с другим названием и закачать туда эту картинку, как Вам будет удобно, но в таком случае в коде прописывайте реальное название папки, где будет лежать Ваш баннер. Теперь пишем во такой код:
Давайте разберем, что мы здесь написали. По сути дела это обычная ссылка, в якоре которой используется графический файл (картинка). Ссылку можно условно разбить на две части. Для простоты восприятия давайте так и сделаем. Первая часть кода, просто ссылка на сайт в данном случае ссылка на мой сайт LuksWeb.ru: <a href="http://www.luksweb.ru/" target=_blank>………..</a> Естественно Вы напишите вместо http://www.luksweb.ru/ адрес своего сайта. Параметр target=_blank «говорит» браузеру, что ссылка должна открыться в новом окне. Если вместо многоточия (………..) написать обычный текст, то ссылка на Ваш сайт будет текстовая, но все равно приведет на Ваш сайт. Еще то что здесь будет написано называют якорь ссылки. Но мы же делаем ссылку для баннера, значит, нам нужно на месте якоря, разместить код, вызывающий картинку (баннер). Пишем здесь вот такой код: <img src="http://www.luksweb.ru/img/88x31.gif" width="88" height="31" alt="Как сделать сайт бесплатно!!!" border="0"> Это и есть вызов графического баннера (картинки). Согласно спецификации HTML графические файлы разменяются на web страницы с помощью тега img. Тег src – определяет источник, откуда взять эту картинку, а дальше нам необходимо указать полный путь где лежит картинка, В данном случае: http://www.luksweb.ru/img/88x31.gif. Кстати путь заключается в кавычки. Далее мы расписываем: ширина картинки width="88" и высота картинки height="31". Тег alt – использовать необязательно, но желательно, здесь мы пишем всплывающую поясняющую надпись, которую посетитель увидит, когда наведет мышку на Ваш баннер. Обязательно устанавливайте параметр border="0" . Делается это для того, чтобы избежать рамки вокруг картинки, такой эффект наблюдается в HTML когда картинка является ссылкой. В большинстве случаев такая рамка портит внешний вид баннера. Иногда еще код заключают в комментарии, <!-- LuksWeb.ru --><!-- end LuksWeb.ru --> . Нагрузки такие комментарии не несут и в браузере не отображаются, а служат просто для удобства и позволяют отследить на web-странице (в коде web-страницы) начало и конец кода Вашего баннера. Поэтому рекомендую использовать комментарии. И полностью Ваш код выглядит так (естественно адрес сайта должен быть ваш):
Теперь, если разместить такой код на своём сайте, блоге, форуме и т.д. то при открытии этого сайта будет подгружаться баннер с моего сайта, нажав на который посетитель перейдет на сайт www.LuksWeb.ru . Если у Вас еще остались не понятные моменты, зайдите на страницу: http://www.luksweb.ru/our_links.php здесь Вы найдете разные варианты кода ссылок на наш сайт. Как текстовые так и графические, сравните эти коды между собой и Вам все станет понятно. P.S. Буду очень признателен и благодарен Вам, если Вы разместите нашу ссылку или баннер у себя на сайте, форуме или блоге. Можете даже изменить текстовую или графическую часть ссылки, но в таком случае, пожалуйста, напишите мне об этом.
Удачи.
Читаете так же: Вставляем изображение на web-страницу. Какими программами пользоваться для создания сайтов и для работы в Интернете? Скачать бесплатно Activ E-Book Compiller Как обналичить виртуальные деньги?
Просмотров: 58343 Поделитесь этой информацией со своими друзьями! Комментарии к этой статье (уроку): Комментарии добавил(а): Юлия Я сделала свой первый сайт! Буду признательна, если кто-нибудь разместит баннер у себя на сайте. Заранее благадарю. <!-- cdtdiamond.ru --><a href="http://www.cdtdiamond.ru/" target=_blank><img src="http://www.cdtdiamond.ru/img/cdtdiamond.gif" width="88" height="31" alt="Интернет бизнес!!!" border="0"></a><!-- end cdtdiamond.ru --> Комментарии добавил(а): Олег Гузь Андрей!Спасибо огромное за науку!Не только за эту статью, но и за все предыдущие!Я выполнил это задание и хочу продемонстрировать его не только тебе, но и всем посетителям твоего прекрасного сайта: <!-- biznesknigi.at.ua --><a href="http://biznesknigi.at.ua/" target=_blank><img src="http://biznesknigi.at.ua/-_12.jpg" width="200" height="200" alt="Скачать бесплатно книги по бизнесу!!!" border="0"></a><!-- end biznesknigi.at.ua --> Буду рад,и благодарен, если кто-то разместит код моего баннера у себя на сайте!Ребята, заранее всем спасибо!!! Комментарии добавил(а): саня Картинки не видно Комментарии добавил(а): АндрейК где не видно? Комментарии добавил(а): Семен Андрей, очень простой и понятный урок))) Спасибо тебе... Все получилось только вот у меня всплывающего текста нету(( Комментарии добавил(а): Юлия Андрей! Огромное спасибо, вы меня многому научили. Я постоянно пользуюсь Вашим сайтом. Мне нравится также реклама, много интересного. Удачи Вам! Комментарии добавил(а): killer Класс у меня все получилось, спасибо Комментарии добавил(а): AAA здравствуйте. спамибо за такой хороший сайт! Комментарии добавил(а): alexmare спасибо. Комментарии добавил(а): сергей Принимаем Баннеры и Ссылки на наш сайт! Принимаем Баннеры и Ссылки на сайт.Посещаемость более 3000 человек в день.Стоимость размещения баннера по левому или правому боку 1000 рублей в месяц.Стоимость размещения ссылки 500 рублей в месяц. Комментарии добавил(а): Сергей как удалть банер с экрана, просит 400р, 89851358993 Комментарии добавил(а): Александр <a href="http://www.zasvetitsya.ru/"><img src="http://www.zasvetitsya.ru/bann.jpg" width="30" height="30" border="0" longdesc="http://www.zasvetitsya.ru/bann.jpg" /></a> Комментарии добавил(а): VS Спасибо за урок. Комментарии добавил(а): амир как удалить 89160073332 на 400 руб помогите Комментарии добавил(а): Роман Отправте 300 руб на номер 89169404708 Комментарии добавил(а): Роман Помогите убрать банер просит отправить 300 рублей на номер 89169407408 Комментарии добавил(а): Revan Спасибо огромное сайту Комментарии добавил(а): Андрей Отпровлять смс безполезно Комментарии добавил(а): Андрей программа для удаления БАННЕРА С РАБОЧЕГО СТОЛА Комментарии добавил(а): гуля откуда достать код баннера???????????везде требуют смс за которую снимают немерено денег!!!!!!!!!!!!!!!!!!!!!!!1 Комментарии добавил(а): Женек Отличная программа для удаления баннера, помогло!!! спасибо его автору. Попробуйте поможет!!!! http://letitbit.net/download/02204.0a217087d492a7dfc930d52f7857/antibanner.exe.html Комментарии добавил(а): Егор У вас есть баннеры торопитесь могу рзместить стоимость 100 р за баннер на своём сайте Писать на w.egor@yandex.ru Комментарии добавил(а): волк помогите убрать банер просят 500 рублеи на мтс89859606842 Комментарии добавил(а): Алексей Спасибо! Все получилось! Комментарии добавил(а): Макс Банер создал. Надпись есть, но он прозрачный картинки нет. Что не правильно сделал? Комментарии добавил(а): АндрейК Здравствуйте Макс. Хороший вопрос.... Больных заочно не лечат Комментарии добавил(а): Наталия Андрей, спасибо за сайт! А можно так же доступно про анимиров. баннеры или кнопки-ссылки. Заранее благодарна. Комментарии добавил(а): александр как удалить баннер с экрана просит пополнить счет 500 рублей на номер 89060320946 Комментарии добавил(а): михаил размещу банер на своем сайте за 1евро Комментарии добавил(а): LenaR Сообщение от ElenaR Предлагаю реальный заработок в интернете.. Не торопитесь закрывать страницу не дочитав до конца, так-так реальный доход в ваших руках, система работает на все 200%. Комментарии добавил(а): Ахе Хорошая статья, хоть у меня сайт игровой тематики всеравно часто спрашивают как сделать баннер? скопирую статью на свой сайт с обратной ссылкой надеюсь автор не против Комментарии добавил(а): АндрейК Не против, копируйте, только не забывайте ставить обратные ссылки. А вот здесь: http://www.luksweb.ru/view_post.php?id=223 можно взять книгу про создание баннеров Комментарии добавил(а): Александр Спасибо большое! Очень доступно. Комментарии добавил(а): Татьяна Спасибо большое,пойду делать свой банер,а то сделала и не получился! Комментарии добавил(а): Эльгина Уменя 6 баннеров. Все прописываю, вроде правильно. Но два баннера работают, а остальные не открываются. Подскажите почему? Комментарии добавил(а): asaw <a href="http://www.luksweb.ru/" target=_blank><img src="http://www.luksweb.ru/img/88x31.gif" width="88" height="31" alt="Как сделать сайт бесплатно!!!" border="0"></a> Комментарии добавил(а): Темир А если у меня банер в swf формате? чета я сделал не у меня не получилось Комментарии добавил(а): миша <a href="http://www.luksweb.ru/" target=_blank><img src="http://www.luksweb.ru/img/88x31.gif" width="88" height="31" alt="Как сделать сайт бесплатно!!!" border="0"></a> Комментарии добавил(а): Юрий Петрович Андрей спасибо,у меня все получилось.Я установил GIF файл на свой сайт,сделал описание Вашего урока своими словами и сделал ссылку на Ваш сайт. Можете попробовать поставить Такую кнопку. <a href="http://www.videopetrovich.com/" target=_blank><img src= "http://u.jimdo.com/www49/o/sa046e1c2be7d6185/img/i86fec29be515374a/1348415341/std/image.gif" width="45" height="450" alt= "Меню этого сайта!!!" border="0"></a> А это мой сайт: http://www.videopetrovich.com/ С этой страницы можно перейти на Ваш сайт. С уважением, Юрий Петрович. sedov105@yandex.ru Комментарии добавил(а): Светлана Спасибо огромное.Хорошим чутким языком написано. Всё получилось быстро и без проблем. Обязательно поставлю у себя на сайте ссылочку к Вам. Ещё раз СПАСИБО!!! Комментарии добавил(а): S.Fox =) спс за инфу! Комментарии добавил(а): ROMAKOLONJKA SPS за информацию! Удачи Комментарии добавил(а): Наталья Добрый день! А как сделать так, чтобы при нажатии на баннер посетитель попадал не сразу на сайт, а на прокладку с картинкой и надписью: ждите...идет перенаправление и через 3 сек. уже открывался нужный сайт? Комментарии добавил(а): Yuhan Хоть я и не новичёк, но подзабыл. Спасибо! Комментарии добавил(а): СВЕТЛАНА ПЛИЗ,РАЗМЕСТИТЕ МОЙ БАННЕР <!--lazur.my1.ru --><a href="http://www.lazur.my1.ru/" target=_blank><img src=http://lazur.my1.ru/banner/baner.jpg " width="88" height="31" alt="Каталог гостиниц"></a> Добавить Ваш комментарий: |
Новости сайта Домены 
Google Adsense |
Навигация
Видео Курсы
Последние заметки
Новости сайта
Архив 2016 год: 2015 год: 2014 год: 2013 год: 2012 год: 2011 год: 2010 год: 2009 год: 2008 год: Сайты друзей Наши ссылки
Если Вам понравился  Наши Аттестаты
|
|
Разрешается полное или частичное копирование материалов сайта с обязательным |