3450399331
网站设计

基础网站视觉设计

发表日期:2024-09-06   作者来源:www.cbbzl.com   浏览:0   标签:网站制作    

在现代日常,有一些基本的想法根深蒂固,以致大家非常难发现它们的常见性并且视而不见。“模块和程序”的定义-样式重 复的规则构建块,当结合在一块时会创造出一个有序的整体一对大家的信 息年代的生活的渗透度要远高于其对大家的祖先在由Eli Whitney等制造业创造家发起的工业革命年代的生活的渗透度。

伴随工业世界变得愈加复杂,19 世纪中期的文档设计者们开始将模块程序应用到报纸、商品目录、财务会计与其他的出版物中,现代页面样式诞生了。在20世纪早期,Bauhaus 设计师们使用视觉逻辑元素-一这是由Gestalt知觉心理学家发现的,那些德国和瑞士设计师创造了现代图形设计)。

图形设计的主要目的在于:

●创建个明确的视觉对比层级, 如此就能一 眼看清什么是要紧的 与什么是次要的。

●为页面概念功能区。

●对有关的页面元素进行分组,如此就能看清内容的结构。

●一个简单的页面网格可以确立离散的功能地区,适度的负空间(negative space)概念了页面的图形背景关系。用页面样式的容易见到原则来设计页面,用户可以随便地预测主要内容和功能元素的地方。

●拥挤的页面会由于创建了视觉纹理的模糊地区而让页面的图形背景关系变得混乱,其对比少而没办法吸引浏览者的眼球,地标过少会不利于用户理解内容组织结构。

●拥挤的元素同时也导致了1 + 1=3的成效,增加了视觉混乱。

●在为菜单列表、内容列表、页面标题图形与其他设计元素设计HTML和CSS时,要时常考虑在页面,上创建的图形的间距、分组、相似性与整体视觉逻辑,如此才能容易地提供明确的结构,而不是叫人感觉混乱的细节。

相近与统一-的连贯性是网页设计中效果最强大的Gestalt原则;在概念区城中经过分类的元素是内容模块和“分块”互联网内容的基础,以便轻松浏览。一个组织好且内容分类明确的页面,用户一眼看去便是否了解内容是怎么样组织的,它打造起了内容模块单元,进而组成了贯穿整个网站的各页面的可预见模式示。

一致性

创建一个用来处置文本和图形的布局网格和样式,然后一直用该样式来创建贯穿网站页面的步伐和一致性。重复并不会让人厌烦;重复叫你的网站拥有了一致的图形形象,它创建并加大了显著的“空间”感,网站会叫人过目难忘。布局和导航使用一致性的方法,会让用户迅速适应网站的设计并能自信地预测网页信息的地方与导航控件的地方。

假如选择了一个图形主题,那样请将它贯穿于整个网站。Hiram 学院网站首页横幅广告为网站设立了图形主题,并引人了独特的版式与一系列导航标签。注意版式和导航主题是怎么样传递到内部的横幅广告的。在浏览整个网站时,你不会产生“这是哪个的网站”的困惑。

对比

图形设计的主要任务是创建一个强有力的、一致的视觉层级成效,其中,要紧元素会突显,内容也是以逻辑且可预测的方法进行组织的。图形设计是对视觉信息的管理,用网页设计工具、版式与插图来引导读者进行页面浏览。读者第一会把页面看成是图形和颜色的聚集体,包括着前景元素与背景的对比。然后,他们开始挑选特定信息,第一从现有些图形开始,并且在这之后,他们才会开始剖析更难的文本媒介并开始阅读单个的词汇和段落。

整体的图形平衡和页面的组织对吸引读者阅读网站内容至关要紧。一个全是文本的页面会由于其毫无差别的灰色而将读者拒之门外,如此的网页没对信息构造的明显提示。一个设计不精或者充斥着过于显眼的图形或版式的页面,也会致使用户丧失寻求实效性内容的兴趣。你需要通过借助适合的相邻物、分组、图形背景关系与标题对比中的变化,达到用视觉对比吸引读者眼球并提供一个明确的构造之间的平衡。视觉平衡和适合性对预期的观众而言,是成功的设计决定的重点。对普通观众而言,效果最好的设计就是用相对小的图形来达成文本和链接之间的小心平衡。这类页面不只可以迅速下载,而且还拥有很实质的图形成效。

1.版式中的颜色和对比

