Як Зробити Кнопки Для Розділів Сайту

Що таке кнопка розділу сайту?Це картинка, при кліці по якій користувач потрапляє на іншу сторінку сайту.

Зазвичай всі графічні елементи сайту створюють у фотошопі (графічному редакторі).Але частосайтостроітелі — новачкамце не під силу.Тому я знайшла інше рішення цього питання.

Є ось такий цікавий сервіс — http://www.dabuttonfactory.com.Цей сервіс абсолютно безкоштовний.Там можна вибрати різні дизайни кнопочок і зробити на них потрібні написи.

Але сервіс англійською мовою.Тому я покажу процес створення кнопочки на прикладі.Готові?Приступаємо.

Заходить на сайт http://www.dabuttonfactory.com.Зручно те, що в процесі створення кнопочки Ви будете бачити результат внесених змін і коригувати так, як Вам потрібно.

Перше поле TEXT — вводимо тут текст, який повинен бути на кнопці.Наприклад, я вводжу НОВИНИ.Зміни відразу видно в центрі екрану.

Вибираємо шрифт Font.Вибираю Sans-serif.Bold — Жирний.Italic — курсив.Позначте галочкою те, що потрібно.Я залишаю Bold, галочку з Italic знімаю.

Size розмір шрифту.Плюсик або мінусом можна збільшувати або зменшувати.Я зупинилася на 17.

Color — колір шрифту.Якщо клікнути по цьому віконця, можна вибрати на палітрі потрібний колір.Я залишила білий.Щоб палітра згорнулася після того, як Ви вибрали потрібний колір, клацніть в будь-яку область екрану або натисніть кнопку Escape.

Text Shadow — тінь у тексту.Distance — відстань від тексту до тіні.Color — колір тіні.Пробуйте.Ви будете бачити результат.

Output type — Формат готового варіанту.Нам потрібна картинка Image, нехай буде в форматі jpeg.

Переходимо до правої частини екрану.Button Type — можливі варіанти — кругла, квадратна і з закругленими кутами.Я залишила круглу.

Background — фон кнопки.Можна вибрати монокольорів, тобто один колір, два кольори, градієнт — перелив від одного кольору до іншого.Відповідно, кольору вибрати поруч.Поекспериментуйте.Я вибрала градієнт від жовтого до помаранчевого.

Border — кордон кнопки, обведення іншими словами.Якщо поставити тут галочку, то потрібно вибрати розмір кордону і колір.Я цей параметр не включаю.

Shadow — тінь кнопки.Також потрібно вибрати колір тіні і відстань від кнопки до тіні.Робіть як більше подобається.Я роблю без тіні.

Size — розмір кнопки.Variable — варіюється в залежності від довжини тексту на кнопці.Можна задати інтервали, які повинні бути навколо тексту.Я вибираю Fixed — фіксований розмір (тобто незалежно від довжини тексту).І задаю ширину — 150 і висоту 50.

Ось що у мене в підсумку вийшло.

Тепер Вам потрібно зберегти вашу кнопочку на вашому комп’ютері.Для цього клікаєм по ній.Вискакує віконце збереження файлу button.jpeg.Ось вона — картинка нашої кнопочки.

Далі цю картинку розміщуємо на сайті, перетворюємо картинку на заслання, яка буде вести відвідувача на потрібну сторінку вашого сайту.І Все!Всі ці операції детально описані в моєму курсі Що нам варто сайт побудувати (в главі 10Як послати покупця або вчимося створювати посилання).Тому тут я вже не буду на цьому детально зупинятися.