克隆这 10 个极简主义网站，提升 HTML 和 CSS 水平

练习或许无法让你完美，但肯定能让你更接近完美。
这里我列出了10个值得效仿的极简主义网站。重点不应该放在动画上，而应该考虑网格、布局、定位、颜色选择和字体排印。

我们走吧

维贝

让我们先克隆一下Wibe。这是一个简洁却相当漂亮的网站。即使不考虑动画和过渡效果，它的排版和网格也令人惊艳。

辛迪卡特

列表中的下一个。尽管加载时间稍长，但Syndicut仍然是列表中最好的之一。它利用图像网格，同时在我们面前显示大文本。提示：使用 CSS 网格。

安德工作室

它看起来有点像第一个，但Andstudio更复杂一些。Andstudio 会调整文本的方向及其在网站上的位置。

文件夹

这是Jesus Sandrea 的作品集。现在我想你已经开始注意到一种趋势了。这些极简主义的网站使用字体、网格和黑白配色来展现信息。有时他们希望我们想象文字内容，有时则希望我们想象图片。

奥利维尔摄影

这个网站相当简洁，但动画丰富。或许他有点过于依赖文字而非图片，但他的网站功能相当强大。

2Che

2Che从黑白以外的颜色入手，巧妙地运用了图像定位和醒目的文字。它或许不够简约，但我很喜欢结尾那张狗狗的照片。

纪尧姆

回到黑白主题，Guillaume的网站也是一款在图片上玩文字的。不过，我还是被那个无限滚动的效果迷住了。

竹中翔平

令人难以置信的是，一点点黑白配色和优秀的字体就能让你的网站看起来如此漂亮。当然，在这个例子中，她的照片让她的网站看起来惊艳极了。

佩英

我们的列表快结束了。Peiying的网站是另一个例子，它展示了如何巧妙地利用文本的位置和方向来让网站更具吸引力。她的网站更注重文本内容，但图片的位置也恰到好处，尤其是在标题的背景中。

00F机构

最后，同样重要的是，00F Agency有一个“蓝色”的网站。除了颜色之外，网站还用十六进制颜色名称来玩转！如果有人看完了这个网站，请在下方评论！

结论

我知道，即使这些网站设计得比较简约，也需要相当长的时间才能完成。我个人会在 Codepen 上分享我正在做的事情。探索新的字体系列、新的网格组织方式以及文本转换方式真的很有趣。

我希望您能像我克隆这些页面一样开心。

你还知道其他一些值得尝试模仿的极简主义网站吗？请在下方评论。

让我们谈谈@camfilho

如果你克隆了其中一个，请给我发条推文。我会很高兴的 =)