原文地址:http://blog-en.tilda.cc/articles-website-design-mistakes
原作者:Nikita Obukhov
转发请注明来源
首页设计的常见错误
1. 页面内容未分成对应的逻辑块
当页面被分成明显的逻辑块时,会更加利于用户阅读。试试设置 120px - 180px 之间的间距,并用不同的背景色块来区分不同的逻辑块。
2. 页面元素之间的间距不对称
逻辑块应该采用相同对称的间距进行包裹,否则页面会看起来一片混乱,用户不会留心观看每个逻辑块。
(译:简单来说就是会逼死强迫症)
3. 太小的块间距导致用户无法将页面内容分成明显的逻辑块
使用至少 120px 以上的间距来分开不同的逻辑块(每个块的上、下边距,即padding)。
4. 避免图片上的文字与图片的对比度太低
文字与背景的背景的对比应该足够明显,为了让文字层更突出,可以给背景色加上一层遮罩,黑色是常用的遮罩颜色,但也可以试试混上明亮的颜色。
另一个方法是采用明暗对比明显的图片作为背景,并把文案放在暗色部分的顶部。
5. 单个页面用了太多样式
一个页面上应用了太多不同字体和设计风格会有一种不专业感且难以阅读。采用单种字体以及两种字重(如粗体和正常)来避免这种情况。
6. 色块太窄
不要用色块来强调太窄的页面元素,比如说标题在采用了大字体、粗体和上下间距后已经足够明显了,无需再画蛇添足。当你想突出页面的某一部分的时候,不如直接为标题和内容部分整体添加一个统一的背景色块。
7. 在一个很窄的列里放置太多的文案
当在很窄的列里放置了太多的文案,用户不得不逐行阅读从而增加了阅读成本。砍短啰嗦的文案吧,不然也没人会去仔细看的。
8. 居中文本过多
文本比较少的时候采用居中排版可以增加美感,但是在文本内容过度的情况下,用户每次读新的一行都要找一下下一行开始的位置。如果你真的有很多内容,可以把它们分成几个块,并用标题来概括它们。
9. 文案与背景图片的主体部分叠加
避免文案与图片的主体或重要部分重叠,这会使得图片与文字都变得难以辨认。试试改变文案的排版,比如居中、居左、垂直对齐。
10. 主次不分
为了分清页面中信息的主次,封面上的字体应该大于或至少跟其他标题的字体大小一样,特别是标题很长的时候。
这个原则同样适用于逻辑块里的主次设计。主标题应该是最大的,然后才是次标题。次标题应明显小于主标题,并采用相同的字重,而次标题下面的内容应该采用相对最小的字体大小,这样有助于用户区分信息的重要性。
11. 一个逻辑块被切成了2部分
文字后面采用了全屏图片或者滚动图片,看起来像两个相互独立的部分。如果在图片或者滚动图片周围添加一些空白,它们就会自然地变成一个整体,因为这时候能看到它们共同的背景色。
12. 标题过大、过长
超大字体对于短文本很合适,但当句子比较长的时候不妨换用小一点的字号,这样会更利于阅读,且不会占用太多其它元素的空间。
13. 滥用按钮的边框样式
如果按钮是透明的,那么添加边框是很有必要的,否则就显得没什么道理,只会加重页面的负担且难以理解。
14. 采用了太多的颜色
一个页面采用过多的颜色显得很混乱,到底哪部分才是重要的?一到两个颜色对于区分主次已经足够了。
15. 拥挤的导航栏
导航栏对于用户导航和内容查找很有帮助,但是不要过分地填充信息,这反而会让导航栏难用。导航栏上采用 5 - 7 个元素是比较合适的。