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