免费获取策划方案多一份参考,总有益处

重庆网站建设

Website construction

案例778

重庆网站建设

在30分钟内改善网站排版的8个简单方法

来源:派臣科技|时间:2021-02-18|浏览:

排版是任何网站最重要的元素之一,对品牌和体验有很大的影响。

它是如此的重要,以至于对你的版式进行大规模的改变——选择一种新的字体,改变衡量标准,增加领先优势——是复杂的,并且充满了潜在的时间消耗。

但是,你可以对你的排版做一些简单的改变,这些改变不会破坏你的网格,而且可以在30分钟或更少的时间内完成。这里有8个最简单的方法。

1. 增加颜色对比

在布局文本时,设计师通常会将文本视为视觉设计中的一个块。设计师与文本的关系与用户非常不同;设计者将文本定位为形状,用户逐行读取。因此,设计师往往会低估文本所需的对比度。

浅灰色文本在美学上很漂亮,但在功能上却毫无用处。文本是用来阅读的,需要在桌面上达到WCAG AA标准,在移动设备上达到WCAG AAA标准——或者在任何有许多环境光源的情况下。文字越大,你的回旋余地就越大。

文本的对比度需要进行彻底的测试,但是首先,在白色背景下,18px的文本颜色不能比#595959浅。

2. 收紧标题间距

绝大多数的字体被设计成作为正文——大块的、多行长的运行文本。当字体被制作出来的时候,它的间距就是为了这个用途。

不像行文,标题往往很短,周围有更多的空白——尤其是上面和下面。额外的空白在视觉上淹没了单词形状的负空间,并迫使字母分开。

为了弥补这一缺陷,将标题的字母间距和单词间距缩小1-5%。

3.放宽非单词间距

当我们阅读时,我们的大脑并不是一个字母一个字母地把单词拼出来;它可以识别单词的形状,甚至单词组的形状。

大多数微排版都关心的是不破坏这些字的形状。然而,有时您确实想要阻止单词的形成,而允许单独的字符。

松开任何文本的字母间距,拟作为一系列字符读取,如序列号、跟踪代码和表格数据。

4. 输入时使用系统字体

隐私对用户来说是个大问题。作为一名设计师,你所能做的任何保证用户数据安全的事情都会增加你网站的正面用户体验。

样式你的HTML输入使用系统字体-默认字体设置的操作系统,你的用户正在访问的网站。这就清晰地划分了品牌字体中的品牌数据和用户字体中的用户数据。

以这种方式使用系统字体可以鼓励用户感觉到他们的数据的所有权,建立信任,并增加转换。

5. 马克段落曾经

文本的段落需要有一个视觉上的指示,表明它们已经开始。通常有三种表达方式:紧跟标题,在段落前留出垂直空格,或者第一行缩进。

每个段落应该使用其中一个指标,而且只能使用一个指标。由于网页内容的性质和标题对快速浏览内容的好处,对于大多数网站来说,最好的选择是遵循标题和垂直间距的组合。

6. 使用真正的风格

由于各种各样的原因,从可用字体到积极的优化,站点使用CSS伪造替代样式是很常见的。斜体可以通过倾斜来伪装成斜体,粗体可以通过使用浏览器的默认设置来伪装,小大写可以通过将文本设置为大写并减少字体大小来伪装。

这些技巧弊大于利,创造出扭曲的文字形状,打断了文本的自然流动。

如果你不能使用真正的斜体、粗体和小大写,那么不要伪造它们。寻找其他方法来突出重点,比如改变颜色。

7. 使用正确的引号

撇号、单引号和双引号都是特定的字符。大多数字体都为它们提供了不同于键盘上快速单引号或双引号键的符号。

这些引号通常被称为“智能”引号,因为文字处理应用程序通常可以选择它们使用的符号是否“智能”。

使用正确的引用是传达一段精炼文本的最简单方法之一。

8. 归化的文本正确

连字符是将一个单词在两行上断掉。它允许不那么极端的右对齐文本,这在移动设备上非常重要,因为移动设备上可用的页面宽度比桌面设备小。

令人惊讶的是,web对正确的连字符的支持很差,但它正在逐步改进,可以作为一个渐进的增强应用。

CSS允许你将连字符设置为none(没有连字符),auto(浏览器自动插入),和manual(使用软连字符指定连字符出现的位置)。

从印刷上看,任何五个字符或更长字符的字内均可插入连字符;在连字符之前至少有两个字符,在连字符之后至少有三个字符。

永远不要在连续的三行文本中使用连字符,但解决这个问题需要JavaScript。您可以通过增加度量值来最小化这个问题。

留言

返回顶部

君
重庆网站建设重庆网站建设在30分钟内改善网站排版的8个简单方法