Как сделать нажимающуюся кнопку


  •  

    → →

    Как сделать кнопку - для сайта?

    Зачем нужна кнопка на сайте? Ответ очевиден. Затем, чтобы, нажав на нее, посетитель попал на страницу, которую автор заготовил для этого случая. Важно, чтобы при этом цели посетителя и автора совпадали, чтобы посетитель нашел там именно то, что искал. В противном случае, такие переходы вызывают раздражение и ведут к покиданию сайта целевой аудиторией. А наша цель - не только задержать посетителя на сайте, но и подвигнуть его к совершению покупки, да еще, чтоб он это сделал с удовольствием...

    Как сделать кнопку - для сайта
    Как сделать кнопку - для сайта

    Как нарисовать кнопку?

    Воспользуемся сервисом Da Button Factory. Создание кнопки на этом сервисе - интуитивно понятно. Тем не менее, пройдемся по настройкам.

    Слева - настройки текста: шрифт, размер, начертание, цвет. Справа - настройки кнопки: форма, цвет, размер. В центре - текущее состояние кнопки, на котором сразу отображаются все вносимые изменения, а чуть ниже - сохранение кнопки.

    Как сделать кнопку - для сайта

    1. Введите текст, который должен отображаться на кнопке.

    2. Укажите нужный шрифт (Calibri), размер (20) и цвет (белый).

    3. Задайте жирность и наклон (не рекомендуется).

    4. Задайте тень, ее размер (1) и цвет (222222).

    Как сделать кнопку - для сайта

    5. Выберите форму кнопки - прямоугольник со скругленными углами (rounded box).

    6. Задайте радиус скругления - 5.

    7. Выберите вариант заливки - градиент (gradient).

    8. Задайте цвета градиента: верхний цвет и нижний цвет. Кнопка "swap" меняет цвета местами.

    9. Задайте параметры обводки - цвет и размер (2).

    10. Задайте параметры тени (не рекомендуется).

    11. Укажите фиксированные (fixed) размеры кнопки.

    Как сделать кнопку - для сайта

    12. Настройте параметры сохранения: тип - изображение (Image), формат - jpeg.

    13. Сохраните кнопку в папку "images" с названием "button".

    Как сделать кнопку - для сайта 

    14. Сделайте кнопку "button2", изменяя ТОЛЬКО цвета - повторите пункты 8-9.

    15. Сохраните кнопку "button2" в папку "images".

    Как сделать кнопку - для сайта

    Как вставить кнопку на сайт?

    Кнопка вставляется на сайт аналогично вставке любого изображения: в программе FrontPage открываете нужную страницу, щелкаете курсором в нужном месте, через иконку "Вставить рисунок из файла" выбираете в папке "images" файл "button", нажимаете "Открыть". Эти действия подробно изложены в уроке "Создаем сайт сами".

    Как сделать кнопку активной?

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

    Чтобы сделать кнопку активной, используйте простенький скрипт:

    <img src="images/Рисунок_1.jpeg" onmouseover="this.src='images/Рисунок_2.jpeg';" onmouseout="this.src='images/Рисунок_1.jpeg';">

    где "Рисунок_1" - это наш сохраненный "button", а "Рисунок_2" - "button2".

    Сделайте вид страницы "С разделением", кликните на изображение кнопки, вставьте указанный скрипт вместо выделенного. Замените "Рисунок_1" на "button", а "Рисунок_2" - на "button2".

    Как сделать кнопку - для сайта

    Сохраните страницу. Откройте ее из папки "Мой сайт". Если все правильно сделали, должно получиться так:

    Более подробно о том - как как сделать нажимающуюся кнопку сделать кнопку - в уроках Школы Продающих Сайтов Андрея Громова.



    Рекомендуем посмотреть ещё:


    Закрыть ... [X]

    Как добавить HTML -кнопку на сайт - Конструктор сайтов «Нубекс Как сделать цифру красивую цифру своими руками

    Как сделать нажимающуюся кнопку Как сделать нажимающуюся кнопку Как сделать нажимающуюся кнопку Как сделать нажимающуюся кнопку Как сделать нажимающуюся кнопку Как сделать нажимающуюся кнопку Как сделать нажимающуюся кнопку