颜色和对比是通用可用性的重点组成部分。文本的可读性取决于读者区别字体和背景的能力。颜色变化主要取决于明亮度和饱和度。白色背景上的黑色文本拥有最强的对比度,这是由于黑色没明亮度而白色是全明度。色调也是一个原因,诸如蓝色和黄色如此的互补的颜色,会产生最强的对比。确保颜色选择不会让读者难于区别文字和背景。同时,千万不要忘记差不多有10%的男士读者在区别精细的红绿色阴影时有肯定困难。

2.对比的可变性

用手机显示的网页,一般会因移动环境而做出让步:小屏幕,小字号,缺少理想的屏幕分辨率和颜色,假如在户外环境下,阳光或其他照明设施所发出的光还会减少网页的可读性。事实上,不少的便携式电脑的显示屏并不可以显示非常不错的颜色差别或明暗度差别,通过电脑投影仪看到的页面上的颜色一般也会变淡。请用不一样的设施和便携式电脑,并在不一样的环境中测试你的设计,特别是当你用微妙的颜色来概念要紧的页面功能或内容的时候。总的来讲,最好使用一个更有效、高对比度的版式颜色策略。

3.防止过度对比

水平标尺、修饰性图形项目符号、显著的图标,与其他视觉标识,都拥有各自的特殊场所的作用,不过每一-样都要尽可能地少用(假如真要用的话)以防止出现不调和及混乱的样式。图形强调工具十分强大,应当只不过少量用以获得大的成效。过度用图形加大成效将产生“小丑裤子”(过犹不及)的成效,即所有些所有都是那样炫耀,反而没任何重点可言了。

从大自然中挑选出来的颜色调板几乎是绝对靠谱的颜色协调的向导,特别是当你并不是一个受过练习的图形设计师的时候。微妙的、不饱和度的颜色是背景或次要元素的好选择。防止用显眼的、高饱和度的红色、黄色、蓝色,除非在针对最需要加大的地区,但即使是这个时候也应小心用。

空白地区

如今,大家拥有更大的显示屏与更为复杂的图形界面,因此你的网页非常或许会与不少其他窗口和桌面元素共享.个显示屏。 请用空白地区以防止让浏览器窗口的边缘挤满了页面内容的要紧元素。在固定宽度的布局中,可以考虑将页面德存在浏览器窗口的中央。假如你的页面宽度合理,这种办法将会叫你的页面看起来有视觉放松的成效,即使是在一个拥挤的电脑显示屏上,如图7-13a所示。对“弹性的”布局而言,可以考虑用90% ~ 95%的屏幕大小的页面来取代100%的全屏页面,让页面功能地区周围留些背景以达到视 觉放松的成效,防止与浏览窗口外的元肃相互用途产生不成功的“1+ 1=3”的成效。

能够帮助将页面内容从显示屏上的其他程序和窗口的“嘈杂声”中隔离出来所有些图形设计从根本上而言都是对空白地区(页面上所有图形元素后面的背景)的管理。要想理解图形设计,你需要去领会,页面元素周围的背景地区是与页面上任何图形元素一样有效且要紧的设计部分。将页面上的空白地区填满就好比抽空了一个房间的所有氧气一这可能是对空间的一一种有效应用方法,但毫无疑问这是非常难叫人习惯的。

样式

不要想着为你的网站建设一个“样式”,在引人另一网站或是印刷品的图形元素来装饰你的页面时也要小心。在对内容和页面布局进行一致和适合的处置时,网站的图形和编辑样式也应伴随这一自然的过程有所演变。多用传统而非古怪的风格,绝不要让框架压倒了内容,并记住最好的样式就是读者从来不会注意到的样式一每样东西都叫人感觉那样有逻辑且舒服(甚至是漂亮),而笨手笨脚的设计绝不会让用户拥有如此的体验。

简单

所有用户都会受益于明确且致的网站建设,而对某些用户而言这至关要紧。对于那些缺少空间线索,用彻底不同且需要针对每一个站点重新学习的导航方法,有视觉障碍的用户会比较容易产生混乱或者在网页中迷失。对那些在认知上有缺点的人而言,诸如记忆或学习有障碍的人,这一困难程度会被放大不少倍。

目前题目基础网站视觉设计

如没特殊注明,文章均为优果网 原创,转载请注明来自http://www.huiguohuo.com/news/sheji/14377.html