Кнопка «Скачать» — html код кнопки для сайта
Пишите о программах и предлагаете своим читателям ссылку на её скачивание? Эта статья для вас. Теперь не нужно создавать, искать и сохранять к себе на сайт картинки красивых кнопки «Скачать Бесплатно», «Скачать Сейчас» и т. д. на сайт. Добавьте статью в закладки и используйте предложенный HTML-код для вставки подходящей кнопки.
Зелёная кнопка «Скачать бесплатно»
Зелёный — это цвет безопасности, что располагает к доверию. Кнопка большая — 180х60 пикселей. Основной акцент сделан на слове «Скачать», а «бесплатно» идёт с небольшой прозрачностью. Таким образом, кнопка получилась не кричащей, но акцентирующей основное внимание на действии.
Скачать бесплатно
HTML-код для вставки на страницу:
<img alt="Скачать бесплатно" src="/-ZdVyAMF257w/UAur4Wy32vI/AAAAAAAADNY/KQRKtJPYEDw/s180/download_free.png"/>
Общий формат HTML-кода кнопки:
<p align="center"><a href="/" target="_blank"><img alt="Скачать Бесплатно" src="/-ZdVyAMF257w/UAur4Wy32vI/AAAAAAAADNY/KQRKtJPYEDw/s180/download_free.png"></a></p>
Синяя кнопка «Скачать сейчас (free)»
Синий — цвет нейтральный, но ассоциируется у нас с цветом ссылки, т. е. активного элемента. Призыв к действию — более очевиден, т. к. скачать предлагается «сейчас». Свою роль играет и оранжевая ленточка с надписью «free», слово «бесплатно» слишком длинное. Оранжевый — цвет действия. У меня он переходит в красный — цвет активности. Градиент позволяет свести к минимуму агрессию. Размер кнопки 223x55 пикселей.
HTML-код для вставки на страницу:
<img alt="Скачать Сейчас" src="/-JY240nxLf7g/UfOsHsRGEpI/AAAAAAAALms/KzvA8Gdu0SU/s800/download-now.png"/>
Общий формат HTML-кода кнопки:
<p align="center"><a href="/" target="_blank"><img alt="Скачать Сейчас" src="/-JY240nxLf7g/UfOsHsRGEpI/AAAAAAAALms/KzvA8Gdu0SU/s800/download-now.png"/></a></p>
Кнопка «Скачать бесплатно» из набора инфобизнесмена
Этот вариант был взят из набора графики для инфобизнеса. Всё тот же нейтральный синий цвет, но надпись без CapsLock. Получился умеренный призыв к действию. Основной особенностью кнопки я считаю красивую тень. Размер кнопки очень большой — 240х110 пикселей. Кнопка в большей степени подойдёт для большого пространства, но может вписаться и в тот же сайдбар.
Скачать бесплатно!
HTML-код для вставки на страницу:
<img alt="Скачать бесплатно!" src="/-o3RbrlgGkLg/UQu0pgMrjtI/AAAAAAAAI3s/eA6L7Y4H_NI/w240-h110-no/download-free.png"/>
Общий формат HTML-кода кнопки:
<p align="center"><a href="/" target="_blank"><img alt="Скачать бесплатно!" src="/-o3RbrlgGkLg/UQu0pgMrjtI/AAAAAAAAI3s/eA6L7Y4H_NI/w240-h110-no/download-free.png"/></a></p>
Кнопка «Скачать бесплатно» в стиле Яндекс
Наверное, заходя на страницу скачивания сервиса Яндекс.Диск, Вам встречались достаточно простые и привлекательные кнопки для сохранения и скачивания файлов. Я решил объединить их и создать свою кнопку. Жёлтый — цвет действия, а стрелочка — достаточно привычная и понятная иконка для скачивания.
HTML-код для вставки на страницу:
<img alt="Скачать бесплатно!" src="/-VkO3l0waVFg/VJsc1CVz9tI/AAAAAAAAEKA/kkrcMjQwnx4/w168-h29-no/download-y.png"/>
Общий формат HTML-кода кнопки:
<p align="center"><a href="/" target="_blank"><img alt="Скачать бесплатно!" src="/-VkO3l0waVFg/VJsc1CVz9tI/AAAAAAAAEKA/kkrcMjQwnx4/w168-h29-no/download-y.png"/></a></p>
Особенности использования кнопок для скачивания
Кнопка воспринимается пользователем как более активный элемент, чем ссылка. Из-за этого количество кликов по кнопке будет больше, чем по обычной ссылке. Чтобы предать кнопке более выраженный характер активного элемента, я использовал тень, кнопка как бы «парит» и призывает кликнуть её. Безусловно, мы уже привыкли ко всем этим трюкам, но оно работает.
Главное помнить, что пользователь должен получить именно то, что вы ему предлагает. Согласитесь, не правильно предлагать скачать что-то бесплатно в обмен на подписку или заработок на файлообменниках. Тем не менее, будем реалистами, всё имеет свою цену. Сыр он остаётся сыром и в мышеловке. На этом у меня всё. Спасибо за внимание. Удачи!
Короткая ссылка: http://goo.gl/8inaJp