网站设计分为几个步骤
网站设计分为几个步骤
怎样才能设计一个好的网站？一个合格的网页设计师可以将自己设计的网站在修改或者
升级过程变成一件很简单的事情，经过一个合格的网站设计师之手的网站一定有高度的灵
活性和可维护性。网站设计的流程是什么样的呢？
网站设计流程一：确定风格
网站的风格通过网站的色彩、技术、文字、布局、交互方式可以概括出一个站点的个性:是粗犷豪放的，还是清新秀丽的;是温文儒雅的，还是执着热情的;是活泼易变的，还是墨
守成规的。在明确自己想给人以怎样的印象后，要找出网站中最有特色的东西，就是最能
体现网站风格的东西。并以它作为网站的特色加以重点强化、宣传。风格的形成不是一次
定位的，你可以在实践中不断强化、调整、改进。
网站设计流程二：搜集素材
查找并收集有关的文字、图片、声音、影像等素材，并对所收集的素材进行整理、处理。
网站设计流程三：网站布局
首页页面：首页主题还体现在logo及网站标题上。准确概括的首页主题可以很好帮助
用户选择自己有确切需求的网站。
首页导航：网站导航可以看做是对网站内容的分类 把网站的内容进行细分方便用户跟
据个人需求选择浏览相应栏目页面。
首页内容：页面的内容布局需先对网站的用户群体进行需求分析把用户关注最多的内容
放置在首页的最重要位置。一般按照用户的浏览方式页面内容布局按照内容重要程度由左
上到右下进行布置。
网站设计流程四：LOGO设计
怎样设计logo是许多网站设计师比较头疼的事情，在设计之前要进行基本的调研分析，也就是对该企业做全面的调查，然后就是要挖掘所需要的素材，最后就是进行设计开发了，这也是最重要的一步，只有经过反复的推敲修改，才能设计出令人满意的标志。
网站设计流程五：导航设计
在设计导航之前，要充分的分析用户需要什么？从导航的有效性、实现度和利用率来设
计导航。
网站设计流程六：banner设计
在设计banner之前，要和客户沟通一下他们想在banner上突出什么重点，然后有针对的展现banner上的内容。当我们确定重点之后，banner的色彩搭配要明亮干净要与整个
页面相协调。
网站设计流程七：友情链接设计
设计网站的友情链接要考虑一下网站优化的问题，链接一定不能是滚动的，因为滚动的
链接没有人交换，最好是在底部一一列出来。
网页设计制作过程中的注意事项
一、页面的规划：
一篇文章要有主题，主题越明确，内容就会有深度，还要有中心思想，不能跑题。一个页面在规划的时候也一样，主题要集中，各个版块相关性要强，还得体现丰富，这个页面才会显得专业并且丰富，否则填写内容就会“神散”。主要体现在：
1．主导航醒目清晰，突出重点
导航清晰了，无论从用户体验还是搜索引擎收录方面都有很大意义。用户浏览页面层层深入不会迷失其中，也能及时返回想回的位置；蜘蛛爬虫也是按航线走的，不是东边抓一点，西面也来一块。 2．主栏目要显眼，一目了然
根据人的视觉习惯，先上后下，先左后右的原则，网页在设计的时候就要遵守原则。上边占一个页面的多少，中间留多少，下边又要剩多少；左边放什么留多大地方，中间是多少，右边又是多少，都是有科学依据的，不是随便放置的。这样规划出来的页面用户肯定喜欢。 3．主要栏目链接多，引起重视
最终页面联于子栏目，子栏目要与主栏目相联，主栏目是根，就像一棵树，枝繁叶茂说明根深蒂固，一定是棵好树，网站也同样，跟主栏目链接的越多，主栏目出现的机会也就越多。蜘蛛爬虫也会重视这个页面，用户也会更多的点击这个页面。
总之，页面在规划的时候要有的放失，该醒目的地方就突出下，重点的地方就重复几次。
二、制作注意事项：
1．注意页面体积
页面不能太大了，太大了下载速度慢，一是会影响用户的体验，二是蜘蛛爬虫也会觉得累，包括图像在内的网页字节数，最好不要超过50K。 2．忘记框架结构
框架结构（帧结构）从营销的角度上讲，主要问题在于不能为每个网页都设置一个标题（TITLE），更为糟糕的是，有些搜索引擎对框架结构的页面不能正确处理，会影响到搜索结果的排列名次。所以一般情况下，尽可能不采用框架结构。现在一般网站都是采用表格定位的网页设计。 3．丢掉特效链接
我们经常看到有些网站为导航链接加上了特效，如点击某个项目会展开下层链接等。这些效果一般通过Java Script实现，视觉上非常新颖，但在“蜘蛛”程序的眼里则没
那么诱人，相反它无法解读这种链接。为了让搜索引擎顺利检索到你的网页，建议还
是牺牲掉这些花哨的东西。 4．放弃FLASH动画
到目前为止搜索引擎对FLASH还不感冒，好的FLASH可以满足视觉感观，除此外就没什么优点了，文件大，打开速度慢是用户离开网站的主要原因。 5．不用图象区块
Image Maps，很多搜索引擎是不支持它的。当“蜘蛛”程序遇到这种结构时，往往会感到茫然不知所措。因此尽量不要设置Image Map链接。
如果说上面都是诗内功夫，下面就从诗外功夫说起
一个页面要想在搜索引擎中获得好的排名，更快的营销页面的话，除在设计、制作的
时候就要重视、创造完高质量的内容后，还有要注重高质量的链接即导入链接，内容
中的内部链接。导入链接
搜索引擎在决定一个网站的排名时，不仅要对网页内容和结构进行分析，还围绕网站
的链接展开分析。
网站内部链接是搜索引擎排名主要因素之一!网站内部文件之间的链接情况如何，会影响网站的整体质量。网站内部链接处理的恰到好处，会提示网站整体的PR值，关键
词排名。网站内部链接处理过度，会引擎搜索引擎的处罚！
一、内部链接布局，应该考虑一个重要的因素，相关性。调用任何信息都要以相关性
为主，相关性越高，页面的质量就越高。内部链接的布局，首先要考虑的就是相关性，在各个页面调用相关文章。
二、内部链接时效性，在页面上调用每天最新的网页信息。加快新网页的收录速度以
及更新旧网页的信息。
网页的基本元素包括
1.网站Logo
2.网站banner
3.导航栏
4.文本
5.图象
6.多媒体
1、logo的尺寸大小
国际上规定的标准的广告尺寸有下面八种，并且每一种广告规格的使用也都有一定的范
围。
一、120×120，这种广告规格适用于产品或新闻照片展示。
二、120×60，这种广告规格主要用于做LOGO使用。
三、120×90，主要应用于产品演示或大型LOGO。
四、125×125，这种规格适于表现照片效果的图像广告。
五、234×60，这种规格适用于框架或左右形式主页的广告链接。
六、392×72，主要用于有较多图片展示的广告条，用于页眉或页脚。
七、468×60，应用最为广泛的广告条尺寸，用于页眉或页脚。
八、88×31，主要用于网页链接，或网站小型LOGO。
其中关于网站的LOGO，目前有三种规格：
1.88*31 这是互联网上最普遍的LOGO规格。
2.120*60 这种规格用于一般大小的LOGO。
3.120*90 这种规格用于大型LOGO。 logo常用尺寸：88*31；120*60；160*60；180*60；自定义尺寸
banner常用尺寸：468*60；自定义尺寸；通栏banner
三折页广告：
标准尺寸: (A4)210mm x 285mm
普通宣传册：
标准尺寸: (A4)210mm x 285mm
文件封套：
标准尺寸:220mm x 305mm
招贴画：
标准尺寸:540mm x 380mm
挂旗：
标准尺寸:8开 376mm x 265mm 4开 540mm x 380mm
手提袋：
标准尺寸:400mm x 285mm x 80mm
信纸、便条：
标准尺寸:185mm x 260mm 210mm x 285mm
正度纸张：787×1092mm
开数(正度) 尺寸单位（mm）
全开 781×1086 2开 530×760 3开 362×781 4开 390×543 6开 362×390 8
开 271×390 16开 195×271
注：成品尺寸=纸张尺寸－修边尺寸
大度纸张：850＊1168mm
开数(正度) 尺寸单位（mm）
全开 844×1162 2开 581×844 3开 387×844 4开 422×581 6开 387×422 8
开 290×422
注：成品尺寸=纸张尺寸－修边尺寸
常见开本尺寸(单位：mm)
开本尺寸：787 x 1092
对开：736 x 520 4开：520 x 368
8开：368 x 260 16开：260 x 184 32开：184 x 130 开本尺寸(大度)：850 x 1168
对开：570 x 840 4开：420 x 570 8开：285 x 420 16开：210 x 285
32开：203 x 140
正度纸张：787×1092mm
开数(正度) 尺寸单位（mm）
全开 781×1086 2开 530×760 3开 362×781 4开 390×543 6开 362×390 8
开 271×390 16开 195×271
注：成品尺寸=纸张尺寸－修边尺寸
大度纸张：850＊1168mm
开数(正度) 尺寸单位（mm）
全开 844×1162 2开 581×844 3开 387×844 4开 422×581 6开 387×422 8
开 290×422
注：成品尺寸=纸张尺寸－修边尺寸
16开大度：210×285 正度：185×260 8开大度：285×420 正度：260×370 4
开大度：420×570 正度：370×540 2开大度：570×840 正度：540×740 全开大：889×1194 小：787×1092
名片：
横版:90*55mm<方角> 85*54mm<圆角> 竖版:50*90mm<方角> 54*85mm<圆角> 方版:90*90mm 90*95mm IC卡：
85x54MM
banner常用尺寸：468*60；自定义尺寸；通栏bannerLOGO的国际标准规范
为了便于INTERNET上信息的传播，一个统一的国际标准是需要的。实际上已经有了这样的一整套标准。其中关于网站的LOGO，目前有国际标准规范
全尺寸banner为468*60px，半尺寸banner为234*60px，小banner为88*31px
另外120*90，120*60也是小图标的标准尺寸
每个非首页静态页面含图片字节不超过60K，全尺寸banner不超过14K 由于网络页面和显示器目前的设定网站LOGO大小规定为88*31
而企业或者组织的LOGO通常不限定大小至于Banner也是有相关尺寸规定的;
另:网站LOGO设计规范
LOGO的应用一直是CIS导入的基础和最直接的表现形式，其重要性是不言而喻的，网
络标识的设计尤其如此。一、标识的职能：
作为独特的传媒符号，标识（LOGO）一直成为传播特殊信息的视觉文化语言。具信，
最早的符合CIS精神的标识实例，是2433年前陪葬我国楚地的曾侯乙的一只戟上的"曾"
字型图标。无论从古时繁复的欧式徽标、中式龙文，到现代洗练的抽象纹样、简单字标
等都是在实现着标识被标识体的目的，即：
通过对标识的识别、区别、引发联想、增强记忆，促进被标识体与其对象的沟通与交流，从而树立并保持对被标识体的认知、认同，达到高效提高认知度、美誉度的效果。作为
时代的前卫，网络LOGO的设计，更应遵循CIS的整体规律并有所突破。二、网络LOGO设计的基本应用原理：
在网络LOGO设计中极为强调统一的原则。统一并不是反复某一种设计原理，应该是将
其他的任何设计原理如：主导性、从属性、相互关系、均衡、比例、反复、反衬、律动、对称、对比、借用、调和、变异等设计人员所熟知的各种原理，正确地应用于设计的完
整表现。统一也可解释为，共通以上所述各原理，而更高、更概括、更综合的原理。
构成LOGO要素的各部分，一般都具有一种共通性及差异性，这个差异性又称为独特性，或叫做变化，而统一是将多样性提炼为一个主要表现体，称为多样统一的原理。统一在
各部分之中的要素中，有一个大小、材质、位置等具有支配全体的作用的要素，被称为
支配。精确把握对象的多样统一并突出支配性要素，是设计网络LOGO
必备技术因素。
网络LOGO所强调的辨别性及独特性，导致相关图案字体的设计也要和被标识体的性质
有适当的关联，并具备类似风格的造型。
记得最近EASTECHO的网友论坛重新开张之时，就有小魔女对论坛的LOGO表
示了异议，一个简单印刷字体的LOGO与浪子固有的独特风格、精益求精的品质有较大
背离，并与整个网站LOGO缺乏联系，从而产生认知的歧义。不过作为充斥英文
LOGO 的浪子网站，做了中文LOGO尝试，算个突破吧。
网络LOGO设计更应注重是一种对事物张力的把握，在浓缩了文化、背景、对象、理念
及各种设计原理的基调上，实现对象最冲动的视觉体现。也可以理解为一种最受制约的
冲动，在任何方面的张力不足的情况下，精心设计的LOGO常会因为不理解、不认同、
不现实、不前卫、不艺术、不朴实等相互矛盾的理由而被用户拒绝或为受众排斥、遗忘。所以恰到好处的理解用户及LOGO的应用对象，是少做无用功的不二法门。不考虑国情
和用户的认识水平，对自身设计能力估计不足都是要不得的。在国内给哪个卖计算机的
老板设计个$300万的朗讯红圈LOGO，很容易被看作是骗钱的。三、网络LOGO的表
现形式：
作为具有传媒特性的LOGO，为了在最有效的空间内实现所有的视觉识别功能，一般是
通过特示图案及特示文字的组合，达到对被标识体的出示、说明、沟通、交流从而引导
受众的兴趣、达到增强美誉、记忆等目的。
表现形式的组合方式一般分为特示图案，特示字体，合成字体。 1、特示图案：
属于表象符号，独特、醒目、图案本身易被区分、记忆，通过隐寓、联想、概括、抽象
等绘画表现方法表现被标识体，对其理念的表达概括而形象，但与被标识体关联 LOGO
的国际标准规范为了便于INTERNET上信息的传播，一个统一的国际标准是需要的。实际上已经有了这样的一整套标准。其中关于网站的LOGO，目前有三种规格： 1. 88*31 这
是互联网上最普遍的LOGO规格。 2. 120*60 这种规格用于一般大小的
LOGO。 3. 120*90 这种规格用于大型LOGO。
象素不是固定的啊
一般性LOGO都是矢量图片制成，所以并没有象素的说法。网上出现的LOGO都是72
精度如果用于印刷就是300精度
因为是矢量制成，所以想要多大的精度就有多大的精度
2、Babber的尺寸大小
横幅广告（Banner）
文件大小：gif:14K/swf:16K
广告尺寸：468*60像素
广告位置：页面顶部
按钮广告（Button）
文件大小：gif:6K/swf:8K
广告尺寸：170*60/120*60像素
广告位置：第一屏第二屏
备注：触发式LOGO，弹出图片尺寸为160*160 文件大小gif:9K/swf:12K
弹出窗口广告（Pop up）
文件大小：gif:18K/swf:20K
广告尺寸：360*300像素
广告位置：第一屏
通栏广告（Full collumn）
文件大小：gif:20K/swf:25K
广告尺寸：770*100像素
广告位置：第一屏第二屏
流媒体（Flash layer）
文件大小：swf:25K
广告尺寸：200*150像素
广告位置：第一屏
形式：浏览打开页面，该广告放映8秒后消失
画中画（PIP）
文件大小：gif:20K/swf:25K
广告尺寸：360*300像素
广告位置：新闻最终页面
浮动标识（Float box）
文件大小：gif/swf/flash<8k
广告尺寸：80*80像素
广告位置：第一屏右侧
全屏收缩广告（Full screen）
文件大小：gif:20K
广告尺寸：750*550像素
广告位置：第一屏
形式：打开浏览页面前该广告以全屏形式出现3－5秒，随后消失
擎天柱（Sky-scraper）
文件大小：gif:15K/swf:17K
广告尺寸：130*200像素
广告位置：第一屏第二屏
视频广告
文件大小：gif/swf/flash<8k
广告尺寸：300*250像素
广告位置：第一屏两侧
文字链接（Text link）
规格：不超过10个汉字
广告位置：第一屏第二屏
备注:文字链接长度以不折行为准
简单网页制作实验总结报告
《大学计算机基础》 实验报告 专业名称: 电子商务2班 学号: xxxxxxxxxxx 姓名: x x 指导教师: x x 2011年12月24日
目录 第一章网站主题设计说明 (1) 1.1 主题内容 (1) 1.2 设计思路 (1) 第二章网站内容设计 (2) 1.1 链接1标题 (2) 1.2 链接2标题 (2) 1.3 flash制作说明 (2) 第三章网站技术难点 (3) 第四章心得体会..................................... ..... ......................... (4)
第一章网站主题设计说明 1.1 主题内容 (1) 网站主题为“四季の花”，包括春夏秋冬四个季节的比较典型的花朵及有关花的诗句，色彩缤纷，十分艳丽夺目。 1.2 设计思路 (2) 大多网站都设计的关于音乐，影视，购物等非常热门的东西，本站设计的主题是花，能让人们在闲下来的时候看看花，品品诗歌，所以做有关花的网页是个不错的选择。同时，让人们分清楚春夏秋冬都各有什么典型的花。
第二章网站内容设计 1.1链接1标题：春の花 春天是生命的季节，在这个季节里，万物复苏。所以就找了虞美人，桃花，牡丹，以及海棠花来作为春天的代表。同时配有与这些花有关的诗句。 1.2 链接2标题：夏の花 夏天充满了激情与阳光，我找了兰花，荷花，百合花等来代表这个季节，色彩艳丽，十分醒目夺人。 1.3 链接3标题：秋の花 大丽花，菊花，月季和牡丹花都竞相出现在本网页，色彩缤纷，赏心悦目。 1.4 链接4标题：冬の花 蝴蝶兰，水仙，迎春花，梅花是冬季的代表，他们刻画了一副傲立冬天的坚强的姿态。
网页制作基础教程
网页制作基础教程 一、什么是HTML HTML（超文本标记语言）是网页中使用的语言，他能被网页浏览器（IE或Netscape）解释，从而显示出丰富多彩的信息（图片、文字、声音、影象、动画等）。 制作网页前首先要弄懂什么是HTML。 在IE中点击"查看"→"源文档"，就能看到该网页的HTML代码。下面是个网页文档（model.htm）的HTML代码：
第一段文字。
第二段文字。
【操作】请在记事本中输入以上代码，命名为test1.htm，存于D盘，然后双击打开看看。 标记一般是成对出现的，#FFFFFF表示使用的颜色是白色。 .........
之间是h1号标题字...
之间是h2号标题字 ...之间的文字为红色 HTML是一套国际标准，其标记有几百种，您并无需全部了解他们，只要记住其中常用的十几种，就能够做出很漂亮的网页来。 常用的标记举例：网页设计与制作期末试题及答案(2)(1)
网页设计与制作模拟试题 一、单项选择题(每空1分，共10分) 1. 客户/服务器系统的最大特点是客户机和服务器( D ) A. 必须运行在同一台机器上 B. 必须运行在同一个网络上 C. 必须运行在不同的计算机上 D. 不必运行在同一计算机上 2. 若需要软件把LAN上的客户机从Internet上隐藏起来，并为客户机执行Web 请求，则下面( D )软件能实现此项功能。 A. Internet Information Server B. Index Server C. Personal Web Server D. 代理服务器 3. 通常一个站点的主页默认文档名是( C ) A. Main.htm B. Webpage.htm C. Index.htm D. Homepage.htm 4. 通常，比较好的建立站点目录的习惯是( A ) A. 在根目录下建立一个总的IMAGE目录放置图象文件 B. 直接把图象文件放置在各栏目的目录下 C. 为各栏目建立一个单独的IMAGE目录放置图象文件 D. 在每个目录下建立一个IMAGE目录放置图象文件 5. 以下有关页面布局的说法正确的是( D ) A. 分辨率越高，可供使用的页面尺寸越大 B. 网页布局与平面设计一样，不受页面大小的影响 C. 页眉和页脚中只能出现文本，不能出现图形 D. 页面布局通常是通过手工设计的，目前还没有相应的电脑软件完成这一工作 6. 以下关于HTML文档的说法正确的一项是( A ) A. 与这两个标记合起来说明在它们之间的文本表示两个HTML文本 B. HTML文档是一个可执行的文档 C. HTML文档只是一种简单的ASCII码文本 D. HTML文档的结束标记可以省略不写 7. 正确描述创建一个一级标题居中的句法是( D ) A.
Heading Text
C.最简单的网页
六年级信息技术上册 《最简单的网页》 四课时 一、教学目标： 利用多媒体计算机和互联网络环境，为学生们创设一个开放的学习空间，让学生自主地利用双向互动的教学辅助软件了解、掌握和巩固所学的知识，进一步探究网页的制作方法及技巧，培养学生的计算机综合应用能力、想象力、创造力、自学能力和综合审美能力，为学生深入地掌握FrontPage软件并运用到实际生活打下坚实的基础。 二、教学对象分析： 小学六年级学生的观察、分析、比较、想象等能力逐渐成熟，在性格上表现好奇、大胆，追求自己的个性，比较喜欢开放、自由的学习环境，主观意识较强。并具有了一定的自学能力和模仿能力，但学生还多以感性表象来掌握概念，形象思维仍是学生掌握知识的主要思维方式，学生对知识的吸收绝大部分都是建在感性认识的基础上，兴趣爱好仍然是学习最好的动力。因此，这节课利用Internet 网络教学，激发他们的热情，很好地发挥了学生主观能动性和创造性，使学生成为学习的主人，有利于培养学生的创新思维。 三、教学重点、难点： 掌握FrontPage的打开、保存、退出以及在FrontPage中编辑文字。 四、教学策略及教法设计： 根据教材的目标，以及学生的特点，教学的辅助课件是用FrontPage制作的网页，目的是建立一个双向互动的教学环境，使学生在网络的环境下，进行学生之间互相合作学习，与教师互动学习，充分发挥学生的主体作用，老师的主导作用，培养学生协作能力。根据学生的不同层次，建立“三位一体”的教学编排，既照顾全体学生，又照顾不同层次的提高，在“基础层次”中让学生初步按照教材的示范初步制作出文字网页：“练习层次”，强化练习，制作出完全并有一定水平的文字网页：三是“拓展层次”，拓展FrontPage的应用，插入三维艺术字、图片等。 在教法上，教师主要使用了直观演示法、主动尝试法、协作学习法、成功体
frontpage2000网页制作教程(完全版)
第一课从一个网页开始 Frontpage2000教程第二课编辑网页 Frontpage2000教程第三课使用图形 Frontpage2000教程第四课超链接 Frontpage2000教程第五课使用表格 Frontpage2000教程第六课组件的使用 Frontpage2000教程七课使用框架 Frontpage2000教程第八课使用多媒体 Frontpage2000教程第九课站点操作 Frontpage2000教程第十课表单设计 Frontpage2000教程第十一课创建讨论组 Frontpage2000教程第十二课站点的发布 frontpage2000教程第一课从一个网页开始 作者：未知阅读人次：5527 文章来源：未知发布时间：2004-11-20 网 友评论(7)条 认识Frontpage2000 你是否紧跟时代的潮流上了网？你在聊天室里是否听过别人聊起自己的个人主页，你会不会觉得自己没有个人主页就落伍了？有没有想过自己也要做一个主页？想过？那你还瞎呆在那里干什么？赶快阅读本教程，你就该学会制作自己的主页了。 本教程教你学会使用微软公司的Frontpage2000，学会干什么？当然是做你的个人主页啦。或许你认为制作主页是一门很深奥的工作，需要懂得大量的计算机知识。我现在要告诉你，你错了。在这个流行图形操作系统的今天，制作主页不再需要你去学习复杂，烦躁的HTML语言了，你只需要知道一个概念：主页（也称网页，怎么样称呼都无所谓）就象一张白纸，你可以在上面写字，画画等等，通过自己的设计，那张白纸可以变成很漂亮。做主页时就是这个概念，只不过我们写字，画画是用笔和白纸，而做主页我们是用鼠标，键盘和Frontpage
网页设计的规范和流程
网站创建的基本流程： 一、策划阶段 这一阶段的主要任务是收集、研究和分析用户需求，讨论Web内容，制定计划。 二、设计阶段 网站形象设计，它主要包括设计网站的标志（logo），设计网站的标准色彩，设计网站的标准字体。 网站主题及风格设计，从主题策划到网站风格创意等内容。 网站内容设计 清晰性：网站内容必须简洁明了，直奔主题，非常有效地讲清楚你想说的内容。 创造性：网站观点会使访问者产生共鸣，发出认同吗？这可以是访问者判断一个公司是否有实力，从而影响到购买动机的重要因素。 突出三个重点： 突出你的产品的优点和与众不同的特色； 突出帮助访问者辨别、判断同类产品优劣方面的内容； 突出内容的无庸置疑的正确性。
网站技术因素考虑 浏览器脚本兼容性。 面对屏幕分辨率的适应。 在网络上的运行速度。 网页是否需要交互操作。在网页中加入JavaScript脚本，或在服务器端提供ASP或PHP支持。 安装插件：如果网页中使用了flash动画、Shockwave媒体对象、Real 视频等，需要相应的插件，应考虑用户获取插件的途径。 网站目录结构设计 规划网站目录结构。 目录名及文件名都不能用中文。 文件名中可以包含数字或下划线，但不能含“减号”。 主页的文件名应为index.htm或Default.htm（系统默认的主页名称）。主页文件放在站点根目录下，其余文件均应归类到相应的子目录下。网站的链接设计 网站的链接设计是指网站页面之间相互链接的拓扑结构。它建立在目录结构的基础上。
网站布局与首页设计 建议您用一张白纸和一支铅笔，当然用作图软件photoshop等也可以。这属于创造阶段，不讲究细腻工整，不必考虑细节功能，只以粗陋的线条勾画出创意的轮廓即可。尽你的可能多画几张，最后选定一个满意的作为继续创作的脚本。
制作一个简单的网页
制作一个简单的网页 教学目标: 1、知识目标:了解网页的基本概念以及建立网站的一般方法,学习制作只有文字的网页. 2、能力目标：让学生通过学习掌握建立网站的方法,学生通过学习能够建立只有文字网页. 3、情感目标：培养学生主动实践，勇于实践的勇气，和敢与参与的意识。教学重点: 建立网站制作网页 教学难点: 建立网站制作网页 教法、学法分析: 由于本节课作为制作网页的基础知识,学生可以根据所学知识自己进行操作,教师在此过程中进行适当的指导既可。为了让学生能够充分了解网页的概念，采用教师讲解的教学方法，为了培养学生主动实践的勇气与参与意识，采用学生自主学习的方法。 教学过程: 引入： 我们已经学习过因特网的基础知识和应用，实际体验了“网上冲浪”的滋味，网上世界的确很精彩！但是我们有什么方法能让更多的人了解自己或者自己的学校或家乡呢？最好的方法就是制作一个关于自己或家乡的网页并把它发布到网上。通过了今天的学习我们就能够做到了。
一、网页的概念： {通过多媒体展示“我的家乡”网页，向学生介绍网页的组成，让学生了解网页的概念，并做出总结} 网页就是把用文字、图形、声音、影视等多媒体形式表达的信息，以及分布在因特网上的相关信息，相互链接起来而构成的一种信息表达方式。 二、制作网页前的准备工作 1、认识网页制作工具FrontPage {学生打开FrontPage软件，通过以前学习过的知识认识该软件的窗口，并了解各栏中按钮的作用。} 2、准备好网页素材 [学生在因特网上查找关于“我的家乡”的相关资料，并保存在自己的文件夹中，以便在制作网页时作用。] 三、建立“我的家乡”网站 [根据“做一做”建立一个自己的网站“命名为”我的家乡。] 布置作业: 构思自己的网站，并在小组中进行讨论。 [学生思考问题，并进行操作。] {建立网站后，我们还需要在网站中加入网页，这样我们的网站才能充实起来。} [学生在自己的文件夹中建立一个站点命名为“我的家乡” 根据“做一做”中的提示制自己作主页并保存。然后分别建立其他几网页陕西风景欣赏、陕西古诗文欣赏、自我介绍。]
怎样制作网页制作网页详细操作步骤
怎样制作网页制作网页详细操作步骤 怎样制作网页制作网页详细操作步骤 制作网页主要有以下一些工具 Frontpage：office自带的一个工具，操作简单，实用，学起来 比较轻松，功能不咋地，我不太喜欢。 Dreamweaver：这是网页三剑客之一，专门制作网页的工具，可 以自动将网页生成代码，是普通网页制作者的首选工具，界面简单，实用功能比较强大。建议初学者选用。 另外一个工具就是代码编辑工具，例如写字本、EditPlus等， 这些工具主要编辑asp等动态网页。 大型的网站往往还需要数据库的支持，所以还得懂数据库。sql、甲骨文等。 总之，掌握好网页制作，能独立完成一个网站的制作工作，那就不要考虑吃饭问题。随便混就好了! 网站设计八步骤 由于目前所见即所得类型的工具越来越多，使用也越来越方便，所以制作网页已经变成了一件轻松的工作，不像以前要手工编写一 行行的源代码那样。一般初学者经过短暂的学习就可以学会制作网页，于是他们认为网页制作非常简单，就匆匆忙忙制作自己的网站，可是做出来之后与别人一比，才发现自己的网站非常粗糙，这是为 什么呢?常言道：“性急吃不了热豆腐”。建立一个网站就像盖一幢 大楼一样，它是一个系统工程，有自己特定的工作流程，你只有遵 循这个步骤，按部就班地一步步来，才能设计出一个满意的网站。 一、确定网站主题 网站主题就是你建立的网站所要包含的主要内容，一个网站必须要有一个明确的主题。特别是对于个人网站，你不可能像综合网站
那样做得内容大而全，包罗万象。你没有这个能力，也没这个精力，所以必须要找准一个自己最感兴趣内容，做深、做透，办出自己的 特色，这样才能给用户留下深刻的印象。网站的主题无定则，只要 是你感兴趣的，任何内容都可以，但主题要鲜明，在你的主题范围 内内容做到大而全、精而深。 二、搜集材料 明确了网站的主题以后，你就要围绕主题开始搜集材料了。常言道：“巧妇难为无米之炊”。要想让自己的网站有血有肉，能够吸 引住用户，你就要尽量搜集材料，搜集得材料越多，以后制作网站 就越容易。材料既可以从图书、报纸、光盘、多媒体上得来，也可 以从互联网上搜集，然后把搜集的材料去粗取精，去伪存真，作为 自己制作网页的素材。 三、规划网站 一个网站设计得成功与否，很大程度上决定于设计者的规划水平，规划网站就像设计师设计大楼一样，图纸设计好了，才能建成一座 漂亮的楼房。网站规划包含的内容很多，如网站的结构、栏目的设置、网站的风格、颜色搭配、版面布局、文字图片的运用等，你只 有在制作网页之前把这些方面都考虑到了，才能在制作时驾轻就熟，胸有成竹。也只有如此制作出来的网页才能有个性、有特色，具有 吸引力。如何规划网站的每一项具体内容，我们在下面会有详细介绍。四、选择合适的制作工具 尽管选择什么样的工具并不会影响你设计网页的好坏，但是一款功能强大、使用简单的软件往往可以起到事半功倍的效果。网页制 作涉及的工具比较多，首先就是网页制作工具了，目前大多数网民 选用的都是所见即所得的编辑工具，这其中的优秀者当然是Dreamweaver和Frontpage了，如果是初学者，Frontpage2000是首选。除此之外，还有图片编辑工具，如Photoshop、Photoimpact等;动画制作工具，如Flash、Cool3d、GifAnimator等;还有网页特效 工具，如有声有色等，网上有许多这方面的软件，你可以根据需要 灵活运用。
网站设计基本流程图
网站设计的基本流程图 网站制作过程有五个阶段：需求调查阶段，技术分析阶段，页面策划阶段，网站设计阶段，网站改进阶段。流程图： 图1 需求调查阶段流程图
图2 技术分析阶段流程图
图3 页面策划阶段流程图
图4 网站设计阶段与网站改进阶段流程图 上述过程中，每个菱形标记的环节都是判断和选择的过程，并反馈信息，重复这个过程，直至满意后，进入下一个环节。 在信息高速发展的今天，信息管理已经成了一个公司管理的重要问题。因此，有一套很好的信息管理模式，有一个综合信息网站就显的很重要了。本文全面的分析了一个综合信息网站的结构、功能、用途以及对公司产生的重要影响，对网站的建设、维护和推广具有很好的指导作用。 一个综合信息网站，其功能主要体现在信息管理上面。大中小型企业可以利用本网站进行企业内部人事管理、产品销售管理、产品生产管理、网上电子商务、对自己企业进行网上宣传、进行网上交流等。其客户主要通过上网了解本公司的业务及产品情况，了解公司的人事状况，商业动态等。 对于一个企事业单位而言，它要进行各种综合业务，要及时了解企业内部的情况，要及时向外界公布信息，进行人事管理、进行产品销售、利润预算、与外界联系，因此，拥有一个综合信息网站是非常必要的。用综合信息网站来对企业进行管理，进行电子商务是很必要的，有利于公司的发展，有利于提高公司的效益，有利于提高市场竞争力，有利于树立公司品牌形象，有利于扩大公司的影响力。因此，本网站是可行的，建立本网站是必要的。 作为一个综合信息网站，本网站是可行的，虽然有些功能现在还不够完善，但就目前而言还是有很大的利用价值，以后我们还将把本网站做得更精，更完善。 一、系统概述二、系统需求分析三、系统功能分析与设计四、系统数据库设计五、系统运行维护及说明 六、网站结构与设计：七、网站栏目分析与设计八、网页界面和程序代码：九、网站界面：十、参考文献： 下面我们从几个方面来分析网易网站的设计思想： 一、架构 1、网站首页是兵家必争之地，每个频道负责人都想在显眼的位置推荐自己的产品或者资讯来增加曝光率，总是希望把所有东西一下子让用户看到，但最后我们就发现你放的东西越多，用户就根本找不到他想要的东西，快速离开的可能性很大。在国内的门户网站都习惯了资讯多、页面长，什么都往首页堆，感觉内容越多会显的越大气，但用户的耐性是有限的，所以网页的通透性对国内网站很重要，每一屏的架构变化不宜太多，适当就好，主次内容信息位置保持一致性，不然用户每浏览到下一屏都需要重新去解读架构，思考该从那里开始阅读，不但用户的耐性被消耗掉还会增加用户的浏览成本，所以网站首页的架构必须清晰明了，保持较好的通透性，减少用户的浏览成本。 例如网易首页，采用三栏式结构，左栏为导航推荐区提供网易特色产品入口，中栏为主要资讯区，提供快速、全面、动态的各类新闻资讯，右栏为特色栏目区如博客、论坛等。各栏的内容属性清晰，用户能快速找到他们需要的信息畅顺的浏览不需要多余的思考。 据研究分析用户浏览网页的视觉一般是从左到右、从上至下的一个浏览习惯。网易网站的架构也在往这个方向改进，不断的提升用户体验。网易资讯类页面大致可分为3类架构，下图是3类架构的视觉走向图。 据研究分析用户浏览网页的视觉一般是从左到右、从上至下的一个浏览习惯。网易网站的架构也在往这个方向改进，不断的提升用户体验。网易资讯类页面大致可分为3类架构，下图是3类架构的视觉走向图。 网易首页采用第一种架构，各频道首页例如新闻、体育、娱乐等采用第二种架构，新闻最终页采用第三种架构。这样可使用户保持统一的视觉走向，无论浏览那个页面用户都知道他们需要的资讯在那里，符合用户浏览网页的习惯，减少用户浏览成本。 二、风格 时尚简单的外观设计和界面设计，也是受欢迎的其中原因之一，虽然网站设计不能称作为一件艺术创作，但用最少的元素设计出最好的作品这个也是网站设计中所追求目标之一。 能用一根线表现出效果就没有必要使用2根线，能用文字表示清楚的就不需要用图片。页面设计如果使用过多装饰元素，会造成页面庞
简单的网页制作教程-设计一个个人网站
题目：设计一个个人网站 一、要求： 1．使用Dreamweave网页工具制作一个个人网站； 2．包含至少四个网页: 包括首页、个人简介、个人相册等（可随意设计），网页之间用超链接相连。 3．网页中要有图片和文字内容，用表格进行页面布局； 4．添加至少两种行为，并为首页添加背景音乐。 5. 在网站中设计一个表单页面。 6. 首页必须包含页面标题，动态按钮导航栏。 首先新建一个文件夹，文件夹的名字不能为汉字，做网站所有的路径都必须用字母或者数字， 不能用汉字，我们就用名字吧，譬如说名字张三，那文件夹名字就是zs，如图 打开Dreamweaver软件，得到图 做网页要新建站点，关于站点配置服务器什么的，这里不讲了，只讲建立站点。 选择站点——新建站点。 我们建的文件夹就是站点根文件夹。
新建站点后得到这样一个界面 点选高级，得到界面 站点名称与我们建文件夹得名字相同，zs填进去就可以了本地根文件夹就是我们新建的那个文件夹zs， http地址为http://localhost/zs
接下来选择左侧栏里远程信息 点击无后面的那个三角，选择本地网络，远端文件夹同样选择我们新建的那个文件夹 接下来点选左面菜单里的测试服务器， 点选访问后面那个三角，选择本地网络，测试服务器文件夹也为我们建好的文件夹zs，在url前缀后面加上zs
然后点击确定就可以了得到这样一个界面。 下面看老师的第一条要求，是要至少四个网页，那我们就做四个 单击新建，然后单击 接下来，选择 然后单击创建，接下单击文件——保存，保存这个文件，保存在我们一开始建好的文件夹里面，保存名字不能是汉字，只能是字母或者数字，因为我们只坐四个网页，可以简单一点，把这四个网页命名为a、b、c、d，或者1、2、3、4，当然一个网站默认的索引首页名为index，这里也用index，
会考专题之网页制作操作题
会考专题之网页操作题 上机前准备：请同学们们下载天安门的图片、一张蛋糕图片到c:\windows文件夹下，并分别取名为“天安门.jpg”和“蛋糕.jpg”以备后面操作使用。 用Frongtpage（网页制作软件）实现下列操作： 1、设置网页背景、插入超链接 C:\ata_mso\testing\154752-566\frongtpage_bo3\国庆.htm页面进行以下操作： （1）将网页的背景颜色改为红色。 （2）在网页上输入文本“天安门”，并把天安门建立超链接，链接到图片天安门.jpg （3）将该网页另存为“中华.htm”仍保存在： C:\ATA_MSO\testing\154752-566\frongtpage_bo3\文件夹下。操作步骤： ①点击屏幕左下角的图标启动frontpage。 ②设置网页背景：右单击网页空白处，执行“网页属性…”,打开格式标签，设置背景颜色为红色。 ③插入超链接：输入文本“天安门”→选中“天安门”→单击“插入”菜单→选择“超链接”→在左边选择“原有文件或网页”→然后在查找范围中按照给定的位置找到并选择“天安门.jpg”→确定。 ④保存：“文件”菜单→“另存为”→找到保存位置→文件名为“中华.htm”→保存。
2、设置网页标题、输入文字、插入图片 用Frontpage创建空白页面并进行以下操作：（1）将网页标题设为“爱我中华”。（2）在网页中输入文字“隆重庆祝新中国成立60周年”并将字体设置为黑体、24磅、居中，颜色为红色。（3）在文字下放插入一张名为天安门.jpg的图片 （4）将该网页命名为“index”，保存在C:\windows文件夹下。操作步骤： ①点击屏幕左下角的图标启动frontpage。 ②设置网页标题：右单击鼠标，执行“网页属性…”,在常规标签的标题栏中输入标题，“爱我中华”→确定。 ③在网页中输入：隆重庆祝新中国成立60周年—选中文字—格式—字体—依次设置字体为黑体、字号为24磅—确定，利用“格式工具栏”设置：对齐方式为居中、字体颜色为红色。 ④插入图片：“插入”菜单→图片→来自文件→选定“天安门.jpg”→插入。 ⑤保存。“文件”菜单→保存→找到保存位置→文件名为“index.htm”,保存类型选“网页”→保存。 3、设置网页背景、插入表格、插入图片 用Frontpage对d: \birthday.htm页面进行以下操作： （1）将图片d:\图片\背景.jpg 设置为该网页的背景
网页设计过程及步骤
一、网页设计过程及步骤 网页设计过程 网页是信息传播的媒体，但又不同于传统媒体，有自己的特殊性。网页具有交互性、多维性、整合性、多维性、不确定性等特点，它与技术的结合更为密切，网页的超级链接功能也使它比传统媒体更具吸引力。正是因为这些特殊性，网页的设计与发布也有一个特殊的流程。 1．项目规划马克思将做事的计划性看成是人区别于动物的本质特征之一。如果把一个网站比喻为一所房子，那么，没有事先规划和设计建造起来的“房子”是不会漂亮、牢固的。设计者必须认真对待站点开发计划，这样才能使网站的建设经得起时间的考验。这一阶段可称为项目规划阶段。 本阶段，首先要明确建立站点的目的，也就是先搞清楚要建一座什么样的“房子”。这座“房子”可能有以下用途： ●个人主页：发布个人信息，提供个人服务，展示个性，同别人广泛地交流，比如共享业余爱好等。 ●电子商务：首先，有利于树立企业的形象。目前国内很多大企业都非常重视企业形象这种无形资产，建立企业网页是宣传自己的重要手段。拥有国际域名和主页代表了企业的实力、规模和品位。 ●电子出版内容的更新、传递的速度都比传统报刊杂志更快捷，影响更广泛。 ●社区服务：可以通过邮件列表、新闻组、聊天室和电子公告牌促进社区人员的信息交流，为背景和地址各不相同的人提供活动的场所。 ●网上教育：远程教育、终身教育和开放式教育都因此而变为现实。这样的站点主要靠内容来吸引浏览者，而不是华而不实的设计技巧。
●休闲娱乐：包括影视站点、音乐站点、旅游站点、游戏站点等，都为浏览者提供了休闲娱乐的场所。要求设计者能够提供各种多媒体信息，具有很强的编程能力和灵活的设计思想。 ●艺术欣赏：如何把作品的含义表达给浏览者，是艺术站点应该考虑的问题。因此，设计者应该与艺术家保持良好的沟通。另外，准确地运用多媒体也是设计好艺术站点的关键。 网页设计的目的，就是满足浏览者的需求。在进行网页设计时，设计者应该明确知道来这座“房子”访问的人都想得到什么。首先必须考虑到服务对象的技术背景、受教育程度、阅读能力、兴趣爱好、消费习惯、上网方式等，然后选择相应的网页内容和形式。每一个网页都是一次机遇和挑战，设计者必须在溯rJ阶段就认真考虑该为浏览者提供哪些适宜而有趣的服务，以便迎来“回头客”。 2．内容组织无论设计一个什么样的站点，三个方面的工作： ①搜集筛选将要发布的内容组织都将是最大的挑战。这包括组织内容、编写脚本。 ②组织内容。梳理清楚上述问题以后，就可以进行第二步工作了。组织内容这一阶段，要求设计者把搜集到的信息，用清晰明确的文字表达出来。设计人员可以运用一些语言技巧，确保浏览者能够准确且迅速地理解网页所要传达的意图。 ③导航。导航，是为了让浏览者在网页上迅速找到所需的信息。因此，网页应提供目录索引、在线帮助、站内搜索等服务。印刷品中导航问题不是那么突出。如果一个句子在页尾突然终止，读者会很自然地翻到下一页查找剩余部分。 在组织内容时还应注意以下问题：
网站设计的一般步骤
一：网站设计的一般步骤 网站制作简易流程介绍 1 策划与草图 2 设计与制做 3 切割与导出 4 编辑与模板 5 动画与广告 6 链接与上传 按软件及长度划分制做步骤: 1 策划与草图 1.1所有网站和其它设计作品的过程都是从策划开始的。这是最能体现你的才华和创造力的地方。人最大的区别于其它动物的地方就是会思考，会创造，而且唯有这点是难能可贵的!我们必须要在动手打开PS或FW制做界面前就要完成一个网站最最关键的策划部分，它将直接影响 这个网站的成败与否。一个优秀的网站，不仅做得漂亮，而且要方便浏览，可读性强，简洁明快! 网站的风格，用色，版式，布局，栏目甚至每个细小的图标都要经过精雕细琢，深思熟虑。而风格的制定要取决于你所做网站的浏览人群和读者职业背景、文化程度和修养爱好等，只有投其所好才能最大化地产生共鸣;另一方面取决于公司的类型和企业法人的喜好，如果不是要强加入你自己的意志的话，那上述几点已经制定了网站大致的努力方向了! 1.2本站是商业化的网站面向企业为主，所以我采用简约风格，亮丽明快的颜色和风格，只要学学平面构成和色彩构成就知道如何按其风格去布置各个元素和内容，以及用何种颜色来营造你要表达的效果了，包括冷暖明暗都是很关键的。大面积的中性色不刺眼，而重要的引导视线可以让亮色来担当，冬天喜欢暖色夏天喜欢冷色是人之常情，蓝色那种给人以信任和科技的底韵是我选择它的原因，而像橙、黄等促进食欲的颜色更容易受到食品网站的青睐!
1.3本着简洁科学的分类原则来划分栏目:首页客户中心窄告介绍合作媒体常见问题媒体报道关于我们 栏目如果划分不好的话，影响框架的调整，后果就是:重头再来了，郁闷吧? 本网站主要面向潍坊企业，所以要做得本地化，让人看了感觉亲切，而且要做得漂亮，废话!! 1.4好了，完成上面这些后请拿起笔在纸上按你的创意和设想画一草图，尽是具体些，最好精细到每处阴影和描边!这步很关键的说! 1.5本节最后就是准备制做网站时所需要的素材了，包括图标，LOGO，广告语，内容介绍等这都是最基本的! 2 设计与制做 2.1如果草图都已经绘制完美后就可以打开PS或FW开工制做和设计我们的界面了，在这里我使用PS，虽然没有FW的高效和专业但更加灵活和自由，这是我最喜欢的，也因为用惯了嘛!^^养兵千日用兵一时，平时的练习和学习在这里派上用场了!呵呵! 2.2可以在新建的778*600页面中先打框架然后再采用逐步细化的方法，还可以采用你自己独特的手法，比如透明玻璃水晶按钮等效果来营造特别的风格，要力求简约和精致!不要放过每个细节的刻画，即使是1*1的5%透明度的阴影都会给你的页面增彩，别以为别人看不见! 2.3最好养成分层的习惯，这样可以方便分类和编辑，不至于把上百个图层放在一下层级里搞得一团乱麻，分不清楚。 作为一名优秀的设计师应该有条理，所以请养成分类并为每个图层命名的习惯，这决不是浪费你的时间! 3 切割与导出 无论是PS还是FW，哪怕是AI做的设计界面，在切割的原则都是一样的，请遵从以下几个方面: 3.1首先要按大致的框架切割，如国字型或T字型，注意其完整性
怎样制作自己的网页
和怎样制作自己的网页 时间:2009-09-22 19:35来源:未知作者:大宝库点击:9865次 阅读工具：字体：大中小 一 首先，可以告诉想学网页制作的朋友。学习制作网页和学习其它知识一样，是要有基础的。在基础之上学习起来会比较轻松和快捷的。其次，要清楚学习它是用来做什么。 建议你要具备的条件：对电脑熟练操作，使用电脑最好在一年以上，对网页设计感兴趣，有较充足的学习时间，熟悉office办公软件。当然，这些不是一定必须的。 第一阶段：开始时最好是学些网页编辑软件，如：FrontPage、Dreamweaver.这样可以使您更了解网页制作与运营的原理。最好使拿本教程来学学，结合教程边学习边制作。 第二阶段：会用网页制作软件后，已会制作一个较完整的网站了。但为了能使自己设计制作的网页尽善尽美，还是学习网页的核心技术吧！网页编辑语言（包括:html、css、javascript、asp、xml等）。你可以选择地学习。 第三阶段:结合你自己已掌握地知识来开发网站，可以开发出别人给你定义的目标网站。到了这个时候，你就成为真正的网站开发者了。 怎样制作网页，不是说一两篇文章能够说清楚的。以上介绍的是制作网页的主要纲要，希望能够给想要学习制作网页的朋友一个参考。 二 一、工具 1、空间 网页做好了肯定是要发表上网的，所以必须先申请一个空间；免费的空间不是很稳定，容量又小，也不好申请，建议到大的网站如新浪、网易去先买一个个人空间，大概有个20M以上的就可以了。 2、软件 推荐使用Dreamweaver6.0中文版，这个软件最大的特点就是“所见即所得”，也即是制作过程中看到的，便是到时发布到网络上的。 二、教程
简单网页制作教学设计
《简单网页制作》教学设计 一、设计意图： 目前网络对学生的吸引力很大，学生上网都会浏览网页内容，对网页的制作也有很大的兴趣，想知道一个网页是怎样制作成功的。但是网页的制作相对复杂，对于一些的代码的编辑学生也较难理解，因此本课选择了FrontPage网页制作工具，引导学生简单的了解网页制作的过程，采用了所见即所得的形式避开代码的繁琐，调动学生自行设计的积极性，对网页制作有一个简单的入门了解。 二、教学目标 1、知识目标 （1）理解网页制作的简单步骤。 （2）学会用FrontPage的制作简单网页。 2、技能目标 （1）掌握的FrontPage的背景添加的操作。 （2）掌握FrontPage的文字编辑、艺术字、图片的插入的操作。 （3）知道HTML的简单编码。 3、情感目标 （1）培养学生的口头表达能力、操作和分析概括能力。 （2）培养学生展示自我、表现自我的能力。 （3）培养学生独立思考问题、解决问题的能力和团结协作精神。 （4）在网页制作的过程中，提高学生对FrontPage的认识。三、重难点、问题预测及对策
1、重难点 （1）重点：FrontPage的基本操作。 （2）难点：HTML的理解。 2、问题预测 本节课是网页制作的第一节内容，需要学生掌握的技能并不困难。由于在学习网页制作的过程中，需要培养学生的制作网页的积极性，才能引发学生对网页制作的兴趣，实现自主学习，自主开发。 3、对策 以制作班级自己的主页引起学生注意，引发学生的兴趣。让学生运用FrontPage的插入、背景修改等工具，通过作品展示激发学生的动力。 在教学过程的设计上，通过自主设计自己的个人主页来达到解决一个个知识点的目的，同时通过学生自己创作，引导学生正确的审美情趣和创作激情。 四、课前准备 精美网站、优秀班级主页、素材图片等。 五、教学流程 1、情感导入：通过优秀班级主页欣赏，引发学生兴趣，跃跃欲试。 2、自主学习：引导学生做自己班级的主页。 3、示范教学：学生归纳总结，老师帮助、提醒，使学生掌握正确的操作步骤。
实验一做一个简单的html网页
实验报告 学生姓名：学号： 一、实验室名称：软件大楼302 二、实验项目名称：用HTML语言制作简单的网页 三、实验原理： 1.网页 （1）网页就是在浏览器上看到的一页，网页也称为Web页。 （2）主页通常是进入网站首先浏览的网页，具有引导用户浏览整个网站内 容的作用。 （3）超链接是网页中的特殊标记。它指向了WWW中的其他资源，如其他 网页、网页的另一个段落、声音文件等。这些资源可以位于自己的计算机上，也可以位于其他计算机上。用作超链接的标记可以是一段文字、一幅图像，也可以是一幅图像的一部分。在浏览网页时，单击超链接就可以跳转到超链接所指向的资源。超链接像一根一根的线一样，将各种网页链接在一起，形成一个庞大的信息网。 2.HTML语言 （1）HTML语言就是超文本标记语言，是网页制作的基础，也是基本的工具，使用其他任何工具制作的网页，最终都要以HTML方式存储在计算机里。 （2）HTML的脚本可用任何一种文本编辑器进行编写，如记事本、Microso ft Word等。保存时要将脚本保存成纯文本格式，扩展名必须是.htm。 （3）HTML脚本的基本结构。HTML脚本总是以标记开头，标记结尾，在和标记之间是HTML的所有内容， 一般情况下它分为两部分：头部和主体。头部总是由
和标记定义的，其中包含了HTML脚本的标题和说明信息；头部下面是HTML脚本的主体部分，它以
作为起始标记，作为结束标记，其中所包含的就是在 浏览器中所看到的内容，包括文字、图片、动画等。 3.FrontPage，dreamwerver，notepad 以FrontPage为例，它是一种简单易学的Web管理和网页制作的软件。Front Page2000的窗口，如图1.1所示。 在窗口工作区的左下方是网页视图模式的3个状态按钮：“普通”、“HTM L”和“预览”。网页视图模式的默认状态是“普通”，用于以所见即所得的方式编辑网页。“HTML”网页视图模式用于以HTML语言的方式编辑网页。 制作网页过程中，想查看网页的制作效果，切换到“预览”网页视图模式即可。 切换网页视图使用鼠标单击相应的状态按钮即可。 图1.1 FrontPage 2000的窗口 选用其他网页开发工具也是可以的这里没有限制 四、实验目的： 1.简单了解HTML语言。 2.认识网页以及网页的结构。 3.掌握用HTML语言制作简单网页的方法。 五、实验内容：网页制作教程指导
第一章网页设计基础 教学目的： 本章将带领用户认识Dreamweaver MX，了解其新增功能。在开始学习该软件之前，了解一下Dreamweaver MX 的工作界面的一些简单设置。通过本章的学习，用户能熟悉Dreamweaver MX的工作界面，并能自行设置具有独特的个性化的工作环境。理解DW站点的作用，并掌握建立站点的方法及站点维护的方法。 教学重点： 1、认识Dreamweaver MX。 2、新增功能。 3、Dreamweaver MX主窗口。 4、自定义工作环境。 5、利用Dreamweaver建立站点的方法 教学难点： 1、认识Dreamweaver MX。 2、新增功能。 3、自定义工作环境。 教学方法：讲演法 教学课时：2课时
教学内容与教学过程： 一、介绍网页制作这门课程 1．学习这门课程的目的：让学生掌握HTML语言、以及利用相关网页制作工具制作网页的基本方法与技能。学生通过这门课程的学习，能够具备综合运用专业软件进行小型网站开发和静态网页页面设计的能力，同时积累一定的实践经验，为今后从事相应的网站设计制作工作打下良好基础。 2．这门课程的教学内容：在制作软件上：以网页制作软件DreamWeaver MX为主干进行网页制作教学，同时选择了Flash MX版本来制作网页中的动画素材，选择了图形图像工具Photoshop 7.0版本软件来处理和制作网页中的图片。教学内容安排上按照学生学习网页的渐进规律划以及学校制订的计划主要学习第1、2、3、5、6、9章，主要包括网页制作的基础知识、Dreamweaver MX软件的使用，初学者利用现有的素材设计制作出一个简单的网页；利用Photoshop7和Flash MX软件来美化网页，以及网页布局和用色方面的美术知识，如何设计网页的版面和结构，还要能对供给的素材按照网站的特点进行适当的美化处理；还能掌握中小型网站的建立方法。 3．这门课程的教学和学习方法：教学上以一个个案例为基础，采用项目教学的方法，由浅入深的介绍网页制作的各个知识点；教学中以学生会操作为目的，重视学生动手能力和自学能力的培养同学们学习时除了要掌握相应的操作技能以外，更要重视操作技能的使用，要努力完成每章教学案例的制作以及课后素材案例。在不断的练习过程中熟悉和升华所学的操作技能。同时，要学会学习，即要学会与老师或同学之间技术心得的交流，要学会能自主的依靠其他资源（网络、报纸杂志等）来扩展所学的知识体系。 课前思考： 1、Dreamweaver软件是干什么用的？ 2、试用一下Dreamweaver，你觉得这个软件在界面上更象Word还是Photoshop，为什么？ 3、试用一下Dreamweaver，按默认格式保存，文件的扩展名是什么？ 4、双击网页文件，会自动打开Dreamweaver软件吗？这点上与Word软件相同吗？ 1.1 Dreamweaver的基本概念 1、了解Dreamweaver与IE有什么区别？ Dreamweaver是制作网页的工具，用它可以生成.htm或.html文件，而IE是浏览网页的工具，用IE只能看网页，而不能改网页，修改网页还是需要网页制作工具。 2、做网页只能使用Dreamweaver一种工具吗？ 常用的网页制作软件有Dreamweaver和FrontPage。Dreamweaver由美国Macromedia公司开发，虽然初学者感到比较难学，但它的功能更强大，生成的网页代码质量好，是当今最流行的网页制作工具，适合专业网页设计人员使用，近年来它还获得过不少大奖呢。Frontpage是微软公司开发的Office办公软件中的一部分，比较容易上手，但功能不太强大，我们只在需要时（如向网页中加入微软格式的视频），才会使用FrontPage。 3、Dreamweaver最新版是多少？ Dreamweaver从2.0、3.0、4.0、MX到现在最新的MX2004版，平均每过一年就出一个新版。可见计算机是多么的富有活力。今年常用的是MX版，建议大家在家里的电脑上也将这个版本，以便与学校的相同。对于软件，我并不认为版本越新越好，它们的基本功能还是相同的，一般版本越高，对计算机的要求也越高，如果计算机配置不高，初学时还是找个低版本比较好，当然所装的软件必须与书本上的相同，这也是学习其它软件的基本要求。 4、Dreamweaver与Firework、Flash有何关系？ 它们都是Macromedia公司的软件，Dreamweaver是网页制作工具，Firework是图形处理工具，与photoshop相似，一般用于网页图形的制作，Flash是动画制作工具，在制作好的网页时，一般先用Firework和Flash先制作好网页中要用到的图形和动画素材，再用Dreamweaver把这些素材做成一张网页，只会Dreamweaver，不会图形处理和动画制作，是做不出好的网页的。有人把这三个软件称作网页设计“三剑客”。 1.2认识DreamWeaver 1.DreamWeaver的作用和特色 2.DreamWeaver功能界面的分解 3.DreamWeaver工作流程 4. DreamWeaver 的版本、安装、打开、保存等操作演示：练习制作第一张网页——作业一在主窗口中输入以下文字，并按以下格式排版，最后把文件以“学号姓名.htm”为名保存在桌面上。注意难点：设置字体、水平线、二个全角空格、回车会自动空一行，Shift+回车就不会空行了。