Желаете научиться писать первоклассные статьи, которые будут приносить качественный трафик? Тогда скачайте мою БЕСПЛАТНУЮ книгу по ссылке справа.

Скачать книгу!
Главная страница » Создание сайтов » Делаем кнопку для сайта за 5 минут онлайн

Делаем кнопку для сайта за 5 минут онлайн

Здравствуйте, Дорогие читатели и посетители моего блога! В данной коротенькой статье мы поговорим о том, как сделать кнопку для сайта без особых усилий в онлайн. В этом нет ничего сложного, сейчас мы разберем один сервис, благодаря которому можно создавать красивые кнопки легко и быстро.Как сделать кнопку для сайта

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

Поэтому нужно стараться чтобы дизайн и юзабилити были для людей. Под словом дизайн и юзабилити я имею ввиду: аккуратность в шаблоне, привлекательность, красивый логотип, шапка, красивые кнопки и т.д. Как раз о кнопках мы сейчас и поговорим!

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

Сделать кнопку для сайта можно разными способами. С помощью каких программ, тот же Photoshop или еще как-то. Именно я предпочитаю работать в онлайн, и в этом мне помогает сервис Da Button Factory, о нем и пойдет речь далее. 

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

В этом нет ничего сложного, просто следуйте инструкции ниже (в картинках) и у Вас все безусловно получится. Давайте начнем...

1. Заходим на сайта dabuttonfactory.com

Кнопка для сайта - Da Button Factory

2. Вписывает текст, который хотим видеть на кнопке и настраиваем написание (блок слева) 

Настраиваем кнопку

Text — вписывает текст, который хотим видеть на кнопке

Font — шрифт написания. Хочу отметить, что не все поддерживают кириллицу

Bold — ставите галочку и текст становится жирным

[yandexd]

Italic — ставите галочку и текст становится курсивным

Size — думаю понятно, это размер текста

Color — цвет текста

Text shadow — хотите ли использовать тень? Если да, ставьте галочку

Distance to text — размер тени

Color — цвет тени

3. Настраиваем стиль кнопки (блок справа)

Кнопка для сайта

Style — выберите подходящий стиль из списка: квадратный, закругленные углы или овальный

Background — выберите стиль окраски и цвет

Border — поставьте галочку, если нужна рамка кнопки, и выберите цвет и размер

Shadow — поставьте галочку, если кнопки нужна тень, и выберите цвет и размер

4. Настраиваем размер кнопки (блок справа внизу)

Размер кнопки

5. Выбираем тип изображения: CSS или Image (блок слева внизу)

Тип изображения

Если выбираете тип Image, то остается лишь выбрать формат (рекомендую .png) и сохранить кнопку. Для этого необходимо просто нажать на саму кнопку или на надпись download внизу ее

Скачать кнопку для сайта

Если выбираете тип CSS background, необходимо скопировать код из окна CSS code в нужно Вам место, например в виджетах.

CSS код для вставки кнопки

6. Радуемся созданной кнопкой!

[yandexd]

Вот мы и сделали красивую кнопку онлайн. Ну как тяжело? Думаю, что нет. Благодаря данному сервису можно делать очень красивые кнопки всего за пять минут, а то и меньше. Поэтому не стоит, пропускать! Сделайте Ваш дизайн еще более красивее и удобнее.

Раньше я делал кнопки в Photoshop'е. Скажу честно — то еще занятие, намного тяжелее, чем то, что мы разобрали сейчас. Если бы я раньше знал про данный сервис, не мучился бы и не тратил свое время. Но ведь, что не делается, все к лучшему! Дерзайте, теперь Вы знаете — как сделать кнопку для сайта!

Также советую прочитать следующие статьи:

Обмен ссылками-Бесплатные качественные ссылки на сайт

Как установить Яндекс Поиск на сайт

Как создать карту сайта

Как проверить и ускорить загрузку сайта

И подписаться на обновления блога, чтобы не пропустить новых полезный статей. ---> Подписаться!

C уважением, Томский школьник!

автор блога SeoKos.RU

1 Звезда2 Звезды3 Звезды4 Звезды5 Звёзд (1 голос, в среднем: 3.00 из 5)
Loading...

Понравилась статья? Поделитесь с другими!

