从设计师的角度去看网页.docVIP

序 作为一个网页设计师，在参考或借鉴其他网站时，应当养成用敏锐的设计视角关注设计元素间内在的联系和应用重点，如直观的图片、文字样式，辅助的色彩，隐形的版面网格系统、段落样式系统等，这些都是形成独特视觉系统的关键所在，简单刻意的模仿远远不能达到设计的目的。 从设计师的角度出发去欣赏 面对数量庞大且已精心设计的网页，作为一名设计师，要如何从中学习到有用的知识呢？如何欣赏别人的优秀作品，如何有选择地去看，成为广大设计师头疼的问题。 在实际工作中，从事特定类型网页设计的人员不在少数，如电子类、时尚类、家居类、游戏类等，由于工作和学习，设计师一遍都会积累一定数量的网页截图作为参考或借鉴。当编辑或设计人员在参考的时候，经常出于一种马上要把其间的细节立即应用到自己的工作中的想法，可是往往适得其反，使自己的工作陷于进退两难的地步，只好推翻再来，增加自己的工作量，耽误大量宝贵的时间，可谓得不偿失。这是因为他们在单纯的模仿，单纯模仿不能使你设计的作品有本质的变化，而且不能体现其自身的特点，也不能提升你自己的价值。 那么睡觉时间还有没有必要继续参考借鉴呢？答案是肯定的。借鉴不是单纯的模仿，设计师要学习的是其中的理论和经验，并非简单的模仿。这时作为设计师，去欣赏优秀作品的角度就要和普通的浏览者有所区别了。 展开，是设计师借鉴时应具备的最基本的能力。如何将网页展开？通过归纳和总结图片、网格、段落样式、色彩、字体、细节等是构成一个网页设计的基本元素，展开这些元素将使设计师的眼界豁然开朗。 1.1.1 网格系统 网格系统，是网页布局的基础，它构成了网页布局坚实的骨架。没有经受过网格系统知识培训的设计师往往只是知其一不知其二，形成的网格系统经不起推敲，更谈不上实用，所以系统地学习网格，就成了当务之急，但要先学会认识并识别网格。 网页设计的版式和平面设计没有什么不同，都基于网格系统。但是这些网格往往都是“隐形”的。如图1-1所示，为太子奶网站首页截图，页面中并没有明显的“网格”来划分版式。 图 1-1 太子奶网站首页截图 但是通过网格系统的概念对页面进行分析，就可以得到如图1-2所示的网格结构。 图1-2 分析后的网格系统 1.1.2 段落样式 段落样式并非简单意义上的文字大小和图片区域划分，而是严谨的层次结构的具体体现，是一个有机的整体，互相支撑，协作，而又相对独立有自己的功能。在一些大型的门户网站中，段落样式的设计有时会多达20种或更多，使浏览者能极为方便地找到所需内容。如图1-3所示。 图1-3 网页中的段落样式 1.1.3字体 目前已知的英文字体有将近70000种，中文字体几百种，选择很多，但如何应用这些文字使网页看起来更舒适、美观就成为设计师头疼的问题了，英文和英文的配合、英文和中文的配合、中文和中文的配合，无一不是考验设计师智慧和耐心的重要课题。效果如图1-4所示。 图1-4 网页中的字体 1.1.4 色彩 色彩，非常客观地体现出你的审美和品位。对于网页而言，代表着特定的行业、目标人群，其重要性在某种程度上可以决定一个网站的发展。色彩在人们选择浏览网站时也起着极为重要的作用，所以色彩对心理的影响不容小视。如图1-5所示。 图1-5 网页中的色彩 1.1.5 图像 当今网站中的图片，对网站的质量表现和内容的补充有着极为重要的作用。图像的使用并不是简单的摆放和拼凑，了解图像的各个重要的表现点，一张好的图像可以提升页面的品质，但把图像合理地应用则需要很多设计以外的知识。效果如图1-6所示。 图1-6 网页中的图像 1.1.6 细节 细节决定成败。一个好的网页设计如果没有细节的支撑，就好比大树没有叶子一样，显得突兀、干枯，精彩的细节让网页充满新意，但细节的创造绝非模仿能得到的，是通过对行业、事物的深刻理解和认知后总结并通过熟练的技术手段得来的，而并非有些人说的“就按这个来”如此简单，如图1-7所示。 图1-7 网页中的细节体现 1.2 如何形成自己的风格 通过前面的分析设计师可以，解读一好的目前，世界上主流的设计大致可分为欧美 图1-8 欧美风格的网站设计 日韩网站则体现在版面资源的极高利用率，大量且细致的 图1-9 日韩风格的网站设计 反观目前国内的设计，极大部分没有自很多负面效应，虽新一代设计师的崛起是不是就能马上扭转这种局而把他们设计作品中的文字去掉，虽然都很不错，但你 系统地分析，掌握基础理论，设计师能从