网站设计的简洁之道:优势和方法

  在网页设计中,简洁并不一定等同于极简主义者的设计美学。简洁的网站只是从设计、内容、以及代码中移除了所有不必要的元素。而极简主义的网站普遍符合这一标准,有许多网站,不管你如何想象,都不会被认为是仍适合简单的定义的“极简主义”。

  下面是简洁网站设计的一些优势,以及一些简洁设计过程中的简单的技术。

  

  简洁网站的优势

  1. 简洁的设计让网站更容易导航

  简洁的网站没有冗余的信息。这在两个方面有助于导航:通常,网站拥有更少的页面和栏目;或者网站的设计通常是干净整洁的,更容易找到导航元素。网站的简洁设计是一个很好的解决导航可用性问题的方案。

  下面是关于导航简洁设计的一些小建议:

  • 只使用一个主导航菜单

  • 确保导航在一个网站中保持连贯性;

  • 不要使用下拉菜单作为导航,下拉菜单容易隐藏一些零乱的菜单;

  相反,强迫自己将一些导航要素纳入到网站设计中。通常,这将使得导航更加简洁。

  2. 简洁的设计让页面加载更快

  简洁的设计一般产生较小的文件,而较小的文件加载速度会更快。此外,如果你保持代码的简单和精简,你就不太可能去调用多个样式表,或者是大量的JavaScript文件,或其他增加网站HTTP请求数的内容。更快的加载和响应速度提高了网站的用户体验。

  3. 简洁的设计让内容更容易被“浏览”(Scannable)

  当你的网站上没有大量装饰性元素的时候,内容就成了主角,这便于访客浏览。

  有一个调查显示,79%的受访用户只是在浏览一个新页面,只有16%的用户会逐字逐句去读一个页面。最好是服务好这些浏览的访客,而不要得罪他们。通过把网站的内容放在前面中间的位置,让访客能快速浏览那些是什么内容。这些访客会认为你的网站非常友好,有可能下次还会再来。

  4. 简洁的网站设计和创建会更快速

  如果你的网站设计是简单的,编码也很有可能是简单的。设计一个布局简单,只有一个或者两个页面模版,以及简单的排版的网站要比设计一个拥有八个版本,排版复杂,并且有复杂限制和编码背景的网站要快速地多。

  不过需要注意的是,创建一个网站看起来简单,但实际上是相当复杂的事情。以保持代码尽可能简洁为目标。有时候,只需要调整某些元素的margin或者padding,或稍微移动下,都有可能使得代码大大简化,而不会对网站的前端设计产生明显的影响。

  5. 简洁的代码更容易Debug

  如果你的代码是简洁的,这就更容易发现bugs。和只有30个属性的样式表相比,如果有300个不同的属性,这将使得你要花更长的时间去找出是哪些属性出了问题。

  从一开始就要寻求使得代码简洁的方法。像合并一些css属性和定义能使得样式表成为一个整体并且更加简短。合并样式表或者js文件也能使得网站的整体代码变得更简洁。

  6. 较小的文件意味着较少的服务器空间

  在上面我们已经提到了,简洁网站的文件通常比复杂网站的文件要小。这意味着你的网站和其他网站相比,将占用较少的服务器空间和带宽。也许,对于一个月只有几千名访客的网站来说,这可能不是什么大不了的事,而对于哪些有更多的网页和网站的访问者的站点来说,这些加起来其实是一个庞大的储蓄。想想看,一些极简的网页上的图片大小可能会低于100KB,而一些复杂的网站有时候可能达到1MB。这意味你站点的成本和一个10倍流量于你的简单站点是差不多的。如果你的站点有很多的内容或大量访客,简化你的站点,减少你站点文件的大小是一件有意义的事情。

  怎样使你的网站变得简洁?

  移除不必要的装饰元素

  很多网站的初始设计中包含了许多没有什么用的装饰元素。不需要将全部装饰元素从网站上移除,哪怕移除一部分通常都可以使得网站变得更加干净和精致。

  像图片边框,下拉阴影特效、头部和尾部中额外图片、以及个别页面上用作额外说明的图片(通常情况一张或两张图片就足够了)都可以移除或者简化。

  问自己:“这些元素真的很重要吗?”

  这是创建简洁网站的一个极好的问题。在每种元素上,不管是设计、编码,或者是内容,都应该问问自己这些是否是真正必需的。

  也应该看看网站上哪些元素是可以被合并的。一些页面是否可以合并成一个页面?你能否合并一些样式来简化样式表?你的设计和代码中至少有一些可以合并从而使得网站简洁的东西。

  确保网站后端和前端一样的简洁

  很多设计者只关注前端的设计而很少注意到他们的代码。一些看起来简洁的网站在后端却是乱糟糟的。确保您的网站标记尽可能的简单。这可能是限制你的样式表的样式数量或使用JavaScript效果的数量来实现的。这也意味着书写好的,符合标准的标记。

  这也意味这你应选择一个合适的内容管理系统(CMS)来作为网站的架构。有些CMS是相当复杂的,而一些网站从它们的复杂性中获益,有些的CMSS过于复杂化,也有来自其复杂性站点的好处,他们可以很容易地为许多站点矫枉过正。选一个能提供只需或允许你打开和关闭功能的内容管理系统。

  Excellent Examples of Simple Website Designs

  一些优秀的简洁网站

  

  

  

  

  

  

  

  

  

  

  

  原文作者:Cameron Chapman

  原文链接:Simplicity in Good Web Design : Advantages & How -to

  译者:puting

  本文链接:http://www.socialbeta.cn/articles/simplicity-in-good-web-design.html

  转载请保留以上信息。

