2012网页设计趋势(上)

简介: 纯粹主义者会说,伟大的设计是永恒的。是的,在一个理想世界中,我们可以忽视趋势与流行。但是实事求是地讲,跟踪和融入设计的趋势是很有价值的,尤其是网站方面。让我们面对现实:网络时刻在迅速变化,而不像其他媒体,网站设计的趋势不再仅仅受美学驱动。

纯粹主义者会说,伟大的设计是永恒的。是的,在一个理想世界中,我们可以忽视趋势与流行。
但是实事求是地讲,跟踪和融入设计的趋势是很有价值的,尤其是网站方面。让我们面对现实:网络时刻在迅速变化,而不像其他媒体,网站设计的趋势不再仅仅受美学驱动。技术是不断变化的,媒介的能力和手段都在随之而发生巨大变化。2010年,我们看到设计师在网页设计方面不断推陈出新,形成了以下明显的趋势...

2010网页设计趋势 MazingTech.Com翻译

 
印刷式设计 
印刷设计一直都是网页设计的灵感来源。网页设计已经有了一段的历史,足够形成一个强劲的没有印刷设计经验的设计师核心。而结果我们看到更多的灵感是来自于印刷,似乎这些设计师不仅仅是网站设计。
   衬线字体 
印刷的最重要问题之一是可读性。印刷设计师们总是倾向于衬线字体,因为这种字体边缘明显,提高可视效果,使字形更容易识别。

无衬线字体,一般认为它更容易在屏幕上阅读。但是,随着越来越多的用户浏览分辨率的提高和字体平滑技术的改进,衬线字体显示正文文本可读性十分良好。

2010网页设计趋势 MazingTech.Com翻译

2010网页设计趋势 MazingTech.Com翻译

2010网页设计趋势 MazingTech.Com翻译
大标题 
印刷设计师一直使用的大标题,以吸引不同年龄层的注意。如果期望别人来读,印刷材料的形式已经有很深的影响。如果你看到一个沉闷的小册子赖在办公桌上,你都懒得捡起来?不是吗? 

这一趋势开始于2009年,目前在普及。大标题已证明更有吸引力和明晰沟通。

2010网页设计趋势 MazingTech.Com翻译

2010网页设计趋势 MazingTech.Com翻译

2010网页设计趋势 MazingTech.Com翻译

2010网页设计趋势 MazingTech.Com翻译
多列布局 
设计人员的工作往往受限于手段和媒介。跟印刷不同,网页是可以滚动的,因为它没有纸张尺寸的限制。因而使用多列可让你在同一空间呈现更多的内容。

现在,屏幕分辨率在增加,网格布局已到来,更多的设计师正在网页设计上适应这种方法,使得网站更易用,容纳的内容也更加多。

2010网页设计趋势 MazingTech.Com翻译

2010网页设计趋势 MazingTech.Com翻译

2010网页设计趋势 MazingTech.Com翻译
   大幅配图 
一张好图片胜过千言万语。因为在网络之前,印刷品的图片(分辨率更高)已经有了相当的影响,现在宽带接入使得大图片的使用更具可行性。

我们看到越来越多的网站使用大幅的,给人印象深刻的图片来吸引用户,创造一个身临其境的体验。
   
2010网页设计趋势 MazingTech.Com翻译

2010网页设计趋势 MazingTech.Com翻译

2010网页设计趋势 MazingTech.Com翻译

2010网页设计趋势 MazingTech.Com翻译
   图表和资讯图 
印刷设计师多年来一直使用图形来传达复杂的信息。最为普遍常见就在杂志和年度报告。

对于那些复杂的关系和比例,纯文本是很难表达的,图形是一种很好的沟通的方式。资讯图像往往有一个简单而丰富的视觉外观,越来越多更多的设计师都采用资讯图像,或者模仿这种设计风格。
   
2010网页设计趋势 MazingTech.Com翻译

2010网页设计趋势 MazingTech.Com翻译

2010网页设计趋势 MazingTech.Com翻译

2010网页设计趋势 MazingTech.Com翻译
简约 
安东尼·德·圣-埃克苏佩里曾说过,“完美就是多一点则太多,少一点则太少。” 简洁设计的优点很多。

希克斯定律告诉我们,多出的每一个选择,都需要增加时间来做决定。此外,信号噪音的理论告诉我们,给网站(信号)的信息和功能添加额外的东西,只能令到网站设计效果更差(噪音)。

简单的设计更容易使用和理解,信息传播也更加明确。
极简和网格设计 
极简主义是功能强大,但难以掌握。它仅仅包含的基本要素,多余的一切都抛弃,结果是呈现出元素的最大影响力。

极简设计需要一个强大的行之有效的网格系统。一般的,设计会留有足够的空白,所以如果没有这种网格,一个简约的设计会让人感到截断的和草率的。网格就是赋予它组织和结构。

2010网页设计趋势 MazingTech.Com翻译

2010网页设计趋势 MazingTech.Com翻译

2010网页设计趋势 MazingTech.Com翻译
单页布局 
有几种方法可以简化设计。单页布局展示了其中两种方法:隐藏和删除。

有效的单页布局会隐藏掉那些次要的元素。如果用户希望看到这些元素之一,只需点击一下就呈现出来。这比什么都显示出来更有效果,因为那样会使页面复杂和压抑。

