给程序猿看的web页面设计和排版

不擅长界面设计，但是又想与设计妹妹和谐友爱的开展工作，你想过木有来来了解学习一下网页设计的排版布局小知识呢?至少这样设计菇凉不会泪眼婆娑的看着你把她辛苦打造的设计稿，最后改的面目全非。拿出一点敲代码或者看片的时间来欣赏下本文的案例吧。

因为讲大道理也没用，就先来看看这些网页案例的截图吧，你肯定会有收货的，至少不会觉得世界还是被table包围的!

1、圆形，完美而不受拘束的形状。

希望引起看客注意的文字、链接等部分，你可以为它们染上靓丽的色彩，注意一小点就可以了——如果到处都是亮色，就没有亮色了…

2、一个个人主页，大大的纯黑hello，不由得让人联想到主人的随性、洒脱、热情，或许还有那么一点儿无厘头的可爱…

3、居右排版，左边只给出一个清晰的摄氏度标志，投在页面上的影子呈现出立体的效果，take the temperature——consider，类比很特别，想法读来很窝心~~

4、亲爱的coder们，如果你对黑白色感到腻味了，#43BBEF是个很不错的选择：清爽、敞亮、优雅。

据说，每一个coder都必须和英文打交道，据说，英文排版的话居中总是没错的…

5、圆形链接背景，图文混排，文字颜色有深浅区别，不多说

6、这就是传说中的网格背景了，避免单调的最好办法就是打格子，设计师肯定懂的，面对一张新建的空白稿纸，第一步，显示网格。

不过，英文排版与中文还是有些区别的，至少字体种类比中文丰富很多很多，但是——我们有惊艳饱满的繁体字!

从小我就觉得，会写繁体字显得很有文化…

7、与6中不同，这种风格适合喜欢摄影又文艺的coder们，好处自不必多言:)。

8、这种比较复杂，怕麻烦的coder请绕开走，不过，应该可以找到现成模板的，修改背景图片为自己喜欢的，ok。

>

9、你喜欢这个图么?我很喜欢，简洁大方的灰色系，年幼时看的动画片里物品的风格，优雅中透着温馨…

10、标题居中，缀饰花纹，画一般的字体，很朴素，很优美。

11、淡淡的骄傲感从这个圆形头像和简单的文字说明里流了出来…话说圆形头像真的很别致，建议用彩色照片…

12、我的163博客…一直想搬出去自己搭建，又比较怕麻烦…这个页面，也很简洁，菜鸟程序媛一枚。