Здравствуйте, Дорогие читатели и посетители моего блога! В данной коротенькой статье мы поговорим о том, как сделать кнопку для сайта без особых усилий в онлайн. В этом нет ничего сложного, сейчас мы разберем один сервис, благодаря которому можно создавать красивые кнопки легко и быстро.
Думаю многие уже знают, что дизайн сайта - очень важный фактор для продвижения и заработка. Ведь чем красивей дизайн, тем будет больше людей заходить. И если дизайн привлекает и притягивает то, тот кто зашел, позовет еще своих друзей. И так цепочка...
Поэтому нужно стараться чтобы дизайн и юзабилити были для людей. Под словом дизайн и юзабилити я имею ввиду: аккуратность в шаблоне, привлекательность, красивый логотип, шапка, красивые кнопки и т.д. Как раз о кнопках мы сейчас и поговорим!
Кнопка, которую мы будет делать нужна для того, чтобы как-нибудь украсить гиперссылку. То есть при нажатии на кнопку будет производиться переход на какую-то страницу.
Сделать кнопку для сайта можно разными способами. С помощью каких программ, тот же Photoshop или еще как-то. Именно я предпочитаю работать в онлайн, и в этом мне помогает сервис Da Button Factory, о нем и пойдет речь далее.
Как сделать кнопку для сайта
В этом нет ничего сложного, просто следуйте инструкции ниже (в картинках) и у Вас все безусловно получится. Давайте начнем...
1. Заходим на сайта dabuttonfactory.com
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 в нужно Вам место, например в виджетах.
6. Радуемся созданной кнопкой!
[yandexd]
Вот мы и сделали красивую кнопку онлайн. Ну как тяжело? Думаю, что нет. Благодаря данному сервису можно делать очень красивые кнопки всего за пять минут, а то и меньше. Поэтому не стоит, пропускать! Сделайте Ваш дизайн еще более красивее и удобнее.
Раньше я делал кнопки в Photoshop'е. Скажу честно — то еще занятие, намного тяжелее, чем то, что мы разобрали сейчас. Если бы я раньше знал про данный сервис, не мучился бы и не тратил свое время. Но ведь, что не делается, все к лучшему! Дерзайте, теперь Вы знаете — как сделать кнопку для сайта!
Также советую прочитать следующие статьи:
- Обмен ссылками-Бесплатные качественные ссылки на сайт
— Как установить Яндекс Поиск на сайт
- Как проверить и ускорить загрузку сайта
И подписаться на обновления блога, чтобы не пропустить новых полезный статей. ---> Подписаться!
C уважением, Томский школьник!
автор блога SeoKos.RU
Честно говоря прочитав начало я не понял какую кнопку для сайта мы создаем...
P.S. Я так и не понял для чего кнопка!
Татьяна Саксон, Да, видео действительно очень смешное!
Степан, Внимательней нужно читать. Это простая кнопка при нажатие на которую будет открываться какая-либо страница. Сейчас напишу это в начале поста!
А слон тоже не хуже.
Так наржалась, что живот болит!
Классный сервис, давно пользуюсь им. Но кнопку обычно сохраняю просто как картинку на комп, если скопировать код, то там же будет ссылка на этот сервис. А зачем нам это?
Татьяна Чиронова, Все верно, лучше сохранять картинку на компьютер, а потом на хостинг!
Приветствую...
Хотел спросить — возможно не по теме. Подскажи пожалуйста, у тебя реализована постраничная навигация «Показать больше» при помощи какого плагина ?
Заранее спасибо...
Влад, Здравствуйте! Это не плагин, это функция была встроена в шаблон.
Да Костя, кнопки всегда лучше, чем обычные ссылки. Можно их делать и в сети. Но я предпочитаю фотошопить в таких случаях.
Да, Александр, кнопки очень украсят и сам сайт, и другие файлы — с кнопочками красивее получается всё!
А вот работать с фотошопом умеют не все. поэтому, и сервис существует!
А еще можно сделать кнопку БАБЛО. И нажимать на нее каждый день. Шутка.
Для тех, кто не умеет работать в фотошопе, хорошее решение задачи. Я лично предпочитаю фотошоп, пару минут и кнопка готова.
В принципе, конечно лучше смотрится сайт, всячески украшенный стрелочками, кнопочками и картинками — но это ведь влияет на скорость загрузки сайта. И Гугл не особо любит такие сайты.
Поэтому стоит задуматься о необходимости лишней кнопки на блоге.
С уважением, Вадим.
Вадим, Я бы поспорил насчет снижения скорости, ведь такая кнопка имеет небольшой размер и вес.
Если переживаешь за скорость загрузки, то просто ставишь плагин кеширования, а картинку сохраняешь в формате GIF. И все, проблема загрузки уже не проблема.
Спасибо!
Вот за сервис большое спасибо, буду использовать!
Так как с фотошопом не очень дружу,спасибо за сайт,зашла и за минуту готова кнопка.
Cпасибо за сервис, надо взять на заметку, пригодится
Полезная штука надо будет разместить в конце поста какого нибудь
Не все могут фотошопить, особенно новички, поэтому онлайн сервисы очень помогают!
Спасибо, Костя, за информацию о сервисе, я всегда пользовалась сервисом cooltext.com., но информация лишней не бывает!
А есть какой нибудь сервис для создания баннеров
Людмила Винокурова:
Александр:
Да Костя, кнопки всегда лучше, чем обычные ссылки. Можно их делать и в сети. Но я предпочитаю фотошопить в таких случаях.
Не все могут фотошопить, особенно новички, поэтому онлайн сервисы очень помогают!
Я пользуюсь другим сервисом для кнопочек, даже рубрики себе такие сделала на сайт...http://cooltext.com/ насколько я поняла имеет больший ассортимент
Ух ты себе завтра пойду сделаю. Я как та обезьянка, беру все, что блестит!
Фотошоп не изучила, но кнопочка действительно делается легко. только что создала. все получилось. Спасибо!
Александр, я смотрю у Вас с Евгением конкурс на лучшего комментатора в разгаре
Обязательно воспользуюсь Вашей подсказкой. Спасибо за ссылку.
Да, иногда приходится защищать свой титул. А что тут поделаешь
Хороший, а главное простой сервис, на котором я сделал уже не одну кнопку, правда из них уже много у меня нигде не стоят, но всё же пока более — менее фотошоп не освоил, пользовался только им.
Огромное спасибо,очень хорошо все расписано ,буду пробовать
Кнопки нужны для чатов, для форумов, для блогов и сайтов. Спасибо создателям данного сервиса
Интересно было бы сделать кнопки на каждую статью. Думаю, как бы смотрелось это. Видел такое, но для рубрик.
Согласен, что кнопки для дизайна важны, но многие Seo специалисты не советуют использовать css в коде страницы (имеется в виду про код в тегах style).
Вот ведь имела как-то адрес этого сервиса по изготовлению кнопок — но потом потеряла!
А здесь у Кости есть всё! Теперь буду создавать красивые кнопки сама!
про этот сервис не слышал да и кнопки не делал, ну все же спасибо за пост !
Александр, спасибо! А как сделать на кнопке текст в столбик? Например: вопросы-
ответы
Константин, очень понятно и грамотно описано, как сделать кнопку онлайн.
Я даже получила удовольствие от вашей статьи.
Большое спасибо!
Костя благодарю за статью.
Все подробно описано,спасибо большое