联系方式
保定市遨游计算机服务有限公司
咨询热线:400-999-1728
咨询热线:13313028229
售后:0312-6791400
售后:0312-6791126
地址:保定朝阳大街国贸大厦808室
网址:www.aoyouwangluo.com
网页制作小技巧
[来源:www.aoyouwangluo.com] [作者:aowl] [日期:18-04-18] [浏览次数:]
一、页面平铺 One, page spread 把页面平铺开,主要的物件有:导航栏、LOGO、Banner、按钮、图片、文字。 The page is paved, and the main objects are: navigation bar, LOGO, Banner, button, picture and text. 1.导航栏 1. navigation bar 导航栏如果设计得恰到好处,是会给网页本身增色很多。导航栏有一排、两排、多排、图片导航和Frame框架快捷导航等等各种情况的设计。有时候是横排,有时候则是竖排。另外还有一些动态的导航栏,如很精彩的Flash导航。 If the navigation bar is properly designed, it will add a lot of color to the webpage itself. The navigation bar has a row, two rows, multi row, image navigation and Frame framework shortcut navigation and so on. Sometimes sometimes is horizontal, vertical. There are also some dynamic navigation bars, such as the wonderful Flash navigation. 2.LOGO 2.LOGO LOGO并不是每个网站多要有的,他是网站为了给大家一个比较直观的信息的表达工具。LOGO的位置通常在页面的左上角。这个地方最明显和直观,可以第一时间给人于默化的效果;网站的LOGO,一般以静态的居多,也有动态的,但是LOGO的特点都是在表达网站的信息,是一个网站的直接的表现窗口。 LOGO doesn't have many websites. It's a website to give you a more intuitive expression of information. The location of the LOGO is usually at the top left corner of the page. This place is most obvious and intuitive, can be the first time to give people the effect of silence; the LOGO of the website is generally static and dynamic, but the features of LOGO are all the information of the website, and it is a direct display window of a website. 3.BANNER(广告条)类型 3.BANNER (advertising) type Banner设计注意点:Banner有动态和静态两种。在浏览网页的过程中,虽然闪烁的图案会产生瞬间记忆刺激,引起注意,但这种记忆往往为压迫性的,久之易产生负面效应,从而模糊记忆。而稳定的画面不易引发特殊的关注,但如果有良好的界面引导和内容,可产生良性的记忆,持久而牢固。设计要点:Banner的文字不能太多,用一两句话来表达即可;广告语要朗朗上口,可以第一时间的让人捕获表达的重点;图形无须太繁杂,文字尽量使用黑体等粗壮的字体,否则在视觉上很容易被网页其他内容淹没;图形尽量选择颜色数少,能够说明问题的事物;如果选择颜色很复杂的物体,要考虑一下在低颜色数情况下,是否会有明显的色斑;尽量不要使用彩虹色、晕边等复杂的特技图形效果,这样做会大大增加图形所占据的颜色数,增大体积。 Banner design note: Banner has two kinds: dynamic and static. In the process of browsing the web, although the flashing pattern produces instant memory stimulation and attention, this kind of memory is often oppressive and has a long time to produce negative effects, thus blurring memory. The stable picture is not easy to cause special attention, but if there is good interface guidance and content, it can produce benign memory, durable and firm. Design points: the text of Banner can not be too much, can be expressed in one or two sentences; the advertising language should be the first time to capture the focus of expression; the graphics need not be too complicated, the text as far as possible to use bold font such as black body, otherwise it is easily drowned in the other content of the page in the vision; graphics try to choose the face as far as possible. Less color, can explain the problem of things; if the choice of color is very complex objects, to consider the low color of the case, whether there will be obvious color spots; try not to use rainbow color, halo edge and other complex effects of special figures, which will greatly increase the number of colors occupied by the graphics, increase the volume. 4.按钮 4. button 按钮设计要点:设计按钮要同页面的整体协调,不能太抢眼;有的页面很单调,还要依靠花哨的按钮来提一下;选用的字体,选用的插图,或插图及字体搭配,都要考虑字迹清楚,色彩简单一些,不要超过四种;很长的按钮可能就是框架的分界,尽量要纤细一些,否则页面会显臃肿。 Button design points: the design button should be coordinated with the whole page, it can not be too eye-catching; some pages are very monotonous, and rely on fancy buttons to make a mention; selected fonts, selected illustrations, illustrations and font collocations should consider the handwriting clearly, the color is simple, not more than four; a very long button may be It's the boundary of the frame, try to be thin or thin, otherwise the page will be bloated. 5.图片 5. picture 为了美化页面,图片是任何一个页面都要用到的,图片的运用要合理。图片运用要点:图形的主体最好清晰可见;图形的含义最好简单明了;图片内所含文字应该清晰容易辨认;背景与主体明度对比比例应为3∶1到5∶1之间为宜;淡色系列的背景有助于整体和谐;淡色材质背景最佳,能与主题分离之浅色标志或文字背景亦可。 In order to beautify the page, any picture is used for any page, and the application of the picture is reasonable. The main points of picture application: the main body of the figure should be clearly visible; the graphic meaning is best simple and clear; the text contained in the picture should be clearly and easily recognizable; the contrast ratio between the background and the subjective lightness should be between 3 and 1 to 5: 1; the background of the light color series is helpful to the whole harmony; the light color material background is the best and the light color separation from the theme A sign or a text background is also available. 6.文字 6. words 文字也是设计的。设计要点:每一行文字的长度最好20到30个中文字(40到60个英文字母);行距与字距已由软件内定。设计时注意段落与段落间空行及首行缩排方式以辅助阅读;标题以H1到H3字号为佳,内文Font size=3到4级为佳;同版面字型最好在三种以内;文字的颜色最好也是三种以内;文字在颜色上要与背景区别;内文的排列向左对齐并与左边界保持适当距离。可以用表格填入文字以达此效果;表格或清单内的字运用相同字型与字体大小,以利辨别。 The text is also designed. Design points: the length of each line is 20 to 30 Chinese characters (40 to 60 English letters), and the spacing between lines is determined by software. In design, pay attention to paragraphs and paragraphs empty and first line indentation to assist reading; the title is good from H1 to H3, Font size=3 to 4; the best in the same page is within three; the color of the text is better than three; the text is different from the background in the color; the arrangement of the text is aligned left to the left and the left. Hold the proper distance. You can fill in the text with the form to achieve this effect; the words in the form or list can be distinguished by the same font size and font size. 二、整体规划 Two. Overall planning 有共性,才有统一,有细节区别,就有层次;防止设计与实现过程中的偏差;设计的各部分,要配合整体风格;不仅页面上各项设计要统一,而且网站的各级别页面也要统一;信息不要太过集中,以免文字编排太紧密;不要有太多分散注意力的点。动态闪烁要适中;页面留白部分,要根据平面设计原理来设计,注意分栏式结构不宜留白;还要考虑到浏览器上部占用的屏幕空间,防止图片截断等造成视觉效果不好;首页设计图片+导航,这是一种比较强的网站表达,可以根据时间的变化更改图片。 There are commonalities, there is unity, there are different details, there is a level; to prevent the design and implementation of the process of deviation; the design of all parts, should cooperate with the overall style; not only the design of the page should be unified, but also the pages of the web page should be unified; information should not be too centralized to avoid writing too closely; do not have too much dispersion. The point of attention. Dynamic flashing should be moderate; page blank part, should be designed according to the plane design principle, pay attention to the column structure should not be white; also take into consideration the screen space occupying the upper part of the browser, prevent the picture truncation and so on to cause bad visual effect; the front page design picture + navigation, this is a kind of strong website expression, can be based on the time Change the picture between the changes. 三、功能易用性 Three, functional ease of use 导航栏应最先调入,以便访客快速前往所需信息空间;页面长度要短,使得用户在信息空间内可迅速移动;导航设计方向要一致。支持导航的层次按钮应当从上到下或从左到右,但不要两者都用,不要混用方向。 The navigation bar should be first moved in so that visitors can quickly go to the required information space; the length of the page is short so that the user can move quickly in the information space; the direction of navigation should be consistent. The level buttons that support navigation should go from top to bottom or from left to right, but do not use both.