时间: 2025-01-22 20:31:41

网站设计的简洁之道:优势和方法的相关文章

网站设计的简洁化

对于一个网站,模版就相当于是网站的门面了,特别是像文字网站这类的网站,一个简洁优质的网站设计是留住用户的关键所以. 对于网站的模版这块,我建议大家不要为了眼前的利益去放一些弹窗.富媒体之类的广告,因为这样会影重降低用户的体验好评度,对于搜索引擎来说也是很不友好的. 网站定位是我们在建之初就应该要想好的,这也是我们得到用户信任的一个基础,一定不要去做"标题党"专搞一些标题与网站内容不符的事情,因为这个是存在欺骗性的,除了用户会反感以外,但是时间久了一定会让搜索引擎给打入"冷宫&

网站设计参考:简洁的白色风格网站设计实例

当说到网站,白色常常是高雅.极简和时尚的标志.你可以使用白色创造空白,以保持简洁,或引导你的页面的其它元素的注意力,也可以让你的网站保持一种简洁和极简的视觉效果.很多网站使用白色作为他们的主色调,这也就是我们将在这里展示的.你可能之前有见到过这些网站,但是他们如此出色以至于我不得不再次推荐它们.如果你有遇到漂亮的中文网站,可以通过评论分享给我们. Made by Sofa iA Fell Swoop Sherpa. 72 Rivington Street Zander Martineau tel

提高网站在Google中的排名 ——面向搜索引擎的网站设计

google|排名|设计|搜索引擎 内容摘要:目前中文网站在整个互联网中的影响还比较小,这主要是由于中文网站总体的水平(技术上,内容上)都还相对落后造成的,最主要的表现有: 行业知识:不知道搜索引擎对吸引的新用户的重要性,在搜索引擎排名服务中追求"傻瓜相关",购买一些其实没有太多实际意义的行业关键词.其实能够用户输入的关键词越多,真对性越强,价值越高.用户能够直接定位到产品具体内容页比到网站首页有价值的多: 发布技术:网站的网页进入Google的索引量非常小,动态网页仍是主要发布机制,

提高网站在Google中的排名——面向搜索引擎的网站设计

