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

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







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







Є ось такий цікавий сервіс - 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Як послати покупця або вчимося створювати посилання).Тому тут я вже не буду на цьому детально зупинятися.

No related posts.

Comments are closed.