|
马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。
您需要 登录 才可以下载或查看,没有帐号?立即注册
x
样式的调整更加方便。内容和样式的分离,使页面和样式的调整变得更加方便。
网页制造poluoluo文章简介:优异计划和出色计划之间的区分是对照小的。常人大概没法注释申明出色的计划的详细不同,但他们能够找到本人喜好的网页计划作品。经由过程对比一下几个优异作品,我总结了一下作为出色计划的几个细节不同。
中文原文:网页计划从优异到出色的6个细节
英文原文:6WaysToTakeYourWebdesignFromGoodToGreat
转摘请说明援用出处。
内容择要
1、公道利用突变
2、留白
3、网格结构
4、进步字体使用
5、明白而无效的导航
6、计划大度、有效的页脚
先容
优异计划和出色计划之间的区分是对照小的。常人大概没法注释申明出色的计划的详细不同,但他们能够找到本人喜好的网页计划作品。经由过程对比一下几个优异作品,我总结了一下作为出色计划的几个细节不同。
前不久,我写过一篇出色网站应当遵守的4个计划准绳。如今这篇文章有点像是上一篇文章的持续。在上一篇文章内里我们重点会商了对照、反复、对齐、支解在网页中的使用。以下内容我以几个优异的网页作品作为实例,来讲明出色计划一向遵守的准绳!
1、公道利用突变
突变不要滥用,更不要把突变弄的跟彩虹似的,不然你的网页作品看起来对照内行。总而言之,公道的利用突变关于优异网站计划是有匡助的。
突变、散景分离利用
Newism网站色采丰厚,但奇妙的突变与背景在视觉上分离的很到位。假如你也有乐趣在Photoshop内里做这个散景效果,能够往Abduzeedo’stutorial网站下面进修一下。
突变、投影、纹理分离利用。
OnWired网站使用了这些计划技能,不言而喻,他的计划作品效果是很棒的!自始自终OnWired网站计划在使用突变、投影、质感这方面是恰如其分的。我也出格喜好计划师计划的这些。
2、留白
留白一词常常简单被曲解从字面注释的空缺。网页计划较为正确的形貌则是网页各个板块元素之间的空间局限。进一步剖析看看AListApart是怎样界说它的。
“留白”关于网页计划是很主要的,留白不至于让你页面元素都聚积在一同。关于年老计划师来讲留白多是一个年夜成绩,他们在做计划的时分将全部页面放的满满的,没有给页面充足的“呼吸空间”。这关于他们来讲大概不是甚么成绩,假如内容放不下的话,他们能够借助扫瞄器的滚条来扩展页面的空间。
优异的留白与奇妙的支解线
Snook网站结构方面计划的是对照公道、恬逸的。同时注重一下,网站内里的虚线将各个板块辨别开了,如许我们在扫瞄网站的时分就一览无余了。
笼统图形
沙发接纳笼统、美妙、繁复的办法。经由过程利用无背景或混乱的图象,给扫瞄者的空间是流利、恬逸的。
3、网格结构
网页计划的网格结构最后的灵感是自创了报纸的排版。可是假如你细心察看四周的事物都能够找到网格征象,从好的计划到生存中的交通网。
960和蓝图多是两个最盛行的网格结构。我团体对照喜好960网格结构,它复杂、重点凸起。你能够用恣意对齐体例来布置你网站的元素,对齐在计划一个庞大的页面时,能使你的网站看起来对照精巧、井井有条,而且你在网页结构内里增加任何模块内容时分都不必思索其他的模块内容。
综合利用网格结构
Poccuo网站综合利用了网格结构,它接纳3列和5列相分离的结构体例。给人以视觉吸引力和视觉空间。
博客接纳列结构
我对照喜好WebDesignLedger首页最下面的展示体例,他把最新的通告内容缩小同时放到页面最顶部,其他的以3列的体例分列。
大批利用相称的列结构
Ecoki大度的网页结构不言而喻接纳的是4列、2行结构,同时幻灯片、缩略图、最新的检察也是接纳不异的体例。
4、改良字体使用
字体使用困扰着年夜多半的计划师。假如要想进步你的计划程度,字体在个中饰演侧重要的脚色。不仅在可读性方面也饰演侧重要的脚色,同时还能够增添计划作品的气氛。
用对照字体引发存眷
SimpleBits网站在使用各类对照字体引诱扫瞄者的注重力方面做的很棒。字体对照能够接纳分歧字体对照、各类色彩对照、字体巨细对照等情势。
不要以为字体就像标记
这个网站看齐来就十分的大度、恬逸,但你能够说出你的设法和感觉来形貌这个感到。特别在间距、字体选择等字体使用这方面做的挺完善的,我就被他的logo字体使用迷住了。
5、明白而无效的导航
优秀的导航关于网页计划来讲很主要,假如扫瞄者不克不及疾速、便利的找到它,他们就很有大概往其余网站了。这是我们所不肯意看到的,同时我晓得MyInkBlog举行了一些改善,并将在今后从头计划中举行完全的改善。
博客导航上面显现分类导航
在年夜多半情形下,博客导航放在页面的同时将分类作为第二导航放在页面的边栏。Tutorial9做了一件了不得的事变,他把扫瞄者体贴的photoshop资本以活泼的体例展示出来了,而且在鼠标经由二级导航的时分有一个高亮效果。
切换分歧的图标效果
图标切换效果在web2.0网页计划内里不管是不是必要被大批、胡乱的使用,而且成为一种趋向。并非一切的都是欠好的,web2.0里用的欠好的缘故原由是过分利用、专业利用酿成的。在年夜多半情形下,得当的使用图标切换按钮是相称无效的。Carsonified网站在导航上就使用了单色、简便的图标切换效果,而且于他的网站全体感到想符合。
6、利用大度有用的页脚
一入手下手我们就将页脚作为主要的内容,在页脚内里安排一些没有多年夜用途的内容。在计划的时分仅仅消费一点点心机在它下面。如今页脚关于全体计划来讲变的愈来愈主要了,万万别错过好的页脚完成你计划。
展现大批的信息和证书
这个页脚次要展现了网站先容和版权等需要的信息。BrianHoff网站更是增加了一些本性、风趣的内容在内里。经由过程3列结构体例展现了作者的事情和倡议性的内容。
增加搜刮功效
ElliotJayStock’s网站在底部增加了一个特年夜的搜刮框…
注:翻译若有不当的中央请留言斧正!
</p>
使页面的字体变得更漂亮,更容易编排,使页面真正赏心悦目。 |
|