设为首页收藏本站

站长之家.源码之家.wap站长之家.wap源码之家

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索
热搜: 域名 空间 程序
查看: 1231|回复: 0

网页排版设计的学习技巧

[复制链接]

7

主题

1

帖子

2

积分

新手上路

Rank: 1

积分
2
发表于 2017-7-1 16:32:51 | 显示全部楼层 |阅读模式
沟通在设计中起着至关重要的作用。这是建立用户和网站之间的明确联系,并帮助你的用户实现目标的关键。当我们谈论网页设计环境中的沟通时,这通常是指文本。排版在这个过程中起着至关重要的作用:网络中超过95%的信息是以文字的形式出现。
好的排版提高了用户的阅读积极性性,反之,差的排版会降低用户的阅读积极性。 正如Oliver Reichenstein在他的文章《Web Design is 95% Typography》中所说:
优化排版就是优化可读性,可访问性,可用性!让整体的图形平衡。
---------------------------------------------------------------------
【职业测试】30秒测试你适不适合学网页排版设计:
http://www.tianhujy.com/list-93-1.html?wm=tt_lyt_wysj (复制到网址框打开)
文字排版部分通常会从页面的一个区域,延伸到另外一个模块所在的区域,比如某个图片上的文字内容延伸到另外一个图片或者彩色区块当中,共享了其他组件的空间。这种设计所牵涉到的页面图层的实现方式会很有意思,因为它可以承载很多富有创造力的设计。
空间共享式文字排版


这种空间共享式排版是一种相当容易识别的设计手法。实际上,在一些海报和明信片设计中,也可以采用这样的设计。它的最典型的特征是,文字或者相似的元素横跨多个图层、模块或者区块。
从广泛意义上来讲,这个设计手法的核心概念是某个元素和其他的元素共享空间,横跨不同区域,元素相互叠加。这种设计常常被视作为分屏设计的一种延伸。
图片和文本的混排

漂亮的排版和精美的图片总能相辅相成。许多设计师都喜欢在使用共享空间式排版的时候,采用垂直定向的图片(不过由于各种屏幕的高宽比不同,这种技术使用的比例并不高。)。
这样的设计有一个好处,由于文本需要跨越不同的区域,配色不用保持完全的统一,根据文字周围的背景色进行调整,这样的设计简单而容易上手。难的地方在于文本内容的分拆和合并的状态下,表达的含义是否都合适。
减少不同类型字体的使用


使用超过3种不同的字体让网站看起来没有结构且不专业。记住,太多的尺寸类型和风格也可能破坏任何布局。一般来说,将字体数量限制在最小限度(两个很充足,通常一个就足够了),并粘贴相同的字体到整个网站。如果使用多个字体,请确保字体系基于字符宽度互相补充。
行间距的重要性

在排版中,我们有一个特殊术语,用于两行文本之间的间距(或行高)。通过增加行高,可以增加文本行之间的垂直空白空间,通常提高可读性以换取屏幕空间。作为一个规则,行高应该是字符高度的30%,以提高可读性。
沿着视觉流向排布


沿着视觉流向来排布信息是一项重要的技巧。文字与图片发生逻辑关系,两者相辅相承,所以此时文字不能覆盖到图片的主体部分——比如需要展示的人物,或者产品本身。信息按照视觉流向排布的时候,图片中的主体会引导你去观看文字信息。
放大

当你不知道要怎么处理素材的时候,试着放大吧。这不仅仅针对图片,它还适用于文字的处理,放大的元素更容易抓住用户的眼球。正如上述的两个案例,放大的咖啡豆强化了对比,放大的文字则极具冲击力。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

友情提示: 没有图片帖子!

申请友链 |Archiver | 站长之家讨论论坛

© 2012-2020 站长之家备案号:( 浙ICP备14006854号 ) GMT+8, 2020-1-24 12:35 , Processed in 0.409276 second(s), 43 queries . Powered by kuhack.net X3.2    

禁止发布任何违反国家法律、法规的言论与图片等内容;本站内容均来自个人观点与网络等信息,非本站认同之观点.如遇版权问题,请及时联系点击这里给我发消息

今天是: | 本站已经安全运行: //这个地方可以改颜色

低部图片

返回顶部