专业网页设计教程

  ⒈ 网页设计理念

  ⑴ 内容决定形式

  先把内容充实上,再分区块,再定色调,再处理细节。

  ⑵ 先整体,后局部,最后回归到整体。

  全局考虑,把能填上的都填上,占位置。然后定基调,分模块设计。最后调整不满意的几个局部细节。

  ⑶ 功能决定设计方向

  看网站的用途,决定设计思路.商业性的就要突出赢利目的;政府型的就要突出形象和权威性的文章;教育性的,就要突出师资和课程。

  ⒉ 网页配色基本概念

  ⑴ 白纸黑字是永远的主题,谁都说不出不好来。

  ⑵ 网页最常用流行色

  兰色——蓝天白云,沉静整洁的颜色。

  绿色——绿白相间,雅致而有生气。

  橙色——活泼热烈,标准商业色调。

  暗红——宁重、严肃、高贵,需要配黑和灰来压制刺激的红色,

  ⑶ 颜色的忌讳

  忌脏——背景与文字内容对比不强烈,灰暗的背景令人沮丧!

  忌纯——艳丽的纯色对人的刺激太强烈抗议,缺乏内涵。

  忌跳——再好看的颜色,也不能脱离整体。脱离群众是自取其辱!

  忌花——要有一种主色贯穿其中,主色并不时面积最大的颜色,而是最重要,最能揭示和反映主题的颜色,就象领导者一样,虽然在人数上居少数,但起决定作用。

  忌粉——颜色浅固然显的干净,但如果对比过弱,整得苍白无力了,就象病夫一样无可救药。

  蓝色忌纯,绿色忌黄,红色忌艳

  ⑷ 几种固定搭配

  蓝白橙——蓝为主调。白底,蓝标题栏,橙色按钮或ICON做点缀。

  绿白兰——绿为主调。白底,绿标题栏,兰色或橙色按钮或ICON做点缀。

  橙白红——橙为主调。白底,橙标题栏,暗红或桔红色按钮或ICON做点缀。

  暗红黑——暗红主调。黑或灰底,暗红标题栏,文字内容背景为浅灰色。

  ⒊ 如何快速高效的完成设计工作

  天下文章一大抄。

  就看你会抄不会抄。抄的是道念,思想,局部精致的点缀。

  在网上搜索同类网站,找几个顺眼的,用一个为基本兰图,把几个优点整和成自己的,这样最高效快捷,而且还出成果,能学到很多东西。

  转载请注明出处:网页设计大本营 http://www.code-123.com/sjll.htm

时间: 2024-10-28 14:20:18

专业网页设计教程的相关文章

PS网页设计教程IV——如何在Photoshop中创建一个专业博客网站布局

向Talk-Mania网站致敬.一年前,在该网站上看过许多不错的网页设计教程.一年后,再回头想看看有没有什么新的教程的时候,蓦然发现该网站已经打不开了.也许是关闭了,也许是改了网站名了.幸好,去年本人还是下载保存了几个教程,本教程就是其中之一.也希望能看到更多的PS网页设计教程的网站,以及更多优秀的设计.   约定: 1.本文的软件是Photoshop CS5版本 2.原教程的截图是英文的,本人在重新制作的基础上,重新截了中文版的图 3.原文中有些操作没有给出参数.本人在反复测试的情况下测定了一

PS网页设计教程VI——在Photoshop中创建一个食物博客布局

作为编码者,美工基础是偏弱的.我们可以参考一些成熟的网页PS教程,提高自身的设计能力.套用一句话,"熟读唐诗三百首,不会作诗也会吟". 本系列的教程来源于网上的PS教程,都是国外的,全英文的.本人尝试翻译这些优秀的教程.因为翻译能力有限,翻译的细节上还有待推敲,希望广大网友不吝赐教. 约定: 1.本文的软件是Photoshop CS5版本 2.原教程的截图是英文的,本人在重新制作的基础上,重新截了中文版的图 3.原文中有些操作没有给出参数.本人在反复测试的情况下测定了一些参数,以红色的

PS网页设计教程——30个优秀的PS网页设计教程的中文翻译教程

