我近期的一些网站设计作品，放到线上后碰到的问题都一样：用户往往多次点击同一按钮，由此引发的一些新的问题，比如，同时提交重复的数据问题，有些问题从技术上是可以避免的，我认为设计师该从网站设计开始考虑这种细节，从而避免网站设计的缺陷。

首先我来分析一下，为何用户需持续多次点击同按钮？

从网站设计的思路上来说，这些按钮属于通用按钮或图片按钮，看一眼就知道可点击，功能是没有问题的。这些按钮，浏览者不思考都知道可点击，要更加理想的一点的话，就是点击之后能看到效果，还特地增添Ajax效果，可问题是数据很多都是重复的，起初分析还以为那是程序的问题呢，上网查了查才明白是怎么回事。网速慢的时候，点击按钮不会接着就能看到效果，结果只能是没有反应，从常理来理解，就是没点着，这样就麻烦点了，浏览者习惯性地狂点一阵，等网络反应过来的时候，已经造成了损失。

以标准化方法进行网站设计制作，对很多网站设计师来说这似乎不是问题，在站长的圈子内，每天都到处充斥着付费制作模板与网站重构的信息，这说明站长们相当重视网站外观和内质。实际上，我们今天回头再看，太多的网站因这种那种的缘由，在一定程度上都存在不符合网站结构标准语言的要求的现象。

在过去的许多年里，多数站长习惯运用表格开展网站设计建设，现如今的DIV+CSS毫无疑问是我们所看到使用频率最高的字眼。一些站长会说，TABLE的表现已经非常良好了，为什么还要用CSS呢？就这个话题，我来说说CSS，说说网站设计标准化的5个大优势。

大家都知道一句格言叫”细节决定成败”，网站设计同样如此。因为我们目光、感觉极为敏锐，哪怕是很不了解网站设计的人也可以从一堆非常差的设计作品当中挑选出一个相对优秀的作品。有可能他讲不出为什么这件东西比那些都好，但是直觉就让他知道了哪一个要好一些。假如别人问为什么这个作品要比其他的好？回答往往是：好的设计作品总是充满着丰富的细节。这给我很多启发，在这里，我以衬线运用细节为例来阐释在网页设计中如何让作品变得优秀。

1像素的衬线的巧妙运用。在实践中，网站设计的时候使用到衬线的例子是比较多的，一般在黑边框的顶部向下方1个像素的位置，我们会插入一条灰色的衬线。使用衬线能够体现物体在2D效果之下的立体感觉，要体现立体感离不开阴影和高光。网站设计师通常可使用图层样式来实现阴影，要实现高光效果，最重要的技巧就是运用衬线。上面两个例子的衬线都在物体的上部，很明确光线的照射是从上向下，高光部分处于顶部。反过来，假如光从下向上照，高光则位于底部，衬线应放在下方。故而衬线使用要明确几个问题，“如果在此使用衬线，光源位置在哪？”“假如光源在此，阴影位置在哪？”明白了这两个问题，才能设计出有真实感觉的立体感。

我们经常会在网站上看到很漂亮的水晶按钮，那么这些按钮是怎么做的呢？今天小编就教大家如何使用fireworks制作水晶按钮，方便大家以后在网站设计中使用。

步骤一：新建600*200白底的文件

步骤二：新建一个图层，将其命名为BG1，使用圆角工具画出一个115*32的圆角矩形，再调整一下矩形圆角的度数，然后给矩形增加photoshop动态的效果。

步骤三：复制图层BG1一份命名为BG2，缩小为114*32（在水平和垂直方向各减小一像素），并要取消photoshop的动态效果，充填背景颜色#A9A9A9

一般情况下，当页面需要显示的信息很多，一个页面不够用，为了增加速度、美观等，网站设计中设计分页就有必要了。用户可选择是否继续前行或后退去找他想要的信息。例如，在淘宝网搜索一下“衬衣”，这时有多达100 多页的信息，就会出现分页。
一、原始设计方案
分页的作用是很多的，特别是在性能优化上，最重要的原因，是让用户可以快速找到想要的信息。这些有用信息页面比较多地在分页之上，淘宝网已经做得非常好。我们经常在网上看到这种的分页形式：中间是目前的页码和共有的页码，两边分别是上一页和下一页，在很多网站都采用该类型显示的方式。很多设计师朋友建议，把“上一页”和“下一页”放在一块，让用户按起来更加方便，这种设计很好。
二、我的方案
话说回来，我个人并不赞同上面的这些做法。既然这个分页是小型化的，一个很小的位置就能全列在上面了，那我们为何还要去复杂化这个用户选择的过程，而不是直接提供更便捷的方式？我倡导的想法是把小分页全显示出来，确保用户操作更方便。这种设计与原始方案的对比，从空间上展开式显示需要的像素少，有不少设计师考虑留白，会去考虑如果合理地利用这些宝贵的空间。从实用性上来说，假如看到第3页，突然又想回到第一页，按照原设计，不得不按两次“上一页”？假如有5页呢？如何来保证在各页之间切换得更快？无论如何，展开式设计可很好地解决问题

