Как создать свой сайт бесплатно? Как сделать сайт своими руками? Как заработать в Интернете? Создание сайтов на заказ.

Запрос должен быть не менее 4-х символов.

RSS-лента

Сегодня:        Добавить в Избранное       Написать Автору        Обмен валют        Оплата сервисов

Как написать правильный код для баннера.

Автор: Андрей Краснокутский

Дата: 2010-04-24

Размещаем баннер на других сайтах.

В прошлых наших статьях про баннеры, мы с Вами разобрались с понятием: "Что такое Баннер для сайта". Здесь мы узнали какие бывают баннеры (размеры баннеров) для чего вообще нужны баннеры, форматы баннеров и в каких случаях и где применяются баннеры разных форматов.

Следующий наш материал "Как сделать простой не анимированный баннер" был посвящен созданию графической части баннера, т.е. созданию самой картинки баннера. В результате у нас получилась вот такая симпатичная кнопка, размером 88х31 пикселей:

Эта кнопка и будет баннером Вашего сайта. Хотя Вы можете сделать баннер любого, нужного Вам размера.

Но это только графическая составляющая баннера, т.е. просто картинка, которая подгружается на сайт. Наша задача сделать из этого баннера (картинки) ссылку, нажав на которую, посетитель будет попадать на Ваш сайт. Значит, нам нужно еще написать для этого соответствующий код. Этот код Вы будете раздавать всем желающим для размещения на своих сайтах, каталогах и т.д. Давайте этим и займемся.

Итак, картинку баннера мы создали. Давайте теперь назовем этот графический файл, например я назвал и сохранил эту картинку (графический файл) под именем: 88х31.gif . Соответственно имя файла 88х31, формат сохранения файла gif.

Закачиваем этот файл к себе на сайт. Обычно для графических файлов на сайте создают отдельную папку, где и хранят все изображения для сайта. У меня это папка называется img. Сокращенно от английского images (изображения). Вы можете создать папку с другим названием и закачать туда эту картинку, как Вам будет удобно, но в таком случае в коде прописывайте реальное название папки, где будет лежать Ваш баннер.

Теперь пишем во такой код:

<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>

Давайте разберем, что мы здесь написали. По сути дела это обычная ссылка, в якоре которой используется графический файл (картинка). Ссылку можно условно разбить на две части. Для простоты восприятия давайте так и сделаем.

Первая часть кода, просто ссылка на сайт в данном случае ссылка на мой сайт 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-страницы) начало и конец кода Вашего баннера. Поэтому рекомендую использовать комментарии.

И полностью Ваш код выглядит так (естественно адрес сайта должен быть ваш):

<!-- LuksWeb.ru --><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><!-- end LuksWeb.ru -->

Теперь, если разместить такой код на своём сайте, блоге, форуме и т.д. то при открытии этого сайта будет подгружаться баннер с моего сайта, нажав на который посетитель перейдет на сайт www.LuksWeb.ru .

Если у Вас еще остались не понятные моменты, зайдите на страницу: http://www.luksweb.ru/our_links.php здесь Вы найдете разные варианты кода ссылок на наш сайт. Как текстовые так и графические, сравните эти коды между собой и Вам все станет понятно.

P.S. Буду очень признателен и благодарен Вам, если Вы разместите нашу ссылку или баннер у себя на сайте, форуме или блоге. Можете даже изменить текстовую или графическую часть ссылки, но в таком случае, пожалуйста, напишите мне об этом.

 

Удачи.

 

Читаете так же:

Как делаются ссылки в HTML.

Вставляем изображение на web-страницу.

Что такое тИЦ и PR ?

Какими программами пользоваться для создания сайтов и для работы в Интернете?

Скачать бесплатно Activ E-Book Compiller

Как обналичить виртуальные деньги?

 

Просмотров: 47989


Поделитесь этой информацией со своими друзьями!


Комментарии к этой статье (уроку):

Комментарии добавил(а): Юлия
Дата: 2010-08-08

Я сделала свой первый сайт! Буду признательна, если кто-нибудь разместит баннер у себя на сайте. Заранее благадарю. <!-- 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 -->

Комментарии добавил(а): Олег Гузь
Дата: 2010-04-29

Андрей!Спасибо огромное за науку!Не только за эту статью, но и за все предыдущие!Я выполнил это задание и хочу продемонстрировать его не только тебе, но и всем посетителям твоего прекрасного сайта: <!-- 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 --> Буду рад,и благодарен, если кто-то разместит код моего баннера у себя на сайте!Ребята, заранее всем спасибо!!!

Комментарии добавил(а): саня
Дата: 2010-07-01

Картинки не видно

Комментарии добавил(а): АндрейК
Дата: 2010-07-02

где не видно?

