应该注意的网站设计的四点矛盾

因为工作需要，昨晚将另一位网页设计师的设计作品生成了页面，折腾了一通宵，我脑细胞成几何倍数减少，完成了工作，不免有些牢骚要发。

　　我认为网站是为人民服务的，网站的优劣，内容是关键，而设计能排在第二就不错了。一个网站的设计不仅需要的是美观，更需要的是配合内容的编排以及其它更多方面，例如浏览速度及浏览方便性。如果您同意以上观点，请继续看下文。

　　因为网站的设计不仅需要美观，所以产生了不少矛盾，挑几个主要的矛盾来分析：

　　一、 background背景图像的矛盾

　　由于千篇一律的单色背景早已产生了视觉疲劳，因此出现了花纹背景，例如用点、线、面组成的背景，通常这种背景都是做成10*10px （或其它）的方形大小。再受韩潮影响，目前应用广泛的是渐变背景，由于分辨率的关系，通常采用上下渐变，左右渐变不可取。问题来了，上下渐变在Photoshop（做网页设计的常用软件）中只需要简单的使用渐变工具拉动一下即可，但是作为网页设计师的你有没有想过在页面中这种背景应该如何去做？分成上下2个背景，或者做一个超级长估计要在3000px以上的背景？（可以参看我的博客首页背景http://blog.sina.com.cn/m/baopin）因此在做这种背景的时候，需要仔细考虑页面该如何去生成。

　　二、 适应分辨率的矛盾

　　为适应分辨率，最佳方法应该是整个页面采用100％自适应表格，这种网站让800*600及以上分辨率的彩显都能整屏幕最佳效果浏览，这样的制作方法在为数不多的几个网站上出现过。但是这种方法必然需要最少的图片及最多的216安全色及最精简的表格。目前这样的网站不怎么能满足客户的设计要求。

　　在国内，网站通常都在750-780px的宽度之间，这样做的目的是为了适应800*600及以上分辨率的彩显浏览网站。OK，矛盾出现了，中间是780px的宽度，但是通常设计师会加上描边或者投影的效果，做为设计师的你，有没有把这个尺寸算进去？更有甚者，中间的内容是780px 两边采用长达30px的投影，再加上前面第一点提到的渐变背景，好了，你想让生成页面的工作人员自杀吗？请你在做这样的设计时候为后面的生成页面工作考虑一下。

　　三、 网页216安全色的矛盾

　　所谓网页安全色是指在不同硬件环境、不同操作系统、不同浏览器中都能够正常显示的颜色，也就是说这些颜色在任何用户显示设备上的显示效果都是相同的。所以使用216网页安全色进行网页设计可以最大限度避免颜色失真的问题。

　　但是通常216个色彩不怎么能满足网页设计师的设计，随便一个渐变已经超出了这个范围，矛盾又出现了。请尽量将非网页完全色做在图片上，也就是说将非网页安全色做成图片，而将安全色做为代码，这样尽可能使网站拥有美观及快速。如果碰到一个网页设计师的设计作品，从上到下、从内到外、从文字到图片都没有1个安全色，你会怎么做？我昨天就遇到了。难道让我把所有的文字都做成图片？那这个网站还需要更新吗？程序员又该如何做？如果你是这样设计网站的，请改改这种毛病。

　　四、 象素与羽化的矛盾

　　象素和羽化应用都非常广泛，但是某些地方却产生了矛盾。举个例子，在一个带有图片背景的表格上，有一个翻转图片的按钮（鼠标经过变换图片），而这个按钮并不需要一定做成方形，为了整体效果，你也许会做成圆角，这个圆角如果做成象素，那么按钮可以做成方形透明背景的GIF，这样不会有任何问题，但作为设计师的你，也许会做成羽化的圆角，问题出现了，这个按钮是一定要用JPG或者非透明背景的GIF了，那么一旦需要更改此表格的背景色，这个按钮的两张图片也需要更改。所以在设计到圆角这种效果的时候，用象素还是用羽化，你要考虑清楚了。

　　“实践检验真理”，你想成为一个优秀的网页设计师，那么请多去把你的设计作品做成页面，这样你会发现很多设计中的问题。单纯的做一个美观的网页设计并不难，难在如何将美观与实际页面相结合。时间仓促，胡乱写下上面的文字。

作者: 星缘