【译文】4分钟网页设计——Web design in 4 minutes

原作者：jeremy thomas

原文链接：Web Design in 4 minutes

短小精悍的文章，网页设计的重点要点都讲到了，可以视为设计原则，这列清单绝对实用！

建议可以看一下原文，在阅读的交互上也颇有趣~  下面便是译文：

---

让我们假设你有一个产品，一个投资组合，或者仅仅是一个你想要在自己的网站上与大家分享的想法。然而，在你将它发布在互联网上之前，你想让它看起来有吸引力，专业，或者至少足够体面。

你需要做的第一件事是什么?

内容

设计的目的是去美化或者丰富你的内容。这可能听起来很明显,但内容是一个网站的主要元素,它不应该成为一个事后的想法。

文字内容,比如你正在阅读的段落,就已经占据了90%以上的网页。文本内容的样式仍有很长一段路要走。

让我们假设你已经构思好了你想发布的内容并且创建了一个空的css文件,你可以写第一条规则是什么?

制定中心

长文章通常比较难以解析，因此阅读起来也会比较困难。因此，设置每行的字符限制则大大增强了文本的可读性和吸引力。

给文本块设置样式之后，文本自身呢？

字体

浏览器的默认字体为“Times”，这可能看起来缺乏吸引力(主要是因为它是“无样式”字体)。切换到一个无衬线字体像“Helvetica”或“Arial”可以大大提高页面的外观。

如果你坚持想用一个衬线字体，尝试“Georgia”。

这不仅可以使文本更吸引人，也使它更具可读性。

间距

当读者看一个页面而感觉到“破碎”的时候，那就是间距上出现了问题。在文本间和文本内创造适当的空间可以提高你的页面吸引力。

整体的布局到目前为止已经得到了很大程度的提高，接下来我们可以创造一些更加微妙的改变。

颜色和对比

白色背景上的黑色文字会造成眼睛的疲劳，选择拥有更加柔和阴影的黑色字体可以让阅读更加舒适。

为了保证一个不错的对比，让我们选择重要的内容添加更暗的色相

到现在为止页面上的视觉已经得到了大幅的提升，然而一些元素（如代码片段）似乎仍然不合适。

平衡

只需要一些额外的技巧来使页面达到平衡

此时，你可能想让你的页面突出并且给他以身份

原色

大多数品牌都有一个原色（主色）作为视觉符号。在网站上，这种视觉符号的运用可以强调交互元素，比如链接。

次要颜色

我们可以用一些更为微妙的色调来补充我们的主色，将它运用在边界，文本，或者甚至是文本

既然已经改变了颜色，为什么不尝试着改变形状

自定义字体

因为文字是页面的主要内容，自定义字体可以让你的网页的身份更加明显。

你可以尝试使用自己的网页字体，或者使用像Typekit这样的在线服务，这里使用来自谷歌的免费字体服务“Roboto”

通过文本提升了你的身份特征之后，要如何添加上千的字呢

图片

图标和图标可作为装饰物来支持你的内容，或者有效的帮助你表达出你的内容。

可以从 Unsplash 这个网站获取一些漂亮的背景图片来丰富你的内容

添加logo

同时提高文本样式

在几分钟内我们根据网页设计原则已经设计了一个像样的网页了！