网页设计中的网格样式是在互联网高速公路上的所有混乱中保持冷静的一种方法。在本文中，我们将了解这种风格是什么，它是如何实现的，并获得一些很好的例子来加以说明。

网页设计中的网格样式

它是什么?

基本上，这种风格意味着你把你的网站分成网格(根据您的口味大小不同)，这样你会得到更多的系统。画出横线和垂线，它们在一定的间隔内相交，这样你就有了基本的概念。

回顾历史，这种风格从20世纪30年代开始就在印刷和排版中使用，但近年来才开始在网页设计中流行起来。最受欢迎的网格类型是360和Blueprint。

我为什么要一个?

通过使用网格系统，您很可能会得到更好的外观，更容易组织您的内容，并在以后进行增强。虽然有些人觉得这限制了创造力，但重要的是要明白，即使你在使用这个系统，你仍然可以有很多创造性的选择。新访客到你的网站更可能发现它更容易导航和吸收你的特色信息。

我该怎么做呢?

和所有的设计一样，你应该从你想要的东西的草图/模型开始。在使用网格系统时，在考虑实际的美学之前要先建立数学方面。显然，您的内容将从一开始就发挥作用，因为您将需要一个支持您想要通信的内容的网格。整个过程可能是相当多的工作和计算，但您将得到一个看起来整洁的结果，并给出一个干净的外观。

网页设计中网格风格的30个典型例子

这里我们收集了一些使用网格样式布局的网站的例子。正如你所看到的，有很多方法可以做到这一点，而且与其他网站相比，它提供了一个更干净、更专业的外观。

Ourhype

钱伯斯贾德

Superawesome

Tastespotting

Sylvain图卢兹

Kokori & Moi (http://www.kokoromoi.com/)

马克•博尔顿设计

耶稣罗德里格斯Velasco

31日三

Macalicious

我是Shimone

Ungarbage

早间新闻

帽盒

Teachinghistory

塑造创意和数字工作室

Bisgrafic

用户体验杂志

网格系统

安迪·拉特里奇

杰克Przespo

Busara

Quipsologies

Designunit

Moodyguy

先生(http://www.studiomister.com/)

MCQ

最好的奖励

酷与指南

Velhetica

我们希望你喜欢我们的选择，并看到这种风格有很多可能性，通常留下一个干净和专业的外观。没有任何规则规定你如何填满你的网格，这都是关于保持你在一个系统中所拥有的。

想了解更多吗?

如果你觉得这个话题很有趣，想要了解更多，我们收集了一些资源，你可以从这里开始:

• 使用基于网格的方法进行设计——这篇文章是不久前写的，但是它是一个很好的地方，可以阅读更多内容，还可以了解一些关于这种风格的您还不知道的东西。
• 基于网格的设计101 -另一个伟大的采取这种风格。对于那些不一定要读很多很多关于这个主题的页面的人来说，这是很好的选择。
• 开发支持您的设计的网格——这是一篇不错的小文章，展示了一些如何计算和设置网格的示例。
• 网格系统-伟大的资源，为文章，教程和更多。对网格样式感兴趣的设计者的一个必须!

现在，你的观点是什么?

我们希望这篇文章对您理解这种风格有所帮助，给了您一些很好的例子来启发您，并提供了一些可以进一步帮助您的资源。像往常一样，我们希望听到你的意见!