Комментарии добавил(а): Семен
Дата: 2010-08-01

Андрей, очень простой и понятный урок))) Спасибо тебе... Все получилось только вот у меня всплывающего текста нету((

Комментарии добавил(а): Юлия
Дата: 2010-08-06

Андрей! Огромное спасибо, вы меня многому научили. Я постоянно пользуюсь Вашим сайтом. Мне нравится также реклама, много интересного. Удачи Вам!

Комментарии добавил(а): killer
Дата: 2010-08-25

Класс у меня все получилось, спасибо

Комментарии добавил(а): AAA
Дата: 2010-08-29

здравствуйте. спамибо за такой хороший сайт!

Комментарии добавил(а): alexmare
Дата: 2010-11-22

спасибо.

Комментарии добавил(а): сергей
Дата: 2010-12-14

Принимаем Баннеры и Ссылки на наш сайт! Принимаем Баннеры и Ссылки на сайт.Посещаемость более 3000 человек в день.Стоимость размещения баннера по левому или правому боку 1000 рублей в месяц.Стоимость размещения ссылки 500 рублей в месяц.

Комментарии добавил(а): Сергей
Дата: 2010-12-15

как удалть банер с экрана, просит 400р, 89851358993

Комментарии добавил(а): Александр
Дата: 2010-12-16

<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
Дата: 2010-12-19

Спасибо за урок.

Комментарии добавил(а): амир
Дата: 2010-12-23

как удалить 89160073332 на 400 руб помогите

Комментарии добавил(а): Роман
Дата: 2010-12-24

Отправте 300 руб на номер 89169404708

Комментарии добавил(а): Роман
Дата: 2010-12-24

Помогите убрать банер просит отправить 300 рублей на номер 89169407408

Комментарии добавил(а): Revan
Дата: 2010-12-26

Спасибо огромное сайту

Комментарии добавил(а): Андрей
Дата: 2011-01-03

Отпровлять смс безполезно

Комментарии добавил(а): Андрей
Дата: 2011-01-04

программа для удаления БАННЕРА С РАБОЧЕГО СТОЛА

Комментарии добавил(а): гуля
Дата: 2011-01-07

откуда достать код баннера???????????везде требуют смс за которую снимают немерено денег!!!!!!!!!!!!!!!!!!!!!!!1

Комментарии добавил(а): Женек
Дата: 2011-01-30

Отличная программа для удаления баннера, помогло!!! спасибо его автору. Попробуйте поможет!!!! http://letitbit.net/download/02204.0a217087d492a7dfc930d52f7857/antibanner.exe.html

Комментарии добавил(а): Егор
Дата: 2011-02-10

У вас есть баннеры торопитесь могу рзместить стоимость 100 р за баннер на своём сайте Писать на w.egor@yandex.ru

Комментарии добавил(а): волк
Дата: 2011-02-15

помогите убрать банер просят 500 рублеи на мтс89859606842

Комментарии добавил(а): Алексей
Дата: 2011-02-05

Спасибо! Все получилось!

Комментарии добавил(а): Макс
Дата: 2011-02-19

Банер создал. Надпись есть, но он прозрачный картинки нет. Что не правильно сделал?

Комментарии добавил(а): АндрейК
Дата: 2011-02-19

Здравствуйте Макс. Хороший вопрос.... Больных заочно не лечат

Комментарии добавил(а): Наталия
Дата: 2011-03-15

Андрей, спасибо за сайт! А можно так же доступно про анимиров. баннеры или кнопки-ссылки. Заранее благодарна.

Комментарии добавил(а): александр
Дата: 2011-08-01

как удалить баннер с экрана просит пополнить счет 500 рублей на номер 89060320946

Комментарии добавил(а): михаил
Дата: 2011-09-22

размещу банер на своем сайте за 1евро

Комментарии добавил(а): LenaR
Дата: 2011-10-10

Сообщение от ElenaR Предлагаю реальный заработок в интернете.. Не торопитесь закрывать страницу не дочитав до конца, так-так реальный доход в ваших руках, система работает на все 200%.

Комментарии добавил(а): Ахе
Дата: 2011-10-18

Хорошая статья, хоть у меня сайт игровой тематики всеравно часто спрашивают как сделать баннер? скопирую статью на свой сайт с обратной ссылкой надеюсь автор не против

Комментарии добавил(а): АндрейК
Дата: 2011-10-20

Не против, копируйте, только не забывайте ставить обратные ссылки. А вот здесь: http://www.luksweb.ru/view_post.php?id=223 можно взять книгу про создание баннеров

Комментарии добавил(а): Александр
Дата: 2011-11-18

Спасибо большое! Очень доступно.

Комментарии добавил(а): Татьяна
Дата: 2011-12-12

Спасибо большое,пойду делать свой банер,а то сделала и не получился!

Комментарии добавил(а): Эльгина
Дата: 2011-12-25

Уменя 6 баннеров. Все прописываю, вроде правильно. Но два баннера работают, а остальные не открываются. Подскажите почему?

Комментарии добавил(а): asaw
Дата: 2012-02-26

<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>

Комментарии добавил(а): Темир
Дата: 2012-04-04

А если у меня банер в swf формате? чета я сделал не у меня не получилось

Комментарии добавил(а): миша
Дата: 2012-05-10

<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>

Комментарии добавил(а): Юрий Петрович
Дата: 2012-09-23

Андрей спасибо,у меня все получилось.Я установил 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

Комментарии добавил(а): Светлана
Дата: 2012-09-25

Спасибо огромное.Хорошим чутким языком написано. Всё получилось быстро и без проблем. Обязательно поставлю у себя на сайте ссылочку к Вам. Ещё раз СПАСИБО!!!

Комментарии добавил(а): S.Fox
Дата: 2012-11-28

=) спс за инфу!

Комментарии добавил(а): ROMAKOLONJKA
Дата: 2013-10-05

SPS за информацию! Удачи

Комментарии добавил(а): Наталья
Дата: 2014-08-22

Добрый день! А как сделать так, чтобы при нажатии на баннер посетитель попадал не сразу на сайт, а на прокладку с картинкой и надписью: ждите...идет перенаправление и через 3 сек. уже открывался нужный сайт?

Комментарии добавил(а): Yuhan
Дата: 2015-10-01

Хоть я и не новичёк, но подзабыл. Спасибо!

Комментарии добавил(а): СВЕТЛАНА
Дата: 2016-07-05

ПЛИЗ,РАЗМЕСТИТЕ МОЙ БАННЕР <!--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>

Добавить Ваш комментарий:

Введите сумму чисел с картинки:
Введите сумму чисел

GudzonPartner.com

Новости сайта


05.08.2014
Новый раздел! Платежные системы Интернета. Все о платежных системах и сервисах.

09.08.2013
Новинка! Обзор и Анализ реальных способов заработка. Как и Сколько можно заработать в Интернете? Цифры. Факты. Комментарии.

28.05.2013
Обновилась Партнерка сайта! Зарабатывайте вместе с нами! "Новые товары и рекламные материалы"

25.05.2013
Видео Курс! "Как создать свой Информационный Бизнес в Интернете" Зарабатывайте: от 30000 ++ рублей.

Почтовая рассылка! Бесплатные электронные книги из серии: "Секреты создания сайтов"


Почтовая рассылка

Новинка!
Как реально заработать
в Интернете?
"Обзор видов и способов заработка."

Специальный Отчет:

Специальный Отчет: Как и сколько можно реально заработать в Интернете? Рельные цифры, факты и анализ различных способ заработка в Интернете

В подарок всем подписчикам!

SmartResponder.ru
Ваш e-mail: *
Ваше имя: *

Полный список наших почтовых рассылок!

Домены

Сервис мгновенной регистрации Доменов

Google Adsense



Навигация

Уроки HTML

CSS уроки

Статьи

Инструменты

Шаблоны сайтов

Книги

Украшения

Сайт от А до Я

Заработать в Интернете

Обман в Интернете

Охрана труда

МОДУЛЬНЫЕ КАРТИНЫ

PHP УРОКИ

Услуги

Скрипты

Почтовая Рассылка

SEO

jQuery

Специальная оценка условий труда (СОУТ) - АРМ

Платежные системы Интернета

УРОКИ ФОТОШОП

Секретный раздел

Видео Курсы

Видео курс по созданию сайтов: Сайт от А до Я
С нами сделать сайт
сможет даже Ребёнок!
"Сайт от А до Я"
Узнать сейчас >>>


Хотите заработать?
2-х Уровневая
Партнерская программа!

Присоединяйтесь.


Последние заметки

Модульная картина: Роскошь красного бархата

Модульная картина абстракция: Энергия солнца

Модульная картина: Синие розы

Модульная картина: Водопад

Модульная картина: Орхидеи

Новости сайта

RSS Лента Новостей сайта www.LuksWeb.ru

Наши новости в Твиттере

Архив

2016 год:

2015 год:

2014 год:

2013 год:

2012 год:

2011 год:

2010 год:

2009 год:

2008 год:

Сайты друзей

Регистрация доменов

ООО "ПК "ЛюксСтрой"

Деревянные дома от СПК "Ванда"

Наши ссылки

Если Вам понравился
наш сайт, установите
Нашу ссылку, и
Получите подарки!!!

QR код сайта www.LuksWeb.ru

Наши Аттестаты


Проверить аттестат

 

Аттестован системой Z-PAYMENT
Проверено Z-PAYMENT