网站设计 Web Design
网站建设整体风格和色彩搭配要点
网站建设本身的价值正在被人们不断的发现和认可“如何成功建设一个的网站？”
温州眼镜企业网站设计web2.0模式
web2.0时代的温州眼镜企业网站建设（网站设计），必然要求由封闭走向开放，由自我标榜走向互动交流，由信息平台转变为交流平台。
企业网站设计失败的原因
企业的网站设计，没有取得网络营销的效果，有机构通过调查总结出其关键原因是下面几个方面：
网站设计创意能力培养
多看别的网站许多人会很自然地去寻找网上有关于网站配色的理论性文章，这些文章理论性虽然很强，但却讲述得太术语化，一大堆的对比色，相关色，暖系，冷系，配色原则，同时又缺乏例子——讲述色彩的文章，怎能只有白纸黑字。不过经典论坛上艺术版的小毅版主的文章不错，里面有网站的剖析，图文并茂，说颜色，并能告诉你怎样去思考，推荐大家去看看！
另外网上流传有许多配色表，不知道大家看了后有啥感受，应用得怎样，对于我来说确实没多大用处。我认为网上的芸芸大师的作品，值得一看的优秀网站，就是一张张“活生生”的配色表，多看优秀作品是会有很大长进的！如果你在论坛上发问，怎么提高自己的网页制作水平？大部分的人都说：多看网站啊！我也会告诉你去看，并告诉你，我是怎样看的。每次当我见到令我很感动的网站时，我会把他的色系拾取下来，并将布局简单记录下，这样做的好处是一方面既避免了抄袭，一方面也能积累一些份资料，将来肯定有用的时候。通过这样的积累，自己的鉴赏水平和色感都能有提高！
除了看配色用色，还要看人家的网站布局，布局包括网站的内容设置，导航栏设置，位图的应用，不同类型的网站，是有不同的布局的，娱乐网站的布局与商业网站的布局肯定有分别。还要看创意，看用户体验，简单地去操作一下，学习人家的理念，总体的执行效果，以及这个网站是否达到了它所要表达的意思等等
很多人有一个误区，就是“要看，就要看牛B的网站，这样才会有进步”。这当然不错，但是我建议大家也去看一些成长中的网页作品，虽然可能他做的不太好，但是从中也能学到东西，这跟在学校读书时老师叫你去看一些做错的题目一样的道理！还有就是多看与自己真实水平差不多的作品，从中你也能学到东西！
另外一培养色感的一些经验分享点是，要多看国内的站，这很重要，许多人看老外的站，觉得很NB，其实如果形式上不变的话，换成中文的，是很难看的。看国内的站，主要是因为用的是汉字，中文，在排版上，布局上都遵循了自己特有的形态，如果你喜欢做E文的站，那多看国外的也无妨！所以，看老外的站，和看国内的站有小许差别，要懂得吸收不同的部分！文字应用，布局，国内的很多网站是很优秀的。
多看优秀的标志设计
我的另一个学习配色的一个很重要的途径就是：看优秀的标志设计。
也许你会问，看标志对做站有什么用处？我说，有用，至少对于我来说。判断一个优秀的标志作品主要有几方面：颜色的运用，整体造型，执行效果等。后两者不属于我这次要讨论的范围。我们不妨观察一下标志作品在颜色上的运用，并以此为借鉴，去学习学习！
我看优秀标志作品的用意，就是从中感受颜色的组合，并为我的网站服务，从而锻炼自己的色感。优秀的标志在感观上是很取悦人的，其中最重要的方面是在色彩运用上，既然有过人之处，我们又何妨去学习学习呢？而且我觉得有几点，看标志作品的独有的好处：
1.它是一个最简单的配色表。颜色大多数不过三种，这和符合设计网站的口味。
2.永远不会有人说你抄袭，往往地，我们看人家优秀的站，既把颜色给收为自有，而且把人家的布局有意无意地用上，我们可以说是借鉴，但太多的借鉴就是抄袭，看标志作品，没有太多的信息给你去做站，它只可以给你以颜色上的参考。
3.如果你有意去打造自己的个人网站，那么为自己设计一个标志吧，标志用色和网站用色结为一体，给人以整体感观上整洁专业，这是很有理论根据的，一些文章都有提到这点，也算是一个网站设计的基本原则吧。多看优秀作品，不但给你灵感，也给你一定的设计原则，这和网站设计在一定程度上是相同的！
关于标志色感，我也会单独拿出来训练，虽然很幼稚，我觉得是很有必要的！其实看标志用色，只是我感受色彩的其中一个例子，很多方法重在你自己的发现，生活中有很多很多美好的色彩等待你去发掘，你可以在电影海报户外广告、摄影作品、建筑设计、电视广告上看到。我们是否错过了太多太多？只是没有用心去感受生活，工作忙，学习忙，都不是借口，灵感真的源自生活！
网站设计与网站建设的管理与维护
一、为什么要进行网站设计的维护与更新？
网站设计维护是网站建设中极其重要的部分，也是最容易被忽略的部分。不进行维护的网站，很快就会因内容陈旧，信息过时而无人问津，或因技术原因而无法运行。很多人花费最大的精力和最多的预算来建立一个网站，以为网站建成以后就可以”守网待兔”了。有的网站上标明最近一次更新是在两年前，或其版权声明中的时间是几年前，几乎所有访问者都没有兴趣访问过时的网页。好象种庄稼一样，把种子撒到地里只是刚刚开始，还需要不断施肥，浇水，杀虫，除杂草才会有收获。网站维护是网站建设中极其重要的部分，也是最容易被忽略的部分。不进行维护的网站，很快就会因内容陈旧，信息过时而无人问津，或因技术原因而无法运行。这是目前网站建设中最大的弊病。所谓网站维护，即是要经常对网站内容进行更新维护。 网站的维护包含多方面的内容：网站页面信息维护、技术维护。网站页面维护包括：创意改版、信息增加、删除、更新；图形处理；页面特效处理；网络音视频文件；网站结构调整。技术维护包括域名解析；虚拟主机维护；数据库系统维护；CGI、JAVA、ASP程序维护；网站信息发布系统维护；网站访问统计报告；网站全面管理；前沿科技提供优秀的网站维护服务，并能够为用户提供相关技术支持，为用户网站提供专业的网站统计分析报告，以便于对网站进行管理。另外，网站服务与回馈工作要跟上（ 及时回复访问者的EMAIL信件，不断增加网上在线服务功能等。）
二、做好网站设计维护需要哪些工作
网站建好并不是一劳永逸的，建好网站后还需要精心的运营才会越显成效。大致的说，网站建好之后，要做几个方面的工作：
1、网站设计内容的维护和更新
网站的信息内容应该适时的更新，如果现在用户访问网站看到的是去年的新闻或者说用户在秋天看到新春快乐的网站祝贺语，那么他们对网站的印象肯定大打折扣。因此注意适时更新内容是相当重要的。在网站栏目设置上，也最好将一些可以定期更新的栏目如新闻等放在首页上，使首页的更新频率更高些。
2、网站设计服务与回馈工作要跟上
应设专人或专门的岗位从事网站的服务和回馈处理。用户向网站提交的各种回馈表单、发到邮箱中的电子邮件、在留言板上的留言等等，如果没有及时处理和跟进，不但丧失了机会，还造成很坏的影响，以用客户不会再相信你的网站。
3、不断完善网站系统，提供更好的服务
初始建网站一般投入较小，功能也不是很强。随着业务的发展，网站的功能也应该不断完善以满足用客的需要。
三、网站设计如何更新维护？
1、静态页面的添加修改
静态页面的更新需要使用专业的网页设计工具，然后将修改后的网页通过FTP上传到相应的位置，在此同时还要保证不能破坏其他的页面程序和格局。
2、动态功能支持在线更新
如果网站信息量很大，经常需要更新，有更多的资讯需要告诉访问者，这时候我们通常建议建立动态数据库系统。这里的动态并不是指动画，而是指网站的内容来自相应的数据库。如果我们更改了数据库，那么前台页面的内容也会随之而更改。
这时需要企业做的只是登陆到网站的后台管理页面，象使用留言板或者邮箱一样发布企业的最新产品、最新资讯了。当然动态数据库系统也支持以上信息的修改和删除。
网页设计多媒体使用
一、网页设计添加 Flash 动画
在网页中可以插入 SWF 格式的 Flash 文件， SWF 文件是 Flash (.fla) 文件的压缩版本，以便于在 Web 上查看。此文件可以在浏览器中播放并且可以在 Dreamweaver 中进行预览，但不能在 Flash 中编辑此文件。
在“文档”窗口的“设计”视图中，将插入点放置在要插入影片的地方，然后在“插入”栏的“常用”类别中，选择“媒体”，然后单击“插入 Flash ”图标。或选择“插入” > “媒体” > “ Flash ”。
二、网页设计创建和插入 Flash 按钮
在“设计”视图或“代码”视图中工作时，可以在文档中创建和插入 Flash 按钮。
在“文档”窗口中，将插入点放置在您要插入 Flash 按钮的位置。 打开“插入 Flash 对象”对话框，在“插入”栏的“常用”类别中，选择“媒体”，然后单击“ Flash 按钮”图标。
若要修改 Flash 按钮对象，在“文档”窗口中，单击 Flash 按钮对象以选择它。可以使用属性检查器修改按钮的 HTML 属性，例如宽度、高度和背景颜色。 若要对内容进行更改，双击 Flash 按钮对象。 在属性检查器中单击“编辑”。
三、网页设计创建和插入 Flash 文本
创建和插入 Flash 文本与 Flash 按钮类似。
四、网页设计插入 Shockwave 影片
可以使用 […]
网页设计模板与库
一、网页设计使用库项目:
库是一种用来存储想要在整个网站上经常重复使用或更新的页面元素（如图像、文本和其他对象）的方法。这些元素称为库项目。
使用库的意义：很多网页设计师讨厌频繁的改动网站，使用Dreamweaver的库，可以很好的解决这个问题！如果使用了库，就可以通过改动库更新所有采用库的网页，不用一个一个的修改网页元素或者重新制作网页。使用库比使用模板，有更大的灵活性。
通过修改库元素，可以实现整个网站各页面上与库元素相关内容的一次性更新。库元素存放在库文件中，库文件存在站点根目录的Library文件夹内。
1、创建库项目：
1）选择文档的一部分，例如选择一个图片（也可选择多项内容）。
2）打开资源面板，点击“库”按钮，打开库类别。
3）点击“新建库项目”按钮。
4）给库项目命名。一个库就创建好了。
2、插入库项目
1）将插入点放在“文档”窗口中。
2）选择一个库项目，单击“插入”按钮。
3）插入库后的页面如下图。
3、修改库
1） 选中页面中的库项目。
2）在属性面板中点击“打开”按钮。
3）修改库项目，修改完成之后保存。
4）在“更新库项目”对话框中点击“更新”按钮。
5）选择更新的范围，更新完成之后关闭。
4、与库分离
1） 选中页面中的库项目。
2） 在属性面板中点击“从源文件中分离”按钮，则应用的库项目变为可以更改的，并断开与库项目的链接。
5、更新整个站点或所有使用特定库项目的文档：
选择“修改”→“库”→“更新页面”。
6、更改当前文档以使用所有库项目的当前版本：
选择“修改”→“库”→“更新当前页”。
二、网页设计模板的创建和设置
模板可以作为创建其它文档的样板的文档。创建模板时，可以说明哪些网页元素不可编辑，哪些元素可以编辑。其扩展名为.dwt。
模板的作用：有利于保持网页风格的一致；提高工作效率。
1、创建模板
1）创建一个全新的模板：在模板面板中，使用快捷菜单按钮或单击面板上的新建按钮
2）创建基于文档的模板：文件——另存为模板。
2、设置模板页面属性
1）用模板创建的文档继承模板的页面属性，页标题除外。
2）设置：修改——页面属性
3、定义模板的可编辑区
在模板文档中选定对象，插入——模板对象——可编辑区域——输入可编辑区域名。
4、模板的应用和更新
1）应用模板创建文档：
文件——新建——从模板新建。
从模板面板中拖一个模板到文档。
从模板面板中选定一个模板，单击应用。
修改——模板——套用模板到页。
2）把页面从模板中分离出来
在应用了模板的文档中，只有可编辑区的内容才可以修改，如果要对应用了模板的页面的锁定区进行修改，必须先把页面从模板中分离出来。修改——模板——从模板中分离。
3）修改模板
在模板面板中选定模板、单击编辑按钮或双击模板名称打开模板，编辑完成后保存。保存后可选择是否更新已应用模板的文档。
4）更新站点中使用模板的所有文件
修改——模板——更新页面（或只更新当前页）
网页设计动态特效—时间轴与JavaScript
一、什么是网页设计时间轴？
时间轴就是按照时间顺序来控制动作执行的过程。
它的工作原理就是定义一系列的小时间段——帧，这些帧随时间变化，在每一个帧均可以改变网页元素的各种属性，以此实现动画效果。。
二、网页设计“时间轴”面板：用于创建时间轴
1、打开“时间轴”：窗口——其他——时间轴（Alt+F9）
2、面板组成：
1）时间轴下拉列表：给出当前网页中的多个时间轴
2）返回首帧箭头：返回时间轴的第一帧
3）回放箭头：一次向左移回一帧
4）播放箭头：从当前帧开始一次播放一帧
5）当前帧号：在文本框中显示时间轴当前所在的帧
6）FPS（帧速率）：显示每秒播放的帧数
7）Autoplay（自动播放）：自动播放时间轴
8）Loop（循环）：重复播放时间轴
9）行为通道：显示执行一个特殊帧的行为
10）帧数：行为通道和动画通道的标尺
11）动画通道：显示动画
12）播放头：由一个红色垂直标志表示，显示时间轴中激活的帧
13）动画栏：每增加一个对象，时间轴中就出现一个蓝方框，称为动画栏。
14）关键帧：在动画栏中由一个圆点表示，关键帧是表示属性的动画帧
三、网页设计创建时间轴
1、用时间轴完成动画的直线运动：
1）插入层——层内插入图像——确定动画的起始位置
2）修改——时间轴——增加对象到时间轴——单击时间轴的最后一帧——确定动画结束位置。
2、用时间轴完成动画的曲线运动：
单击时间轴上要添加关键帧的位置，修改——时间轴——增加关键帧——改变图层位置
3、动画播放：选定Autoplay（自动播放）选项
范例：飞机空战
四、网页设计在时间轴上添加行为
1．用行为触发时间轴动画：如果没有选择Autoplay，需要使用行为触发动画。
选中对象——打开行为面板——单击加号按钮——时间轴——播放（或停止）时间轴
2．行为添加到时间轴中：
选定行为通道上的某一位置——单击行为面板的加号按钮——选定某一行为
五、网页设计在时间轴中改变对象属性：
选择关键帧——改变图层可见性、尺寸、Z-index值、源文件。
范例：动态下拉菜单
六、网页设计编辑时间轴
使动画播放的时间变长：拖动结尾帧标记
使层到达关键帧位置的时间提前或延后：拖动该关键帧
改变动画开始的时间：拖动开始帧
改变整个动画路径的位置：选择整个动画条，然后在页面上拖动
在时间轴上添加或删除帧：快捷菜单
使页面在浏览器中打开时自动播放时间链：选定Autoplay（自动播放）选项
使时间轴循环播放：选定Loop（循环）选项
七、网页设计JavaScript实例制作:
JavaScript程序可以使你的页面更加生动，活泼，它以小的程序量完成大的功能。
如果你会一些编程语言的话，那么JavaScript对你来说，应该很容易，不过在这里我们为你准备了一些现成的例子；如果你对编程不太在行的话，也不用着急，可以在网上下载一些基础的教程，先简单学一下，在每个例子后，也都有尽可能详尽的讲解，可以一边欣赏，一边学习；如果你根本不想学编程，又想在自己的页面中展现出那些生动的效果，那也很简单，你只要按照例子中所说的，把相应的代码放到相应的位置就一切OK了！
网页设计动态特效—行为
一、网页设计认识行为和事件：
1、行为：指在网页中进行的一系列动作，通过这些动作可实现用户同网页的交互，也可以通过动作使某个任务被执行。
行为由事件和动作两个基本元素组成。通常，动作是一段JavaScript代码，Dreamweaver内置了多种行为.
2、事件：事件则由浏览器所定义，它可附加到各种页面元素上，也可被附加HTML标记中。
同一个事件能够引发几个不同的动作（注意执行顺序）。
选择的对象不同，可执行的事件也不同。
常见事件： Onchange OnClick OnDblClick Onload OnMouseDown OnMouseUp
二、网页设计基本行为操作：
1 、认识行为面板：
事件列表 行为列表
浏览器及版本不同，事件列表的内容也有所不同。
2、添加与编辑行为：选定网页元素、“窗口”菜单－行为面板（Shift+F3）
1）添加行为效果：为对象、文本、时间线附加行为。
选择对象-打开行为面板-单击加号按钮-选择合适的行为
2）编辑行为效果：编辑动作、引发动作的事件、更改参数。
3）为同一个事件添加多个动作：
三、网页设计使用DreamWeaver的内置行为：
1、调用JavaScript： 某些事件发生时，允许用户调用相应的JavaScript代码。
2、改变属性： 动态改变对象的属性值。 如层的属性值，图像大小或悬停按钮效果。
范例演示：改变属性
3、检测浏览器： 可获取用户浏览网页所使用的浏览器类型 而后根据不同的浏览器显示不同的网页。
一般常将这种行为附加到文档上—<body>标记上，打开文档自动跳转。
另一种使用方法是将此行为附加到一个空链接上。
4、检测插件： 检测浏览者是否安装了浏览网页所需的插件。从而决定链接指向的网页。
如：Flash Shockwave等。
5、控制Shockwave或 Flash： 可在文档中添加按钮类的对象，实现对动画的控制。
如：设置动画的播放、停止、返回或转到相应帧。
6、拖动图层： 实现页面上的层的移动，如拼图等动态效果。
拖动图层的动作必须在拖动图层之前被调用—OnLoad（body对象）
范例演示：拖动层——小猫拼图
7、跳转地址： 可在当前窗口或指定框架中打开一个新的网页。
单击一次可改变两个或两个以上框架内容，也可附着于时间线上便于在一段时间后执行。
要点：注意框架的命名
8、打开浏览器窗口： 在一个新的浏览器窗口中载入一个链接目标文件。
9、弹出消息： 弹出一个消息框，框内的内容可为文本或夹杂JavaScript脚本。
范例演示：弹出浏览器窗口与弹出消息
10、播放声音： 网页中播放声音文件。
11、预加载图像：
12、使用跳转菜单：
13、使用关联跳转菜单： 编辑开始按钮（GO）
14、设置导航条图像：
范例演示：导航条与跳转菜单
15、设置文本： 框架文本、层文本、状态栏文本、文本域文本。不改变原网页中的内容
16、交换图像、恢复交换图像——翻转图像
范例演示：交换图像与设置文本
17、时间线动作： 转到时间线帧、播放、停止时间线。
18、验证表单： 提交表单时，本动作可用于检查数据的有效性。
范例演示：检查表单
19、显示——隐藏层： 可在页面上显示层、隐藏层或恢复默认的层可见性状态。
范例演示：见层范例
四、网页设计下载并安装第三方行为：
在Dreamweaver站点或其他的第三方开发站点上找到更多的行为动作。
1、下载行为文件－解压－移到文件夹（Dreamweaver\Configuration\Behaviors\Actions）
重启Dreamweaver即可。
范例演示：第三方行为——滑动菜单与层居中
2、直接下载插件文件安装。
网页设计图层
一、网页设计创建层
1、使用Insert菜单创建层：Insert菜单-Layer选项
2、通过对象面板创建层：Window菜单-Object-Draw Layer按钮
3、使用CSS样式创建层：Window菜单–CSS Styles选项
4、嵌套层：就是在一个层内创建新的层
1）嵌套层的操作：
-将插入点光标放入父层内，然后使用Insert菜单的Layers选项；
-将对象面板的Layer按钮拖到父层内；
-按住Ctrl键，并在层面板内，将子层的名称拖到父层的名称上。
2）查看所有的层：“窗口”菜单-其他-层（快捷键F2）
二、网页设计修改层
1、选择层
1）激活层：用鼠标单击层所属的区域
2）选择某一个层：
用鼠标单击文档的层标识，使层的边框上出现黑色的小方块；
-用鼠标单击层的选择手柄；
-用鼠标单击层的边框；
-用鼠标单击层面板内层的名称。
3）选择多个层：
按住Shift键的同时，依次单击多个层；
-按住Shift键的同时，依次在层面板的名称列表内选择；
-按住Shift键的同时，依次用鼠标单击层所在的区域。
4）取消选择：在文档窗口内单击鼠标
5）删除层：选定层后，按Delete键
2、改变层的大小：鼠标拖曳或属性面板
3、改变层的位置：鼠标拖曳
4、对齐层：选定多个层、“修改”菜单-对齐
要点：对齐层时，系统自动将最后选定的层作为对齐标准
三、网页设计设置图层参数和图层属性
1、设置图层参数
1）使用图层参数可以为新创建的层定义默认设置
2）操作：“编辑”菜单-参数选择
2、设置图层属性：属性面板
四、网页设计层与表格
1、将层转换为表格：“修改”菜单-转换-层到表格
2、将表格转换为层：“修改”菜单-转换-表格到层
Categories
Brand Design
Recent Comments