当网站设计师做网站导航的时候，常常会使用到下拉式菜单，我在这篇文章里主要是介绍纯CSS制作的下拉菜单，除了能兼容各主流浏览器外，还可以兼容IE6。

主要思路，是在默认状态下，设置display为none，让子菜单隐藏起来，CSS2.0手册中解释说明了与visibility属性的hidden值不同在于display属性none值不为被隐藏的对象保持留住其物理的空间。在鼠标滑过后，把display属性设置为block子菜单显示。

在这个当中，遇到的最大问题在于IE6中的”:hover”伪类只对a标记有效，在这里，如果要解决IE6兼容，办法是在dl列表项外增加一个a元素，并将dl放置在一个单元格之中。

现如今，实用智能手机的人越来越多，适应手机网页的网页制作比较迫切。实际上，手机网页的写法和普通网页的制作差不多。

根据我的经验，最好将手机页面的宽度控制在240px之内，这是因为如此设计可以在不挪动屏幕的情况下实施诸多操作。我所在公司的这个项目常用一张背景图片，其大小是240*420。这有一个不好的地方，我非得确保每个页面的高度都限制在420范围内，假如超出一点点，都会非常难看。

不管是普通手机或智能机，好像都不支持js。有点像<a href="javascript:history.back()">和"alert()"都不支持。此外，智能手机对“<input type="button">”的样式支持不太好，在宽度一定的情况下，相同的代码在浏览器上和手机上有宽度上的差距。故而，我建议假如能不用按钮，就最好不用按钮，那就用文字的超链接形式替代吧，当然也可以考虑运用小图标。

目前的政府类网站设计存在5大问题，都是哪些问题呢？今天我们就一起来看一下，希望大家在做网站设计的时候能够参考。
一是没有明确的目的。当前情况下,不少政府建立网站主要是迫于上级部门的要求,或者是为了赶一趟时髦,这样就导致了为建网站而建网站这种特殊现象的发生。

二是不适应网站使用群。这个现象非常普遍，他们对机构组织建设、领导干部简历、部门职责、办事流程和本部门历史都实施了较为详尽的介绍和说明,可是，对作为人民群众的用户需求考虑的却非常之少。

三是网站设计不尽统一。统一政府网站设计有很多好处，一来可以有效树立政府的形象,二来可以极大方便办事群众使用,但反观我国各级政府网站，我发现其设计可谓五花八门,这是人为加大使用上难度，故意不给老百姓亲近感。

对于网站设计来说，loge是具有绝对宣传优势的图像。Loge本身的含义也是指图像标志。在做loge的时候，用普通的ＰＳ软件就可以实现，可以说在技术上是没有什么难度的。但是做loge的难度就在于：巧构思，多参考，引人注目。

Loge是网站的灵魂，可以说有网站存在的地方就有loge。不论是网站图片还是网站网站文章，loge都是一个介绍自己来源的名片。这可以给网站带来更多的人气，所以和网站名一样，不能马虎对待。对于如何解决这个问题，这里有几条建议：

第一，多观察生活，多接触知识，对生活的积累和素材的积累是很重要的，生活中发现细节，细节启发灵感。这是一个活到老学到老的行业，这些专业素质是一定要具备的。

相信有些站长在刚开始自己做网站的时候，比较头疼一些例如网站图片，或者网站banana这些东西。其实用PS简单实现也不是不可能。Ps是作图软件中比较好掌握的，网上有一些关于ＰＳ学习的视频和教材，经过短时间的学习，把素材加和做成想要的图片其实还是很容易的。下面我们要说的，是ＰＳ的一些其他应用，能让初步掌握ＰＳ的人能够快速做出惊艳的图片。并且这些工具会让你在任何作图过程中都感受到方便。

首先是添加万能的滤镜。具体使用方法是在桌面上找打PS的图标，鼠标右击，快捷菜单有一个属性，点击查找目标，找到PLUG-INS文件夹，把下载解压好的滤镜放进去就可以了。对于网上的很多滤镜，现在都有免费下载版，有时候调色调不好，或者需要某一种材质效果，都可以用添加的滤镜去实现这些效果。滤镜的功能是很强大的，有时候能省掉很多时间去处理一张图片。比如说简单的模特的皮肤颜色提亮，或者说让模特的皮肤变得光滑，能够用专门合适的滤镜进行肤色提亮柔化或者磨皮。专业工具进行的磨皮有时候是很自然的，比用图章工具盖出来的效果要好。