Создать красивую и реалистичную кнопку для вашего веб-сайта поможет программа для работы с векторной графикой Corel Draw (или её бесплатная альтернатива – редактор векторной графики Inkscape). Это программа имеет преимущество перед растровыми графическими редакторами, так как изображение, созданное в ней, легко масштабируется без потери качества и пикселизации. Тонкости работы, включающие настройку цветовых профилей и цветокоррекцию можно изучить здесь. Из аналогов можно вспомнить ещё одну программу для создания векторной графики (на сей раз – OpenSource) под названием Inkscape. Также напомню, что красивые кнопки являются элементами уникального дизайна сайта, который, в свою очередь, немаловажен для продвижения.
Теперь непосредственно про работу с CorelDraw: для начала нарисуйте на рабочей области прямоугольник с помощью инструмента “Rectangle Tool”. Ширина и высота вашей фигуры будет зависеть от количества текста и выбранного шрифта. Выделите фигуру и скруглите ее края с помощью функции “Rectangle Corner Roundness”, выставив при этом значение “100 %”. Обязательно поставьте галочку в пункте “Round Corners Together”, чтобы скруглить все углы одновременно. Залейте вашу фигуру градиентной заливкой с помощью инструмента “Fountail fill”, причем ваша заливка должна протягиваться сверху вниз от более темного цвета к более светлому (его вы выбираете по своему усмотрению).
По вышеуказанному принципу нарисуйте еще один похожий прямоугольник, только поменьше. Разместите его поверх первой фигуры и залейте белым цветом. Выделите новый прямоугольник, после этого выберите инструмент “Interactive Transparency Tool”, щелкните по фигуре и протяните указатель мыши вниз, создавая таким образом плавный переход от одной фигуре к другой. Скопируйте белый прямоугольник, немного растяните по вертикали и залейте цветом более светлым и ярким, чем ваша кнопка. Снова выберите “Interactive Transparency Tool” и сделайте так, чтобы верхний цветовой указатель был на середине кнопки, а нижний – внизу. Выберите режим наложения этой фигуры “Add” – и шаблон кнопки готов, останется лишь совместить его с остальными элементами дизайна вашего сайта.