网页布局和设计分析
作者/整理：admin 来源：互联网 2018-09-25
1. 上图下文
上图下文更强调了图片的重要性，以“见”这个属性为优先，上图下文需要注意的是图片高度过高会严重影响版面效率，而一个具有商业化目的的产品对首页的版面效率异常看中，同样对图片的质量要求也甚高。通常这样的feed流布局更抓人眼球。
如果确实需要以大图+文的上下方式来布局，尽量找到版面的平衡点，考虑图片与文字之间想要给用户传达的关系和优先级图片的使用尽量使用黄金比例做展示，例如：4:3，2:1，16:9等。
宫格排列式的上图下文能够极大的提升版面效率，一般更多用于电商平台，在首页将某个模块的优质商品进行透出，提高转化和流量。缺点是缺乏信息完整度，在布局时需要考虑更多因设备、极限值带来的不同状况的考虑，上海网站建设。
可以看出：严选将金额跟在标题后面，而非固定位置，这样做的好处是将标题和金额关联度更高，形成一致性。缺点是布局上显得层次不齐影响阅读效率。通常这样的排版会根据业务需要，来选择展示一行或多行文字极限，但由于版面效率它不得不只给了两行的极限高度。
2. 左图右文
左图右文形式的排版应该也算是用的非常多了，其实大家会经常把它和左文右边图进行对比，但无论是左图还是右图，在这样的布局中我们首先就要做好图和文的占比。显示在外面的图片通常是选取了详情中的图片来进行展示，否则就浪费了比较多的人力资源去重新配图了得不偿失。同样和图片搭配的信息字段此时就显得极为重要。
方形缩略图是最常用的形式，不至于太窄也不至于太宽，对于右侧信息的布局也显得更游刃有余。横形的图片会让右侧的文字显示空间压缩的厉害，通常在视频缩略图会用到，但图片对整个页面的氛围感会更好。松江网站建设。
竖形的图片让右侧信息有更多的发挥空间，同时版面的留白也更大，但是如果右侧信息过少，则会让页面有些单调和不完整。
建站咨询
021-61842014
