网页常用小按钮一
虽然越来越多的人开始使用宽带,速度已经不象早些年那样限制着网络,但近年来的网页却没有越来越繁杂,正相反,以简约为风尚的网页设计正悄悄流行在网络世界中。这种风格不但节约了带宽,更重要的是,大多数人更喜欢在清新的环境中寻找他们所需的信息,简单精巧的设计,使获取信息变得更加方便快捷。今天,我们就来设计几款最常用的网页小巧按钮。
- E( ~+ M4 V) X Y" Y# T 第一款:像素按钮
3 j: A0 z7 v7 h# _" `0 w 这是目前最为流行的一种按钮,在每个以像素为主题的网站上几乎都能看到它的身影。想要最大程度的减小网页大小,这种按钮可是不二法门。这种按钮简单大方,除了个性化的网站之外,用于公司网页也非常合适。
: D9 Q" C& o8 Y5 i
新建一个Photoshop文档,RGB模式,白色背景。
/ Y8 [5 O" V6 t; i: e
新建一层,复位色板,将前景色设为一种浅灰色,如例子中的RGB(239,239,239),用矩形选框工具选择一个小矩形,填充前景色后取消选择。
# u3 }8 B3 M% |3 T1 g9 \6 ~ 下面我们来制作按钮的立体效果。这里,我们完全用添加图层样式的方法,双击图层,打开图层样式对话框,我们来依次添加:
5 a; N }3 X* W+ }) s 首先选择斜面和浮雕样式,设置结构为内斜面,方法为平滑,深度为1%,方向在上,大小和软化均为2像素,阴影角度为146度,使用全局光,高度为30度,光泽保持默认,高光和暗调的混合模式与颜色都不变,不过不透明度分别设为100%和43%;
2 ] W- j5 l; }" s7 J& M 其次是内阴影模式,模式为正常,颜色为白色,不透明度为100%,角度为146度,使用全局光,距离为1像素,阻塞为100%,大小为0,品质不变;
9 c& D1 q& B K 接下来是描边,将描边大小设为1像素,位置在外部,混合模式为正常,不透明度为100%,填充类型为颜色,描边颜色设为黑色;
, R1 T) h f: C9 D0 l
最后是投影样式,将阴影颜色设为黑色,不透明度为22%,角度为120度,取消全局光,距离为3像素,扩展为0,大小为0,品质保持默认不变。
/ }' Y" T6 J( b: `! K1 Y 好了,现在你可以选择细一些的字体,最好是专门的像素字体,在按钮上写上文字。在设置文字选项的时候,有一项需要特别注意,那就是要将文字消除锯齿的方式设为无,否则字体会出现模糊。整个制作过程如图1所示。
0 S9 w: m E1 n* b