简单布局上如何协调网页样式

Dec 24th, 2008 Add Comment
PSDTUTS image

这是一个 PS 狂人制作的一个关于如何搭配网页样式, 图片和背景和教程. 对一个网页来说, 页面的协调性, 配色和结构的合理使用比炫目的效果和夸张的展示更为之重要, 一个好的网页设计不但要凸显其主要部分, 更应该让人百看不厌, 毕竟我们不可能每天换一个界面来吸引用户. 如果你正准备亲手设计一个主题, 这会是你很好的指引.
阅读教程请访问: PSDTUTS

我以前也介绍过这个网站的一个教程, 一个绚丽的 Blog header 设计, 有兴趣的也可以看看. Click here

对于颜色的搭配, 个人觉得 Yahoo! 是做到最好的, 可以多参考, 不知道你觉得如何? 另外, 还可以参考一下 COLOURlovers 上的配色方案.

声明: 本文采用 BY-NC-SA 协议进行授权. 转载请注明转自: 简单布局上如何协调网页样式

  1. http://1.gravatar.com/avatar/1e4d16b38ceedabe137b849218ec780a?s=32&d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    小赵。 | Oct 3rd, 2009 at 11:58

    很厉害啊，这样的简单换一换就又成了一个新的主题

  2. http://1.gravatar.com/avatar/1ec4717231e96f16618449f9ebb32c5c?s=32&d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    austin | May 2nd, 2009 at 21:35

    平安夜快乐!

  3. http://1.gravatar.com/avatar/bb3664adbe5be014683bfa0c1d5c1b56?s=32&d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    chui | May 2nd, 2009 at 21:34

    很好的介绍

  4. http://1.gravatar.com/avatar/b31248747815c9e524b6841344a1c956?s=32&d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    jgqxiao | Feb 24th, 2009 at 15:29

    Yacca :平安夜快乐!^^

    @Yacca

  5. http://1.gravatar.com/avatar/73a56b236f0f1e90ae36324efca50c58?s=32&d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    skyzi | Jan 12th, 2009 at 19:18

    节日快乐!!

  6. http://0.gravatar.com/avatar/4393d72aa90df5c55989311b9aa7c676?s=32&d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    Sumi | Jan 2nd, 2009 at 22:24

    节日快乐!!

  7. http://0.gravatar.com/avatar/441378c6c43949b520b3133e9bb24379?s=32&d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    林晨 | Dec 31st, 2008 at 23:39

    博客，头部设计很重要，网站的整体风格往往是从头部开始

  8. http://1.gravatar.com/avatar/1111d649d200016aeda4fb9257fe3754?s=32&d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    charm | Dec 25th, 2008 at 23:52

    :oops: @mg12

    谢谢，我知道怎么回事了。你是单独发布的在后台，没有另写php文件，谢谢你！

  9. http://1.gravatar.com/avatar/1f566ab453c4d8067350c3aee60390d0?s=32&d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    xiaosilent | Dec 25th, 2008 at 22:30

    确实很强……

    圣诞快乐

  10. http://1.gravatar.com/avatar/17f8548adb054bd56791e3fcb6843085?s=32&d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    火星蜥蜴 | Dec 25th, 2008 at 22:21

    @Vern
    嘿嘿，我错鸟~

  11. http://0.gravatar.com/avatar/490cf262668eebb0f0f1a50d9d48d702?s=32&d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    mg12 | Dec 25th, 2008 at 20:50

    吖Bee :
    呵呵，打算新年有时间来自己做个风格~ Merry Christmas !

    我精神上支持你! 哈哈~

  12. http://1.gravatar.com/avatar/fbf12ffbc40eb9d3169c34b835cd1ab9?s=32&d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    Vern | Dec 25th, 2008 at 18:26

    @火星蜥蜴
    好意思说我...

  13. http://1.gravatar.com/avatar/b2a4a8583709521e13d79f8519b07954?s=32&d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    吖Bee | Dec 25th, 2008 at 13:11

    呵呵，打算新年有时间来自己做个风格~ :arrow: Merry Christmas !

  14. http://0.gravatar.com/avatar/6f9935a43c1bb516adb133acf7596ec3?s=32&d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    玄玄 | Dec 25th, 2008 at 10:25

    圣诞快乐！这个网站不错，收藏了。
    @charm
    可以用这个插件Clean Archives Reloaded：http://wordpress.org/extend/plugins/clean-archives-reloaded/

  15. http://0.gravatar.com/avatar/490cf262668eebb0f0f1a50d9d48d702?s=32&d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    mg12 | Dec 25th, 2008 at 00:21

    charm :
    mg12兄。 你好。我想问下，archives 这个页代码是后台贴的，还是有专门的一个文件页.php页啊，你看下我的http://www.kelequ.com怎么老是弄不出你那效果！

    我这个页面的效果没有在发布的主题中实现, 你可以借助一些插件实现这样的效果. 我只是嫌那个插件加载的东西太多放弃了而已.

    @Zoll
    虽然是洋节, 但你也要快乐, 大家都要快乐.

    @icyleaf
    是的, 忘记了, 改过来了.

    @深红色
    某君的博客订阅 25 万, 你可以到我的友情链接中寻找此人. 哈哈~

  16. http://0.gravatar.com/avatar/6ddc697872837ce41e883869fbafd018?s=32&d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    深红色 | Dec 24th, 2008 at 23:02

    订阅3W多，那是相当的狂！。。。

  17. http://0.gravatar.com/avatar/6ddc697872837ce41e883869fbafd018?s=32&d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    深红色 | Dec 24th, 2008 at 23:00

    确实是一个狂人 :razz:

  18. http://1.gravatar.com/avatar/bc0c69a6bf72455c4abb653a1d70747a?s=32&d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    Alan | Dec 24th, 2008 at 22:43

    很好的介绍

  19. http://0.gravatar.com/avatar/8bc5a10d6cd90aec2d2e24b53042856f?s=32&d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    HK | Dec 24th, 2008 at 21:02

    不懂设计，但是还是可以去看看 :razz:

  20. http://0.gravatar.com/avatar/e1bdf3a548d59e1d98cc812af5363902?s=32&d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    icyleaf | Dec 24th, 2008 at 18:26

    这篇文章的链接还是中文...是不是忘记改了...

  21. http://0.gravatar.com/avatar/a17c018c6abda50eeb3fba10fdb0a73e?s=32&d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    硅谷IT后生 | Dec 24th, 2008 at 16:55

    不错，节日快乐！

  22. http://1.gravatar.com/avatar/1111d649d200016aeda4fb9257fe3754?s=32&d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    charm | Dec 24th, 2008 at 16:31

    mg12兄。 :grin: 你好。我想问下，archives 这个页代码是后台贴的，还是有专门的一个文件页.php页啊，你看下我的http://www.kelequ.com怎么老是弄不出你那效果！

  23. http://0.gravatar.com/avatar/e8f87528ed0a0eaba60009f8580df401?s=32&d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    underone | Dec 24th, 2008 at 15:14

    作为色盲的我。。。。。路过。。。

  24. http://1.gravatar.com/avatar/365cff6a854db037729c4cafebe11645?s=32&d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    Betty | Dec 24th, 2008 at 13:32

    我觉得他一笔带过的基本骨架那一步（就是正文第二幅图那一步）就挺不容易的了……

  25. http://1.gravatar.com/avatar/5b5274fe979864736dc6cf59036eed3c?s=32&d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    Zoll | Dec 24th, 2008 at 13:05

    MG12兄，节日快乐^^

  26. http://0.gravatar.com/avatar/c4e6643ae2a4a07665ae1723450e5e60?s=32&d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    忘记月亮 | Dec 24th, 2008 at 12:41

    正缺这个呢 收下了
    双蛋快乐 对了元旦有时间一起玩玩吧

  27. http://0.gravatar.com/avatar/401b6aa08d03f959bc41a4f33e4fea6c?s=32&d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    Yacca | Dec 24th, 2008 at 11:28

    平安夜快乐!^^

  28. http://1.gravatar.com/avatar/53d338346bc58d651af40c4981cdfd66?s=32&d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    YyStr | Dec 24th, 2008 at 10:57

    好长链接啊,圣诞快乐!

  29. http://1.gravatar.com/avatar/917ccf140d8e8a321bd1c2d52ef8b549?s=32&d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    小墨 | Dec 24th, 2008 at 10:45

    多谢~！

  30. http://0.gravatar.com/avatar/0226b4ae91f1b1c50d6ac8003a1297f6?s=32&d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    dcplus | Dec 24th, 2008 at 09:47

    what is PSDTUTS? I never heard it :mrgreen:

  31. http://1.gravatar.com/avatar/17f8548adb054bd56791e3fcb6843085?s=32&d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    火星蜥蜴 | Dec 24th, 2008 at 09:44

    PSDTUTS很强大，俺很早以前就开始follow这个网站了

  32. http://0.gravatar.com/avatar/8eb05daeae832f4d0d5fa7dd5ff987dd?s=32&d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    idigital | Dec 24th, 2008 at 08:43

    Yahoo的配色的确很好呀，希望老大能搞出相应的模板提供下载 :grin:

  33. http://0.gravatar.com/avatar/cab963ed5a8f34ea97a0769184715808?s=32&d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D32&r=G
    calcifer | Dec 24th, 2008 at 08:01

    嗯，嗯……一直想学习一下这方面的，早期的鸟有虫吃，早期的人有沙发拿～

Add Comment Read Article