同样,单页布局背后的原则决定了那些额外的页面是没必要的。随着强大的JavaScript库兴盛和网络速度提高,许多网站现在已经没必要使用几个页面。设计人员可以轻松地将信息容纳到一个页面上,不会让用户为层层分级的页面感到厌烦。

2010网页设计趋势 MazingTech.Com翻译

2010网页设计趋势 MazingTech.Com翻译

2010网页设计趋势 MazingTech.Com翻译
巨型的留白空间 
在网站设计之初,我们没有太多的屏幕可以工作,所以并没有表现出很大的空白。如果你曾经尝试为640 × 480分辨率的网站做设计,我说的是什么,你懂的。

现在我们有了更高的分辨率,还可以使用JavaScript隐藏和显示元素,利用留白空间已经容易得多。

空间留白是良好设计至关重要的一部分。给眼睛一个休息的地方。很自然的就提高了设计质量。而且通过元素间距也更容易表达它们之间的关联性。

2010网页设计趋势 MazingTech.Com翻译

2010网页设计趋势 MazingTech.Com翻译

2010网页设计趋势 MazingTech.Com翻译

2010网页设计趋势 MazingTech.Com翻译
   版式布局 
在以前,我们在控制展示内容的时候,仅仅限于少数可选择“网页安全字体“,现在我们有了更广泛的工具来丰富我们的排版。

Web设计者一直喜欢使用型式作为沟通信息的一个微妙工具。随着控制和能力的增强,我们将看到更多的设计师会把印刷样式的排版的作为设计元素重点。

2010网页设计趋势 MazingTech.Com翻译

2010网页设计趋势 MazingTech.Com翻译

2010网页设计趋势 MazingTech.Com翻译
(待续) 

目录
相关文章
|
负载均衡 关系型数据库 RDS
良好架构设计中的可靠性:高可用、容错、灾难恢复
良好架构设计支柱 云计算良好架构设计有五大支柱,分别是:安全性,可靠性,性能效率,成本优化和卓越操作。其中可靠性是指系统从基础设施或者服务故障当中实现恢复、以动态方式获取计算资源以满足需求,以及缓解配置错误或者暂时性网络问题等干扰因素的能力。
5494 0
|
计算机视觉 Python
Python实用记录(一):如何将不同类型视频按关键帧提取并保存图片,实现图片裁剪功能
这篇文章介绍了如何使用Python和OpenCV库从不同格式的视频文件中按关键帧提取图片,并展示了图片裁剪的方法。
755 0
|
前端开发 JavaScript API
解锁高效应用构建:Vuex与后端交互的前端状态同步策略,让数据流动如行云流水,紧跟前端开发的热点趋势
【8月更文挑战第27天】本文深入探讨了Vue框架下的前端状态管理库Vuex与后端服务交互时的状态同步策略。通过剖析Vuex的核心机制——状态(State)、变异(Mutation)、动作(Action)及模块(Module),文章展示了如何优雅地将后端数据加载并更新至前端状态中。特别地,借助示例代码解释了Action处理API调用、Mutation更新状态的过程,并介绍了如何通过模块化和命名空间提高状态管理的准确性和时效性。此外,还讨论了组件如何利用`mapState`和`mapActions`简化状态访问与操作的方法。遵循这些策略,开发者可以在构建复杂应用时显著提升性能与用户体验。
479 0
|
数据采集 数据可视化 数据挖掘
R语言与Python:比较两种数据分析工具
R语言和Python是目前最流行的两种数据分析工具。本文将对这两种工具进行比较,包括它们的历史、特点、应用场景、社区支持、学习资源、性能等方面,以帮助读者更好地了解和选择适合自己的数据分析工具。
635 2
|
边缘计算 物联网 vr&ar
一文带你彻底了解Wi-Fi 7
【9月更文挑战第1天】
1952 0
一文带你彻底了解Wi-Fi 7
|
数据采集 运维 监控
自动化运维:用Python打造简易监控系统
【8月更文挑战第31天】在追求高效的IT世界里,自动化运维不再是奢侈品而是必需品。本文将通过一个Python示例,展示如何构建一个简单的系统监控工具。从数据采集到警报触发,我们将一步步解锁自动化的秘密,让你的服务器管理变得轻松而高效。
|
存储 关系型数据库 MySQL
【高频】什么是索引的下推和覆盖
【高频】什么是索引的下推和覆盖
943 2
|
Java Spring
静态工具类注入mapper对象
项目中需要在一个utils工具类中,调用mapper对象进行查询并进行排序后选出数值最小的数值,然而静态方法里面直接注入会报空指针的错误。现在总结一下解决办法。
1063 0
|
语音技术 Python
语音识别,Pycharm的基础使用,Pycharm如何修改主题,如何配置字体,increase,decre,pycharm如何切换成中文版的,翻译插件的安装,Pycharm常用快捷键,
语音识别,Pycharm的基础使用,Pycharm如何修改主题,如何配置字体,increase,decre,pycharm如何切换成中文版的,翻译插件的安装,Pycharm常用快捷键,
|
前端开发 JavaScript 数据库
uniapp项目实战系列(1):导入数据库,启动后端服务,开启代码托管
uniapp项目实战系列(1):导入数据库,启动后端服务,开启代码托管
1752 2

热门文章

最新文章

下一篇
开通oss服务