内容摘要: 目前中文网站在整个互联网中的影响还比较小,这主要是由于中文网站总体的水平(技术上,内容上)都还相对落后造成的,最主要的表现有: 行业知识:不知道搜索引擎对吸引的新用户的重要性,在搜索引擎排名服务中追求"傻瓜相关",购买一些其实没有太多实际意义的行业关键词.其实能够用户输入的关键词越多,真对性越强,价值越高.如果用户能够直接定位到产品具体内容页比到网站首页有价值的多:发布技术:网站的网页进入Google的索引量非常小,动态网页仍是主要发布机制,缺乏将动态页面链接表现成静态页面

怎样设计一个简洁的手机网站

"良好的交互设计关注人们所想,所做以及所感"--斯蒂芬·P·安德森 安德森的这句话适用于整个交互设计领域,同样这也是手机交互设计的真理.让用户快速地找到他们想要的信息是手机交互设计的必要条件.最重要的一点还是用户可以以最简便的方式找到最重要的东西.由于手机是一个最为私人的设备,所以一定要让用户对自己正在做的事有着非常好的感觉,这样才会让他们越来越多地光临你的网站. 我在去年购买了N95,现在我在去上班的路上检查和整理邮件,通过手机上YouTube看视频,实时地检查Twitter fee

div+css布局网站设计优势在哪里?

div+css布局网站设计的优点,div全称division意为区分使用div的方法跟使用其他tag的方法一样,而css中文译作层叠样式表单,在主页制作时采用css技术,可以有效地对页面的布局.字体.颜色.背景和其它效果实现更加精确的控制. div+css布局网站设计的优点 业界越来越关注div+css的标准化设计,大到各大门户网站,126邮箱登陆小到不计其数的个人网站,在div+css标准化的影响下,网页设计人员已经把这一要求作为行业标准.那么什么是div+css标准?div+css的标准化设

提升网站设计形式的几种方法

   提到网页设计,最先想到的是当今主流的韩国设计和扁平化设计,当然个性化排版.视频代替文本.全屏大视野.滚动视差.多平台全适应等设计形式已经进入了我们的视野.西方简单.功能性的美学精神"少即是多"这一设计理念攻占了我们的大脑,很多时候,在开始做设计之前脑子里会来回浮现这些风格的设计.那么,怎样在主流设计方式中做出有自己特色的网站呢?我们从以下几点介绍在大环境下提升网站设计形式的方法. 那么,怎样在主流设计方式中作出自己的特色呢?我们从以下几点介绍些提升网站设计形式的方法: >

另辟蹊径谈创新!提升网站设计形式的几种方法

中介交易 SEO诊断 淘宝客 云主机 技术大厅 提到网页设计,最先想到的是当今主流的韩国设计和扁平化设计,当然个性化排版.视频代替文本.全屏大视野.滚动视差.多平台全适应等设计形式已经进入了我们的视野.西方简单.功能性的美学精神"少即是多"这一设计理念攻占了我们的大脑,很多时候,在开始做设计之前脑子里会来回浮现这些风格的设计.那么,怎样在主流设计方式中做出有自己特色的网站呢?我们从以下几点介绍在大环境下提升网站设计形式的方法. 那么,怎样在主流设计方式中作出自己的特色呢?我们从以下几点

掌握单页网站设计的5大技巧

  的确,单页设计已然是网页设计的大趋势了.许多流行的设计元素和设计方法都逐渐与这种网页设计手法融合到一起,越来越多的设计师和企业机构开始选择单页网站作为他们沟通世界的门户,而用户也开始接触越来越多的形式多样的单页网站. 但是在很久之前,在单页网站还非常简单的阶段,很多人都认为这是一种非常Low的网页设计方式,直接粗暴如同商业名片一般的网页结构怎么看都和高大上没有血缘关系,谁又会想到这种设计方式在今天会如此流行呢?在设计师们的不懈探究之下,单页设计已经摘掉了混乱单调的帽子,构建起了一套相对比较完