Хотите получать оповещения о новых статьях на свою электронную почту?
Тогда введите свой E-mail адрес в форму ниже и нажмите Enter:
Оставлено комментариев: 39
  1. Степан,

    Честно говоря прочитав начало я не понял какую кнопку для сайта мы создаем...

    P.S. Я так и не понял для чего кнопка!

    2013-01-18 в 5:18 пп |
    Ответить
  2. admin,

    Татьяна Саксон, Да, видео действительно очень смешное! :lol:

    2013-01-18 в 5:26 пп |
    Ответить
  3. admin,

    Степан, Внимательней нужно читать. Это простая кнопка при нажатие на которую будет открываться какая-либо страница. Сейчас напишу это в начале поста!

    2013-01-18 в 5:29 пп |
    Ответить
  4. Татьяна Саксон,

    :mrgreen: Медведь смешны, по ходу ему «Хорошо»

    А слон тоже не хуже.

    Так наржалась, что живот болит! :lol:

    2013-01-18 в 5:19 пп |
    Ответить
  5. Татьяна Чиронова,

    Классный сервис, давно пользуюсь им. Но кнопку обычно сохраняю просто как картинку на комп, если скопировать код, то там же будет ссылка на этот сервис. А зачем нам это?

    2013-01-19 в 7:12 дп |
    Ответить
    • admin,

      Татьяна Чиронова, Все верно, лучше сохранять картинку на компьютер, а потом на хостинг!

      2013-01-19 в 9:06 дп |
      Ответить
  6. Влад,

    Приветствую...

    Хотел спросить — возможно не по теме. Подскажи пожалуйста, у тебя реализована постраничная навигация «Показать больше» при помощи какого плагина ?

    Заранее спасибо...

    2013-01-19 в 1:12 пп |
    Ответить
    • admin,

      Влад, Здравствуйте! Это не плагин, это функция была встроена в шаблон.

      2013-01-19 в 4:15 пп |
      Ответить
  7. Александр,

    Да Костя, кнопки всегда лучше, чем обычные ссылки. Можно их делать и в сети. Но я предпочитаю фотошопить в таких случаях. :mrgreen:

    2013-01-19 в 1:27 пп |
    Ответить
    • Мозгунова Ирина,

      Да, Александр, кнопки очень украсят и сам сайт, и другие файлы — с кнопочками красивее получается всё!

      А вот работать с фотошопом умеют не все. поэтому, и сервис существует!

      2014-01-12 в 10:57 дп |
      Ответить
  8. Александр,

    admin:

    Степан, Внимательней нужно читать. Это простая кнопка при нажатие на которую будет открываться какая-либо страница. Сейчас напишу это в начале поста!

    А еще можно сделать кнопку БАБЛО. И нажимать на нее каждый день. Шутка.

    2013-01-19 в 1:30 пп |
    Ответить
  9. Сергей,

    Для тех, кто не умеет работать в фотошопе, хорошее решение задачи. Я лично предпочитаю фотошоп, пару минут и кнопка готова. ;-)

    2013-01-19 в 3:47 пп |
    Ответить
  10. Вадим,

    В принципе, конечно лучше смотрится сайт, всячески украшенный стрелочками, кнопочками и картинками — но это ведь влияет на скорость загрузки сайта. И Гугл не особо любит такие сайты.

    Поэтому стоит задуматься о необходимости лишней кнопки на блоге.

    С уважением, Вадим.

    2013-01-21 в 10:29 дп |
    Ответить
    • admin,

      Вадим, Я бы поспорил насчет снижения скорости, ведь такая кнопка имеет небольшой размер и вес.

      2013-01-21 в 10:36 дп |
      Ответить
  11. Александр,

    Вадим:

    В принципе, конечно лучше смотрится сайт, всячески украшенный стрелочками, кнопочками и картинками — но это ведь влияет на скорость загрузки сайта. И Гугл не особо любит такие сайты.

    Поэтому стоит задуматься о необходимости лишней кнопки на блоге.

    С уважением, Вадим.

    Если переживаешь за скорость загрузки, то просто ставишь плагин кеширования, а картинку сохраняешь в формате GIF. И все, проблема загрузки уже не проблема. ;-)

    2013-01-21 в 10:42 дп |
    Ответить
  12. Вадим,

    Спасибо!

    2013-01-21 в 11:00 дп |
    Ответить
  13. Никита Рябин,

    Вот за сервис большое спасибо, буду использовать!

    2013-01-23 в 7:00 дп |
    Ответить
  14. Света,

    Так как с фотошопом не очень дружу,спасибо за сайт,зашла и за минуту готова кнопка.

    2013-01-29 в 6:25 пп |
    Ответить
  15. Ольга,

    Cпасибо за сервис, надо взять на заметку, пригодится ;-)

    2013-01-30 в 7:12 дп |
    Ответить
  16. Vitalik,

    Полезная штука надо будет разместить в конце поста какого нибудь

    2013-02-01 в 9:25 дп |
    Ответить
  17. Людмила Винокурова,

    Александр:

    Да Костя, кнопки всегда лучше, чем обычные ссылки. Можно их делать и в сети. Но я предпочитаю фотошопить в таких случаях.

    Не все могут фотошопить, особенно новички, поэтому онлайн сервисы очень помогают! ;-)

    2013-02-03 в 7:57 пп |
    Ответить
  18. Людмила Винокурова,

    Спасибо, Костя, за информацию о сервисе, я всегда пользовалась сервисом cooltext.com., но информация лишней не бывает!

    2013-02-03 в 8:02 пп |
    Ответить
  19. Vitalik,

    А есть какой нибудь сервис для создания баннеров

    Людмила Винокурова:

    Александр:

    Да Костя, кнопки всегда лучше, чем обычные ссылки. Можно их делать и в сети. Но я предпочитаю фотошопить в таких случаях.

    Не все могут фотошопить, особенно новички, поэтому онлайн сервисы очень помогают!

    :?:

    2013-02-04 в 8:36 дп |
    Ответить
  20. Юлия,

    Я пользуюсь другим сервисом для кнопочек, даже рубрики себе такие сделала на сайт...http://cooltext.com/ насколько я поняла имеет больший ассортимент :razz:

    2013-04-02 в 2:33 пп |
    Ответить
  21. Арина,

    Ух ты себе завтра пойду сделаю. Я как та обезьянка, беру все, что блестит!

    2013-04-07 в 5:24 пп |
    Ответить
  22. Арина,

    Фотошоп не изучила, но кнопочка действительно делается легко. только что создала. все получилось. Спасибо!

    2013-04-07 в 5:53 пп |
    Ответить
  23. Юлия,

    Александр Василенко:

    Юлия:

    Обязательно воспользуюсь Вашей подсказкой. Спасибо за ссылку.

    Александр, я смотрю у Вас с Евгением конкурс на лучшего комментатора в разгаре

    :razz: Другим даже не угнаться уже...

    2013-04-17 в 6:05 дп |
    Ответить
  24. Александр Василенко,

    Юлия:

    Я пользуюсь другим сервисом для кнопочек, даже рубрики себе такие сделала на сайт...http://cooltext.com/ насколько я поняла имеет больший ассортимент

    Обязательно воспользуюсь Вашей подсказкой. Спасибо за ссылку.

    2013-04-17 в 5:56 дп |
    Ответить
  25. Александр Василенко,

    Юлия:

    Александр, я смотрю у Вас с Евгением конкурс на лучшего комментатора в разгаре

    Другим даже не угнаться уже... Через цитирование комментария у меня в модерацию попадают...

    Да, иногда приходится защищать свой титул. А что тут поделаешь

    :?:

    2013-04-17 в 6:09 дп |
    Ответить
  26. Дима Актив,

    Хороший, а главное простой сервис, на котором я сделал уже не одну кнопку, правда из них уже много у меня нигде не стоят, но всё же пока более — менее фотошоп не освоил, пользовался только им.

    2013-06-28 в 10:06 пп |
    Ответить
  27. Сергей,

    Огромное спасибо,очень хорошо все расписано ,буду пробовать

    2013-12-13 в 4:22 пп |
    Ответить
  28. Марина,

    :shock: хороший сервис и удобный, а главное очень простой и доступный!

    Кнопки нужны для чатов, для форумов, для блогов и сайтов. Спасибо создателям данного сервиса

    2013-12-21 в 2:09 пп |
    Ответить
  29. Алекс,

    Интересно было бы сделать кнопки на каждую статью. Думаю, как бы смотрелось это. Видел такое, но для рубрик.

    2013-12-27 в 6:01 дп |
    Ответить
  30. Денис Скрипник,

    Согласен, что кнопки для дизайна важны, но многие Seo специалисты не советуют использовать css в коде страницы (имеется в виду про код в тегах style).

    2014-01-10 в 9:16 пп |
    Ответить
  31. Мозгунова Ирина,

    Вот ведь имела как-то адрес этого сервиса по изготовлению кнопок — но потом потеряла!

    А здесь у Кости есть всё! Теперь буду создавать красивые кнопки сама!

    2014-01-12 в 10:52 дп |
    Ответить
  32. Сергей,

    про этот сервис не слышал да и кнопки не делал, ну все же спасибо за пост !

    2014-02-27 в 10:11 дп |
    Ответить
  33. Дина,

    Александр, спасибо! А как сделать на кнопке текст в столбик? Например: вопросы-

    ответы

    2014-03-19 в 3:28 пп |
    Ответить
  34. Алма,

    Константин, очень понятно и грамотно описано, как сделать кнопку онлайн.

    Я даже получила удовольствие от вашей статьи.

    Большое спасибо!

    2014-04-06 в 1:19 пп |
    Ответить
  35. Игорь,

    Костя благодарю за статью.

    Все подробно описано,спасибо большое

    2014-11-23 в 8:39 пп |
    Ответить
Оставить свой комментарий:

Эффективный блоггинг и инфобизнес с Белан Константином

Станьте моим партнером

© 2012-2015 | При копировании материала активная ссылка на сайт-первоисточник обязательна!

▲ Наверх