作为编码者,美工基础是偏弱的.我们可以参考一些成熟的网页PS教程,提高自身的设计能力.套用一句话,"熟读唐诗三百首,不会作诗也会吟". 下面是本系列的30个优秀PS网页设计教程的翻译教程,本人历时一年有余,翻译了这些教程.在翻译的过程中,重新截了中文版的图,也修正了一些参数,并给出了一些更好的技法的建议,更加适合新手上手练习,适合初学者临摹学习,也可以给有一定基础的设计者做个参考. 在这儿和广大网友交流,大家互相学习,互相提高.      PS网页设计教程I--在Photoshop中创

CSS网页设计教程:表单Button的Outline

文章简介:CSS网页设计教程:表单Button的Outline. outline的使用,大家都喜欢在reset样式表中直接重置: * {   outline: none; } Eric Meyers在他的CSS Reset是这样重置的: /* remember to define focus styles! */ :focus {     outline: 0; } 这些方法大家都可以说常见了.可是有一点可能大家还是不太清楚--outline在表单的button中使用时,在firefox浏览器下

Webjx收集整理最新20个Photoshop网页设计教程

在你打开一个网站的时候,首先注意到的当然是它的设计,第一印象至关重要,网站的设计将帮助访问者决定是否继续浏览该网站.今天,本文收集了最新20个 Photoshop 网页设计教程,帮助你设计出更精美的网页. How to create a colorful business web layout Create a consulting web layout Create a movie video streaming website Create a gritty portfolio layout

网页设计教程(2):论摹仿和抄袭

在上一篇中介绍了网页设计的步骤和方法,具体可以回顾看看上篇文章:网页设计教程(1):步骤和整体布局 在05年入行数月之后,逢劳动节放假,经历了连续一个多月每天到12点的加班之后.我在自己的日记本写了一篇关于摹仿和抄袭的文章.写了足足5大张.现在看起来,道理是讲的很明白了,不过是太偏激了一点,现在从新写一下.新手看看下边一段就可以了. 摹仿的要素: 我说的是"摹仿",而不是",模仿"...如果你一直是"模仿",那么你还是别看了...... 要素无非

网页设计教程(3):设计步骤及思考

上一篇教程:网页设计教程(2):论摹仿和抄袭    与之前的步骤不同,这是实际操作的步骤.本文包括了大局的步骤和栏目,图片,小到一个图标的选取等等等等,可能会漏掉很多的东西.欢迎补充.我只是引导你去思考,本章绝对不是网页的标准制作步骤,我相信也没有什么标准的制作步骤.      本章的设计步骤是建立在网页设计进阶之一 (步骤和大局观)之上的.可能会涉及一些平面相关的知识.和网页与平面的比较.网页与平面的区别我会在以后在写.      本章所讲的基于PHOTOSHOP软件制作.      本章印证

网页设计教程(4):关于素材和言志

上一篇网页制作教程:网页设计教程(3):设计步骤及思考 关于收集素材:三遍记忆,让你记住海量素材的准确位置和用途,提高其可用性       这仅仅是一个示意图.在以往的日子里,我做到了只要脑袋里冒出一个想法,立刻就能知道我需要用的素材在什么位置...那时候我很穷,穷到连买书的钱都没有,更别说是买动辄几百快的设计资源光盘了.      设计师最大的特色,我认为是他特有的那个文件夹,或叫"杂七杂八",或叫"乱七八糟",或叫"什么都有"或叫"

网页设计教程(5):网页视觉设计

上一篇文章:网页设计教程(4):关于素材和言志 网页设计进阶之五--构图的均衡与视觉引导.曲线/弧/光和影的运用 构图的均衡1.在非等形等量的情况下的构图以"均衡"来概括和衡量.与等形等量的平衡各站构图的50%.2.均衡的要素:平衡.变化和统一.明暗.色彩.空间层次等等等等. 构图的关系形状.位置.面积.方向.层次 构图的规律平衡/规律 视觉引导的基本特征:(遵循正常的阅读顺序)一.色彩引导 二.形状引导 三.姿势引导 四.明暗引导 五.瞬间捕捉 六.比例 --------------